Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
2bc8bbd5 by zhaoqian
Options

树型结构所有数据选择框的整理

1 parent 23e0be85
Inline Side-by-side
Showing 7 changed files with 186 additions and 98 deletions
......@@ -15,6 +15,7 @@
"axios": "^0.19.0",
"core-js": "^2.6.5",
"e-icon-picker": "^1.0.7",
"el-select-tree": "^1.0.26",
"el-tree-select": "^3.1.10",
"element-ui": "^2.13.2",
"file-saver": "^2.0.2",
......
......@@ -53,26 +53,34 @@
<el-col :span="4" :key="childIndex+'6'" :class="childIndex>0 ? 'childYT':''">
<ul>
<li>
<el-select class="formSelect percent30" v-model="childItem.pzytdm">
<el-option
v-for="item in $store.state.tdytList"
:key="item.dm"
:label="item.mc"
:value="item.dm"
>
</el-option>
</el-select>
<el-select-tree
class="formSelect percent30"
v-if="show"
:default-expand-all="defaultExpandAll"
:multiple="multiple"
:placeholder="placeholder"
:disabled="disabled"
:data="$store.state.tdytList"
:props="treeProps"
:check-strictly="checkStrictly"
:clearable="clearable"
v-model="childItem.pzytdm"
></el-select-tree>
</li>
<li>
<el-select class="formSelect percent30" v-model="childItem.sjytdm">
<el-option
v-for="item in $store.state.tdytList"
:key="item.dm"
:label="item.mc"
:value="item.dm"
>
</el-option>
</el-select>
<el-select-tree
class="formSelect percent30"
v-if="show"
:default-expand-all="defaultExpandAll"
:multiple="multiple"
:placeholder="placeholder"
:disabled="disabled"
:data="$store.state.tdytList"
:props="treeProps"
:check-strictly="checkStrictly"
:clearable="clearable"
v-model="childItem.sjytdm"
></el-select-tree>
</li>
<li>
<el-date-picker
......@@ -150,15 +158,18 @@
</template>
<div class="title">
<el-select class="formSelect" v-model="items.qlxzdm">
<el-option
v-for="item in $store.state.qlxzList"
:key="item.dm"
:label="item.mc"
:value="item.dm"
>
</el-option>
</el-select>
<el-select-tree
v-if="show"
:default-expand-all="defaultExpandAll"
:multiple="multiple"
:placeholder="placeholder"
:disabled="disabled"
:data="$store.state.qlxzList"
:props="treeProps"
:check-strictly="checkStrictly"
:clearable="clearable"
v-model="items.qlxzdm"
></el-select-tree>
</div>
</el-row>
</div>
......@@ -175,6 +186,20 @@ export default {
},
data() {
return {
//树型结构
show:true,
clearable: true,
defaultExpandAll: true,
multiple: false,
placeholder: '请选择',
disabled: false,
checkStrictly: false,
treeProps: {
value: 'dm',
children: 'children',
label: 'mc'
},
countList: [
{
id: Math.random(),
......
......@@ -53,26 +53,32 @@
<el-col :span="5" :key="childIndex+'6'" :class="childIndex>0 ? 'childYT':''">
<ul>
<li>
<el-select class="formSelect percent30" v-model="childItem.pzytdm">
<el-option
v-for="item in $store.state.tdytList"
:key="item.dm"
:label="item.mc"
:value="item.dm"
>
</el-option>
</el-select>
<el-select-tree
v-if="show"
:default-expand-all="defaultExpandAll"
:multiple="multiple"
:placeholder="placeholder"
:disabled="disabled"
:data="$store.state.tdytList"
:props="treeProps"
:check-strictly="checkStrictly"
:clearable="clearable"
v-model="childItem.pzytdm"
></el-select-tree>
</li>
<li>
<el-select class="formSelect percent30" v-model="childItem.sjytdm">
<el-option
v-for="item in $store.state.tdytList"
:key="item.dm"
:label="item.mc"
:value="item.dm"
>
</el-option>
</el-select>
<el-select-tree
v-if="show"
:default-expand-all="defaultExpandAll"
:multiple="multiple"
:placeholder="placeholder"
:disabled="disabled"
:data="$store.state.tdytList"
:props="treeProps"
:check-strictly="checkStrictly"
:clearable="clearable"
v-model="childItem.sjytdm"
></el-select-tree>
</li>
<li>
<el-date-picker
......@@ -139,6 +145,20 @@ export default {
},
data() {
return {
//树型结构
show:true,
clearable: true,
defaultExpandAll: true,
multiple: false,
placeholder: '请选择',
disabled: false,
checkStrictly: false,
treeProps: {
value: 'dm',
children: 'children',
label: 'mc'
},
countList: [
{
id: Math.random(),
......
......@@ -135,25 +135,33 @@
规划用途
</td>
<td width="30" colspan="4" align="center" >
<el-select v-model="item1.fwytzdbsm" placeholder="请选择" >
<el-option
v-for="item in $store.state.fwytList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm">
</el-option>
</el-select>
<el-select-tree
v-if="show"
:default-expand-all="defaultExpandAll"
:multiple="multiple"
:placeholder="placeholder"
:disabled="disabled"
:data="$store.state.fwytList"
:props="treeProps"
:check-strictly="checkStrictly"
:clearable="clearable"
v-model="item1.fwytzdbsm"
></el-select-tree>
</td>
<td width="30" colspan="1" align="center" >用途</td>
<td width="30" colspan="4" align="center" >
<el-select v-model="item1.fwsjytbsm" placeholder="请选择" >
<el-option
v-for="item in $store.state.fwytList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm">
</el-option>
</el-select>
<el-select-tree
v-if="show"
:default-expand-all="defaultExpandAll"
:multiple="multiple"
:placeholder="placeholder"
:disabled="disabled"
:data="$store.state.fwytList"
:props="treeProps"
:check-strictly="checkStrictly"
:clearable="clearable"
v-model="item1.fwsjytbsm"
></el-select-tree>
</td>
</tr>
......@@ -228,6 +236,21 @@
},
data() {
return {
//树型结构
show:true,
clearable: true,
defaultExpandAll: true,
multiple: false,
placeholder: '请选择',
disabled: false,
checkStrictly: false,
treeProps: {
value: 'bsm',
children: 'children',
label: 'mc'
},
form:{
jzmj:'',
tnjzmj:'',
......
......@@ -5,7 +5,7 @@ import store from '@store'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import '../mock/index.js'
import ElTreeSelect from 'el-tree-select'
import ElTreeSelect from 'el-select-tree'
//树型选择器
Vue.use(ElTreeSelect);
//引入富文本编辑器
......
......@@ -224,25 +224,33 @@
规划用途
</td>
<td width="30" colspan="4" align="center" >
<el-select v-model="item1.fwytzdbsm" placeholder="请选择" >
<el-option
v-for="item in $store.state.fwytList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm">
</el-option>
</el-select>
<el-select-tree
v-if="show"
:default-expand-all="defaultExpandAll"
:multiple="multiple"
:placeholder="placeholder"
:disabled="disabled"
:data="$store.state.fwytList"
:props="treeProps"
:check-strictly="checkStrictly"
:clearable="clearable"
v-model="item1.fwytzdbsm"
></el-select-tree>
</td>
<td width="30" colspan="1" align="center" >用途</td>
<td width="30" colspan="4" align="center" >
<el-select v-model="item1.fwsjytbsm" placeholder="请选择" >
<el-option
v-for="item in $store.state.fwytList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm">
</el-option>
</el-select>
<el-select-tree
v-if="show"
:default-expand-all="defaultExpandAll"
:multiple="multiple"
:placeholder="placeholder"
:disabled="disabled"
:data="$store.state.fwytList"
:props="treeProps"
:check-strictly="checkStrictly"
:clearable="clearable"
v-model="item1.fwsjytbsm"
></el-select-tree>
</td>
</tr>
......@@ -389,6 +397,21 @@
},
data () {
return {
//树型结构
show:true,
clearable: true,
defaultExpandAll: true,
multiple: false,
placeholder: '请选择',
disabled: false,
checkStrictly: false,
treeProps: {
value: 'bsm',
children: 'children',
label: 'mc'
},
form:{
bsm:'',//户标识码
zrzbsm:'', //自然幢标识码
......
......@@ -157,7 +157,7 @@
规划用途
</td>
<td width="30" colspan="4" align="center" >
<el-tree-select
<el-select-tree
v-if="show"
:default-expand-all="defaultExpandAll"
:multiple="multiple"
......@@ -168,26 +168,22 @@
:check-strictly="checkStrictly"
:clearable="clearable"
v-model="item1.fwytzdbsm"
></el-tree-select>
<!-- <el-select v-model="item1.fwytzdbsm" placeholder="请选择" >-->
<!-- <el-option-->
<!-- v-for="item in $store.state.tdytList"-->
<!-- :key="item.bsm"-->
<!-- :label="item.mc"-->
<!-- :value="item.bsm">-->
<!-- </el-option>-->
<!-- </el-select>-->
></el-select-tree>
</td>
<td width="30" colspan="1" align="center" >用途</td>
<td width="30" colspan="4" align="center" >
<el-select v-model="item1.fwsjytbsm" placeholder="请选择" >
<el-option
v-for="item in $store.state.tdytList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm">
</el-option>
</el-select>
<el-select-tree
v-if="show"
:default-expand-all="defaultExpandAll"
:multiple="multiple"
:placeholder="placeholder"
:disabled="disabled"
:data="$store.state.tdytList"
:props="treeProps"
:check-strictly="checkStrictly"
:clearable="clearable"
v-model="item1.fwytzdbsm"
></el-select-tree>
</td>
</tr>
......@@ -298,9 +294,9 @@
//树型结构
show:true,
clearable: true,
defaultExpandAll: false,
defaultExpandAll: true,
multiple: false,
placeholder: 'please choose',
placeholder: '请选择',
disabled: false,
checkStrictly: false,
treeProps: {
......