fixed align in range and added contours tab

This commit is contained in:
ori agranat
2019-03-24 22:11:29 +02:00
parent e87f2a310d
commit fffb981f9f
5 changed files with 45 additions and 20 deletions

View File

@@ -12,6 +12,7 @@
</template>
<MenuItem name="/vision/input" to="/vision/input">Input</MenuItem>
<MenuItem name="/vision/threshold" to="/vision/threshold">Threshold</MenuItem>
<MenuItem name="/vision/contours" to="/vision/contours">Contours</MenuItem>
</Submenu>
<Submenu name="/settings">
<template slot="title">
@@ -39,7 +40,6 @@
<Col span="12">
<router-view></router-view>
</Col>
<Colspan="12">
<img src="./assets/logo.png">
</Col>
</row>

View File

@@ -1,8 +1,8 @@
<template>
<div id="Threshold">
<chrange title="Hue" :value="[0,10]"></chrange>
<chrange title="Saturation" :value="[0,10]"></chrange>
<chrange title="Value" :value="[0,10]"></chrange>
<chrange class="spacing" title="Hue" :value="[0,10]"></chrange>
<chrange class="spacing" title="Saturation" :value="[0,10]"></chrange>
<chrange class="spacing" title="Value" :value="[0,10]"></chrange>
</div>
</template>
@@ -25,5 +25,7 @@ import chselect from './ch-select.vue'
</script>
<style scoped>
.spacing{
margin-top: 20px;
}
</style>

View File

@@ -1,18 +1,18 @@
<template>
<row type="flex" justify="start" align="middle" :gutter="1" >
<Col>
<h4 style="width:100%">{{title}}</h4>
</Col>
<col >
<InputNumber style="margin-left: 5px ;width:10%;" v-model="value[0]" size="small"></InputNumber>
</col>
<Col span="14">
<Slider range style="margin-left:10px;" v-model="value" @on-input="handleInput"></Slider>
</col>
<col >
<InputNumber style="margin-left: 5px ;width:10%;" v-model="value[1]" size="small"></InputNumber>
</col>
<row type="flex" justify="start" align="middle" :gutter="1">
<Col span="4">
<h4>{{title.charAt(0).toUpperCase() + title.slice(1)}} :</h4>
</Col>
<Col span="4" style="text-align: left">
<InputNumber style="align-self: flex-start;" v-model="value[0]" size="small"></InputNumber>
</Col>
<Col span="10">
<Slider range v-model="value" @on-input="handleInput"></Slider>
</Col>
<Col span="4" style="text-align: right">
<InputNumber style="align-self: flex-end;" v-model="value[1]" size="small"></InputNumber>
</Col>
</row>
</template>
@@ -33,7 +33,7 @@
}
</script>
<style >
<style>
h4 {
color: #e6ebf1;
}

View File

@@ -0,0 +1,21 @@
<template>
</template>
<script>
export default {
name: '',
data() {
return {
}
}
}
</script>
<style scoped>
.spacing{
margin-top: 20px;
}
</style>

View File

@@ -3,13 +3,15 @@ import Input from "./components/InputTab.vue";
import Threshold from "./components/ThresholdTab.vue";
import System from "./components/SystemTab.vue";
import Camera from "./components/CameraTab.vue";
import Contours from "./components/contourTab.vue";
const routes = [
{ path: '/', redirect: '/vision/input'},
{ path: '/vision/input', component: Input, name:'input' },
{ path: '/vision/threshold', component: Threshold ,name:'threshold'},
{path:'/settings/system', component: System },
{path:'/settings/camera', component: Camera}
{path:'/settings/camera', component: Camera},
{path:'/settings/contours', component: Contours}
]
const router = new VueRouter({