8daad855 by 任超

style:申请业务规则配置

1 parent 0fb2eec1
1 <!--
2 功能:登记情形设定
3 -->
4 <template>
5 <div class='该组件名称'>
6 <el-form :model="ruleForm" :rules="rules" label-width="135px">
7 <el-row :gutter="20">
8 <el-col :span="8">
9 <el-form-item label="登记业务编码" prop="djywbm">
10 <el-input v-model="ruleForm.djywbm"></el-input>
11 </el-form-item>
12 </el-col>
13 <el-col :span="16">
14 <el-form-item label="登记业务名称" prop="djywmc">
15 <el-input v-model="ruleForm.djywmc"></el-input>
16 </el-form-item>
17 </el-col>
18 </el-row>
19 </el-form>
20 <lb-table :column="column" border :key="key" :heightNum="390" :pagination="false" heightNumSetting
21 :data="tableData">
22 </lb-table>
23 </div>
24 </template>
25 <script>
26 import { upward, down } from '@/utils/operation'
27 export default {
28 data () {
29 return {
30 key: 0,
31 ruleForm: {
32 djywbm: '',
33 djywmc: ''
34 },
35 cllxOptions: [
36 {
37 name: '买卖',
38 value: '1'
39 },
40 {
41 name: '买卖继承',
42 value: '2'
43 }
44 ],
45 rules: {
46 djywbm: [
47 { required: true, message: '登记业务编码', trigger: 'blur' },
48 ],
49 djywmc: [
50 { required: true, message: '登记业务名称', trigger: 'blur' },
51 ],
52 },
53 column: [
54 {
55 width: '60',
56 renderHeader: (h, scope) => {
57 return <i class="el-icon-plus pointer" onClick={() => { this.handleAdd() }} style="color:#409EFF"></i>
58 },
59 render: (h, scope) => {
60 return (
61 <i class="el-icon-minus pointer" onClick={() => { this.handleMinus(scope.$index, scope.row) }}></i>
62 )
63 }
64 },
65 {
66 width: '60',
67 label: '序号',
68 type: 'index'
69 },
70 {
71 prop: 'sfbx',
72 label: '是否必须',
73 width: '80',
74 render: (h, scope) => {
75 return (
76 <el-input value={scope.row[scope.column.property]}
77 onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
78 )
79 }
80 },
81 {
82 prop: 'djqx',
83 label: '登记情形',
84 render: (h, scope) => {
85 return (
86 <el-input placeholder="登记情形" value={scope.row[scope.column.property]}
87 onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
88 )
89 }
90 },
91 {
92 prop: 'clbm',
93 label: '材料编码',
94 render: (h, scope) => {
95 return (
96 <el-input placeholder="材料编码" value={scope.row[scope.column.property]}
97 onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
98 )
99 }
100 },
101 {
102 prop: 'clmc',
103 label: '材料名称',
104 render: (h, scope) => {
105 return (
106 <el-input placeholder="材料名称" value={scope.row[scope.column.property]}
107 onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
108 )
109 }
110 },
111 {
112 prop: 'cllx',
113 label: '材料类型',
114 render: (h, scope) => {
115 return (
116 <el-select value={scope.row[scope.column.property]}
117 onChange={(val) => { scope.row[scope.column.property] = val }}>
118 {
119 this.cllxOptions.map(option => {
120 return (
121 <el-option label={option.name} value={option.value}></el-option>
122 )
123 })
124 }
125 </el-select>
126 )
127 }
128 },
129 {
130 label: '移动',
131 width: '90',
132 render: (h, scope) => {
133 return (
134 <div>
135 <i class="el-icon-top pointer" disabled={scope.$index == 0} style="color:#409EFF" onClick={() => { this.moveUpward(scope.$index, scope.row) }}></i>
136 <i class="el-icon-bottom pointer" disabled={(scope.$index + 1) == this.tableData.length} style="color:#409EFF" onClick={() => { this.moveDown(scope.$index, scope.row) }}></i>
137 </div>
138 )
139 }
140 }
141 ],
142 tableData: [
143 {
144 sfbx: '',
145 djqx: '',
146 clbm: '',
147 clmc: '',
148 cllx: ''
149 }
150 ]
151 }
152 },
153 watch: {
154 tableData: {
155 handler (newValue, oldValue) {
156 this.$emit('updateValue', newValue)
157 },
158 deep: true
159 }
160 },
161 methods: {
162 handleAdd () {
163 this.tableData.push(
164 {
165 sfbx: '',
166 djqx: '',
167 clbm: '',
168 clmc: '',
169 cllx: ''
170 }
171 )
172 },
173 handleMinus () { },
174 // 上移下移
175 moveUpward (index, row) {
176 upward(index, this.tableData)
177 this.key++
178 },
179 moveDown (index, row) {
180 down(index, this.tableData)
181 this.key++
182 },
183 }
184 }
185 </script>
186 <style scoped lang='scss'>
187 </style>
...\ No newline at end of file ...\ No newline at end of file
1 <!--
2 功能:单元状态设定
3 -->
4 <template>
5 <div class='该组件名称'>
6 <el-form :model="ruleForm" :rules="rules" label-width="135px">
7 <el-row :gutter="20">
8 <el-col :span="8">
9 <el-form-item label="登记业务编码" prop="djywbm">
10 <el-input v-model="ruleForm.djywbm"></el-input>
11 </el-form-item>
12 </el-col>
13 <el-col :span="16">
14 <el-form-item label="登记业务名称" prop="djywmc">
15 <el-input v-model="ruleForm.djywmc"></el-input>
16 </el-form-item>
17 </el-col>
18 </el-row>
19 </el-form>
20 <div class="dyztsd-title">
21 <b>请勾选需要查询的权利信息</b>
22 <div>
23 <el-button type="text" @click="handleSelectall">选择全部</el-button>
24 <el-button type="text" @click="handleInvert">清除全部</el-button>
25 </div>
26 </div>
27 <el-divider></el-divider>
28 <ul class="qlxx-list">
29 <li v-for="(item, index) in dataList.qlxxList" :key="index">
30 <el-checkbox v-model="item.checked">{{ item.name }}</el-checkbox>
31 </li>
32 </ul>
33 <ul class="screen-list">
34 <li v-for="(item, index) in dataList.screenList" :key="index">
35 <div class="screen-list-left">
36 <el-switch v-model="item.checked">
37 </el-switch>
38 {{ item.name }}
39 </div>
40 <el-radio-group v-model="item.radio">
41 <el-radio :label="1">正在办理</el-radio>
42 <el-radio :label="2">未办理</el-radio>
43 </el-radio-group>
44 </li>
45 </ul>
46 </div>
47 </template>
48 <script>
49 export default {
50 data () {
51 return {
52 ruleForm: {
53 djywbm: '',
54 djywmc: ''
55 },
56 rules: {
57 djywbm: [
58 { required: true, message: '登记业务编码', trigger: 'blur' },
59 ],
60 djywmc: [
61 { required: true, message: '登记业务名称', trigger: 'blur' },
62 ],
63 },
64 dataList: {
65 qlxxList: [
66 {
67 checked: false,
68 name: '国有建设用地使用权'
69 },
70 {
71 checked: false,
72 name: '宅基地使用权'
73 },
74 {
75 checked: false,
76 name: '国有建设用地使用权'
77 },
78 {
79 checked: false,
80 name: '宅基地使用权/房屋所有权'
81 },
82 {
83 checked: false,
84 name: '国有建设用地使用权'
85 },
86 {
87 checked: false,
88 name: '国有建设用地使用权'
89 },
90 ],
91 screenList: [
92 {
93 checked: true,
94 name: '筛选单元办理状态条件',
95 radio: 1
96 },
97 {
98 checked: true,
99 name: '筛选单元办理状态条件',
100 radio: 1
101 },
102 {
103 checked: true,
104 name: '筛选单元办理状态条件',
105 radio: 1
106 },
107 {
108 checked: true,
109 name: '筛选单元办理状态条件',
110 radio: 1
111 }
112 ]
113 },
114
115 }
116 },
117 watch: {
118 dataList: {
119 handler (newValue, oldValue) {
120 this.$emit('updateValue', newValue)
121 },
122 deep: true
123 }
124 },
125 methods: {
126 handleSelectall () {
127 this.qlxxList.forEach(item => {
128 item.checked = true
129 })
130 },
131 handleInvert () {
132 this.qlxxList.forEach(item => {
133 item.checked = false
134 })
135 }
136 }
137 }
138 </script>
139 <style scoped lang='scss'>
140 @import "~@/styles/mixin.scss";
141
142 .dyztsd-title {
143 @include flex;
144 align-items: center;
145 justify-content: space-between;
146 padding-left: 20px;
147 }
148
149 .qlxx-list {
150 @include flex;
151 flex-wrap: wrap;
152 padding-left: 20px;
153
154 li {
155 width: 20%;
156 margin-bottom: 15px;
157 }
158 }
159
160 .screen-list {
161 @include flex;
162 align-items: center;
163 flex-wrap: wrap;
164 border: 1px solid $borderColor;
165 border-bottom: none;
166
167 li {
168 @include flex;
169 align-items: center;
170 width: 50%;
171 line-height: 50px;
172 border-bottom: 1px solid $borderColor;
173 padding-left: 20px;
174 }
175
176 &-left {
177 margin-right: 20px;
178 }
179
180 li:nth-child(odd) {
181 border-right: 1px solid $borderColor;
182 }
183 }
184 </style>
...\ No newline at end of file ...\ No newline at end of file
...@@ -108,6 +108,8 @@ ...@@ -108,6 +108,8 @@
108 </el-row> 108 </el-row>
109 </el-form> 109 </el-form>
110 <djqxsd v-else-if="n == 1" @updateValue="getValue" /> 110 <djqxsd v-else-if="n == 1" @updateValue="getValue" />
111 <clgzsd v-else-if="n == 2" @updateValue="getClValue" />
112 <dyztsd v-else />
111 </div> 113 </div>
112 </div> 114 </div>
113 </dialogBox> 115 </dialogBox>
...@@ -116,9 +118,14 @@ ...@@ -116,9 +118,14 @@
116 <script> 118 <script>
117 import fileController from '@/api/fileController' 119 import fileController from '@/api/fileController'
118 import djqxsd from './djqxsd.vue' 120 import djqxsd from './djqxsd.vue'
121 import clgzsd from './clgzsd.vue'
122
123 import dyztsd from './dyztsd.vue'
119 export default { 124 export default {
120 components: { 125 components: {
121 djqxsd 126 djqxsd,
127 clgzsd,
128 dyztsd
122 }, 129 },
123 props: { 130 props: {
124 value: { type: Boolean, default: false }, 131 value: { type: Boolean, default: false },
...@@ -210,6 +217,9 @@ export default { ...@@ -210,6 +217,9 @@ export default {
210 getValue (val) { 217 getValue (val) {
211 console.log(val); 218 console.log(val);
212 }, 219 },
220 getClValue (val) {
221 console.log(val);
222 },
213 submitForm () { 223 submitForm () {
214 this.$refs['ruleForm'].validate(async (valid) => { 224 this.$refs['ruleForm'].validate(async (valid) => {
215 if (valid) { 225 if (valid) {
......