合并网格管理员并权限控制
This commit is contained in:
		
							
								
								
									
										117
									
								
								packages/2.0.5/AppGridMember/AppGridMember.vue
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										117
									
								
								packages/2.0.5/AppGridMember/AppGridMember.vue
									
									
									
									
										vendored
									
									
								
							| @@ -1,117 +0,0 @@ | ||||
| <template> | ||||
|   <ai-list class="AppGridMember" v-if="!isShowDetail"> | ||||
|     <template slot="title"> | ||||
|       <ai-title title="网格员管理" :isShowBottomBorder="false"></ai-title> | ||||
|     </template> | ||||
|     <template slot="tabs"> | ||||
|       <el-tabs v-model="currIndex"> | ||||
|         <el-tab-pane v-for="(tab,i) in tabs" :key="i" :label="tab.label"> | ||||
|           <component :ref="String(i)" v-if="currIndex == i" :is="tab.comp" @change="onChange" lazy :instance="instance" :dict="dict" :permissions="permissions"/> | ||||
|         </el-tab-pane> | ||||
|       </el-tabs> | ||||
|     </template> | ||||
|   </ai-list> | ||||
|   <Add v-else-if="component === 'Add'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></Add> | ||||
|   <Family v-else-if="component === 'Family'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></Family> | ||||
|   <ApplyDetail v-else-if="component === 'ApplyDetail'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></ApplyDetail> | ||||
|   <ApplyAdd v-else-if="component === 'ApplyAdd'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></ApplyAdd> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|   import List from './components/list' | ||||
|   import ApplyList from './components/ApplyList' | ||||
|   import Add from './components/add' | ||||
|   import ApplyDetail from './components/ApplyDetail' | ||||
|   import ApplyAdd from './components/ApplyAdd' | ||||
|   import Family from './components/Family' | ||||
|  | ||||
|   export default { | ||||
|     name: "AppGridMember", | ||||
|     label: "网格管理员", | ||||
|  | ||||
|     props: { | ||||
|       instance: Function, | ||||
|       dict: Object, | ||||
|       permissions: Function | ||||
|     }, | ||||
|  | ||||
|     data() { | ||||
|       return { | ||||
|         component: "List", | ||||
|         params: {}, | ||||
|         include: [], | ||||
|         currIndex: '0', | ||||
|         isShowDetail: false | ||||
|       }; | ||||
|     }, | ||||
|  | ||||
|       computed: { | ||||
|         tabs () { | ||||
|           const tabList = [ | ||||
|             {label: '网格员信息', name: 'List', comp: List, permission: ''}, | ||||
|             {label: '申报信息', name: 'ApplyList', comp: ApplyList, permission: 'app_appgirdmemberapply_detail'} | ||||
|           ].filter(item => { | ||||
|             return item.name !== 'ApplyList' || this.permissions(item.permission) | ||||
|           }) | ||||
|  | ||||
|           return tabList | ||||
|         } | ||||
|       }, | ||||
|  | ||||
|     components: { | ||||
|       Add, | ||||
|       List, | ||||
|       Family, | ||||
|       ApplyList, | ||||
|       ApplyDetail, | ||||
|       ApplyAdd | ||||
|     }, | ||||
|  | ||||
|     mounted() {}, | ||||
|  | ||||
|     methods: { | ||||
|       onChange(data) { | ||||
|         if (data.type === "Add") { | ||||
|           this.component = "Add" | ||||
|           this.isShowDetail = true | ||||
|           this.params = data.params | ||||
|         } | ||||
|  | ||||
|         if (data.type === "Family") { | ||||
|           this.component = "Family" | ||||
|           this.isShowDetail = true | ||||
|           this.params = data.params | ||||
|         } | ||||
|         if (data.type === "ApplyDetail") { | ||||
|           this.component = "ApplyDetail" | ||||
|           this.isShowDetail = true | ||||
|           this.params = data.params | ||||
|         } | ||||
|  | ||||
|         if (data.type === "ApplyAdd") { | ||||
|           this.component = "ApplyAdd" | ||||
|           this.isShowDetail = true | ||||
|           this.params = data.params | ||||
|         } | ||||
|  | ||||
|         if (data.type === "list") { | ||||
|           this.component = "List" | ||||
|           this.isShowDetail = false | ||||
|           this.params = data.params | ||||
|         } | ||||
|  | ||||
|         if (data.type === "ApplyList") { | ||||
|           this.component = "ApplyList" | ||||
|           this.isShowDetail = false | ||||
|           this.params = data.params | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss"> | ||||
|   .AppGridMember { | ||||
|     height: 100%; | ||||
|   } | ||||
| </style> | ||||
							
								
								
									
										197
									
								
								packages/2.0.5/AppGridMember/components/list.vue
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										197
									
								
								packages/2.0.5/AppGridMember/components/list.vue
									
									
									
									
										vendored
									
									
								
							| @@ -1,197 +0,0 @@ | ||||
| <template> | ||||
|   <ai-list class="list" isTabs> | ||||
|     <template slot="content"> | ||||
|       <ai-search-bar bottomBorder> | ||||
|         <template slot="left"> | ||||
|           <el-date-picker | ||||
|             v-model="searchObj.selectionDate" | ||||
|             type="date" | ||||
|             @change="(page.current = 1), getList()" | ||||
|             value-format="yyyy-MM-dd" | ||||
|             size="small" | ||||
|             placeholder="选用时间"> | ||||
|           </el-date-picker> | ||||
|         </template> | ||||
|         <template slot="right"> | ||||
|           <el-input | ||||
|             v-model="searchObj.name" | ||||
|             size="small" | ||||
|             placeholder="网格员/责任网格" | ||||
|             v-throttle="() => {page.current = 1, getList()}" | ||||
|             @keyup.enter.native="(page.current = 1), getList()" | ||||
|             clearable | ||||
|             @clear="(searchObj.name = '', page.current = 1), getList()" | ||||
|             suffix-icon="iconfont iconSearch" /> | ||||
|         </template> | ||||
|       </ai-search-bar> | ||||
|       <ai-search-bar style="padding: 16px 0 0"> | ||||
|         <template slot="left"> | ||||
|           <el-button | ||||
|             icon="iconfont iconAdd" | ||||
|             type="primary" | ||||
|             size="small" | ||||
|             @click="add('')" | ||||
|             >添加</el-button | ||||
|           > | ||||
|           <el-button | ||||
|             icon="iconfont iconDelete" | ||||
|             @click="deleteById(ids.join(','))" | ||||
|             :disabled="!Boolean(ids.length)" | ||||
|             >删除</el-button | ||||
|           > | ||||
|         </template> | ||||
|       </ai-search-bar> | ||||
|       <ai-table | ||||
|         :tableData="tableData" | ||||
|         :col-configs="colConfigs" | ||||
|         :total="page.total" | ||||
|         ref="aitableex" | ||||
|         :current.sync="page.current" | ||||
|         :size.sync="page.size" | ||||
|         @selection-change="(v) => (ids = v.map((e) => e.id))" | ||||
|         @getList="getList()"> | ||||
|         <el-table-column label="操作" slot="options" align="center" fixed="right" width="170"> | ||||
|           <template slot-scope="{ row }"> | ||||
|             <div class="table-options"> | ||||
|               <el-button type="text" @click="toFamily(row.id)">责任家庭</el-button> | ||||
|               <el-button type="text" @click="add(row.id)">详情</el-button> | ||||
|               <el-button type="text" @click="deleteById(row.id)">删除</el-button> | ||||
|             </div> | ||||
|           </template> | ||||
|         </el-table-column> | ||||
|       </ai-table> | ||||
|     </template> | ||||
|   </ai-list> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: "List", | ||||
|   label: "网格员管理", | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     dict: Object, | ||||
|     permissions: Function, | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       searchObj: { | ||||
|         name: "", | ||||
|         selectionDate: "", | ||||
|       }, | ||||
|       page: { | ||||
|         current: 1, | ||||
|         size: 10, | ||||
|         total: 0, | ||||
|       }, | ||||
|       goAdd: false, | ||||
|       tableData: [], | ||||
|       fileList: [], | ||||
|       ids: [], | ||||
|       detail: {}, | ||||
|     }; | ||||
|   }, | ||||
|   created() { | ||||
|     this.dict.load("sex", "girdMemberType", "politicsStatus", "education"); | ||||
|     this.getList(); | ||||
|   }, | ||||
|   computed: { | ||||
|     colConfigs() { | ||||
|       let _ = this; | ||||
|       return [ | ||||
|         { | ||||
|           type: "selection", | ||||
|         }, | ||||
|         { | ||||
|           prop: "name", | ||||
|           label: "网格员姓名", | ||||
|         }, | ||||
|         { | ||||
|           prop: "girdInfoListStr", | ||||
|           align: "center", | ||||
|           label: "责任网格", | ||||
|         }, | ||||
|         { | ||||
|           prop: "phone", | ||||
|           align: "center", | ||||
|           label: "联系电话", | ||||
|         }, | ||||
|         { | ||||
|           prop: "selectionDate", | ||||
|           align: "center", | ||||
|           label: "选用时间", | ||||
|         }, | ||||
|       ]; | ||||
|     }, | ||||
|   }, | ||||
|   methods: { | ||||
|     getList() { | ||||
|       this.instance | ||||
|         .post("/app/appgirdmemberinfo/list", null, { | ||||
|           params: { | ||||
|             ...this.searchObj, | ||||
|             ...this.page, | ||||
|           }, | ||||
|         }) | ||||
|         .then((res) => { | ||||
|           if (res.code == 0) { | ||||
|             this.tableData = res.data.records; | ||||
|             this.page.total = res.data.total; | ||||
|           } | ||||
|         }); | ||||
|     }, | ||||
|     deleteById(ids) { | ||||
|       ids && | ||||
|         this.$confirm("是否要删除该网格员?", { | ||||
|           type: "error", | ||||
|         }) | ||||
|           .then(() => { | ||||
|             this.instance | ||||
|               .post("/app/appgirdmemberinfo/delete", null, { | ||||
|                 params: { ids }, | ||||
|               }) | ||||
|               .then((res) => { | ||||
|                 if (res?.code == 0) { | ||||
|                   this.$message.success("删除成功!"); | ||||
|                   this.getList(); | ||||
|                 } | ||||
|               }); | ||||
|           }) | ||||
|           .catch(() => {}); | ||||
|     }, | ||||
|     add(id) { | ||||
|       this.$emit('change', { | ||||
|         type: 'Add', | ||||
|         params: { | ||||
|           id: id || '' | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     toFamily (id) { | ||||
|       this.$emit('change', { | ||||
|         type: 'Family', | ||||
|         params: { | ||||
|           id | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     handleSelectionChange(val) { | ||||
|       this.ids = []; | ||||
|       val.map((e) => { | ||||
|         this.ids.push(e.id); | ||||
|       }); | ||||
|     }, | ||||
|     resetSearch() { | ||||
|       Object.keys(this.searchObj).map((e) => { | ||||
|         this.searchObj[e] = ""; | ||||
|       }); | ||||
|       this.getList(); | ||||
|     }, | ||||
|   }, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| </style> | ||||
							
								
								
									
										131
									
								
								packages/grid/AppGridMember/AppGridMember.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										131
									
								
								packages/grid/AppGridMember/AppGridMember.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,131 @@ | ||||
| <template> | ||||
|   <ai-list class="AppGridMember" v-if="!isShowDetail"> | ||||
|     <template slot="title"> | ||||
|       <ai-title title="网格员管理" :isShowBottomBorder="false"></ai-title> | ||||
|     </template> | ||||
|     <template slot="tabs"> | ||||
|       <el-tabs v-model="currIndex"> | ||||
|         <el-tab-pane v-for="(tab,i) in tabs" :key="i" :label="tab.label"> | ||||
|           <component :ref="String(i)" v-if="currIndex == i" :is="tab.comp" @change="onChange" lazy :instance="instance" | ||||
|                      :dict="dict" :permissions="permissions"/> | ||||
|         </el-tab-pane> | ||||
|       </el-tabs> | ||||
|     </template> | ||||
|   </ai-list> | ||||
|   <Add v-else-if="component === 'Add'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" | ||||
|        @change="onChange"></Add> | ||||
|   <Family v-else-if="component === 'Family'" :params="params" :instance="instance" :dict="dict" | ||||
|           :permissions="permissions" @change="onChange"></Family> | ||||
|   <MonitorUser v-else-if="component === 'MonitorUser'" :params="params" :instance="instance" :dict="dict" | ||||
|                :permissions="permissions" @change="onChange"></MonitorUser> | ||||
|   <ApplyDetail v-else-if="component === 'ApplyDetail'" :params="params" :instance="instance" :dict="dict" | ||||
|                :permissions="permissions" @change="onChange"></ApplyDetail> | ||||
|   <ApplyAdd v-else-if="component === 'ApplyAdd'" :params="params" :instance="instance" :dict="dict" | ||||
|             :permissions="permissions" @change="onChange"></ApplyAdd> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import List from './components/list' | ||||
| import ApplyList from './components/ApplyList' | ||||
| import Add from './components/add' | ||||
| import ApplyDetail from './components/ApplyDetail' | ||||
| import ApplyAdd from './components/ApplyAdd' | ||||
| import Family from './components/Family' | ||||
| import MonitorUser from './components/MonitorUser' | ||||
|  | ||||
| export default { | ||||
|   name: "AppGridMember", | ||||
|   label: "网格管理员", | ||||
|  | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     dict: Object, | ||||
|     permissions: Function | ||||
|   }, | ||||
|  | ||||
|   data() { | ||||
|     return { | ||||
|       component: "List", | ||||
|       params: {}, | ||||
|       include: [], | ||||
|       currIndex: '0', | ||||
|       isShowDetail: false | ||||
|     }; | ||||
|   }, | ||||
|  | ||||
|   computed: { | ||||
|     tabs() { | ||||
|       return [ | ||||
|         {label: '网格员信息', name: 'List', comp: List, permission: ''}, | ||||
|         {label: '申报信息', name: 'ApplyList', comp: ApplyList, permission: 'app_appgirdmemberapply_detail'} | ||||
|       ].filter(item => { | ||||
|         return item.name !== 'ApplyList' || this.permissions(item.permission) | ||||
|       }) | ||||
|     } | ||||
|   }, | ||||
|  | ||||
|   components: { | ||||
|     Add, | ||||
|     List, | ||||
|     Family, | ||||
|     ApplyList, | ||||
|     ApplyDetail, | ||||
|     MonitorUser, | ||||
|     ApplyAdd | ||||
|   }, | ||||
|  | ||||
|   mounted() { | ||||
|   }, | ||||
|  | ||||
|   methods: { | ||||
|     onChange(data) { | ||||
|       if (data.type === "Add") { | ||||
|         this.component = "Add" | ||||
|         this.isShowDetail = true | ||||
|         this.params = data.params | ||||
|       } | ||||
|  | ||||
|       if (data.type === "Family") { | ||||
|         this.component = "Family" | ||||
|         this.isShowDetail = true | ||||
|         this.params = data.params | ||||
|       } | ||||
|  | ||||
|       if (data.type === "MonitorUser") { | ||||
|         this.component = "MonitorUser" | ||||
|         this.isShowDetail = true | ||||
|         this.params = data.params | ||||
|       } | ||||
|       if (data.type === "ApplyDetail") { | ||||
|         this.component = "ApplyDetail" | ||||
|         this.isShowDetail = true | ||||
|         this.params = data.params | ||||
|       } | ||||
|  | ||||
|       if (data.type === "ApplyAdd") { | ||||
|         this.component = "ApplyAdd" | ||||
|         this.isShowDetail = true | ||||
|         this.params = data.params | ||||
|       } | ||||
|  | ||||
|       if (data.type === "list") { | ||||
|         this.component = "List" | ||||
|         this.isShowDetail = false | ||||
|         this.params = data.params | ||||
|       } | ||||
|  | ||||
|       if (data.type === "ApplyList") { | ||||
|         this.component = "ApplyList" | ||||
|         this.isShowDetail = false | ||||
|         this.params = data.params | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss"> | ||||
| .AppGridMember { | ||||
|   height: 100%; | ||||
| } | ||||
| </style> | ||||
| @@ -53,7 +53,7 @@ | ||||
|           <template slot-scope="{ row }"> | ||||
|             <div class="table-options"> | ||||
|               <el-button type="text" @click="toFamily(row.id)">责任家庭</el-button> | ||||
|               <el-button type="text" @click="toMonitorUser(row.id)">监测对象</el-button> | ||||
|               <el-button type="text" @click="toMonitorUser(row.id)" v-if="permissions('girdmemberpovertyconfig')">监测对象</el-button> | ||||
|               <el-button type="text" @click="add(row.id)">详情</el-button> | ||||
|               <el-button type="text" @click="deleteById(row.id)">删除</el-button> | ||||
|             </div> | ||||
| @@ -203,4 +203,4 @@ export default { | ||||
| </script> | ||||
| 
 | ||||
| <style lang="scss" scoped> | ||||
| </style> | ||||
| </style> | ||||
| @@ -1,126 +0,0 @@ | ||||
| <template> | ||||
|   <ai-list class="AppGridMember" v-if="!isShowDetail"> | ||||
|     <template slot="title"> | ||||
|       <ai-title title="网格员管理" :isShowBottomBorder="false"></ai-title> | ||||
|     </template> | ||||
|     <template slot="tabs"> | ||||
|       <el-tabs v-model="currIndex"> | ||||
|         <el-tab-pane v-for="(tab,i) in tabs" :key="i" :label="tab.label"> | ||||
|           <component :ref="String(i)" v-if="currIndex == i" :is="tab.comp" @change="onChange" lazy :instance="instance" :dict="dict" :permissions="permissions"/> | ||||
|         </el-tab-pane> | ||||
|       </el-tabs> | ||||
|     </template> | ||||
|   </ai-list> | ||||
|   <Add v-else-if="component === 'Add'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></Add> | ||||
|   <Family v-else-if="component === 'Family'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></Family> | ||||
|   <MonitorUser v-else-if="component === 'MonitorUser'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></MonitorUser> | ||||
|   <ApplyDetail v-else-if="component === 'ApplyDetail'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></ApplyDetail> | ||||
|   <ApplyAdd v-else-if="component === 'ApplyAdd'" :params="params" :instance="instance" :dict="dict" :permissions="permissions" @change="onChange"></ApplyAdd> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|   import List from './components/list' | ||||
|   import ApplyList from './components/ApplyList' | ||||
|   import Add from './components/add' | ||||
|   import ApplyDetail from './components/ApplyDetail' | ||||
|   import ApplyAdd from './components/ApplyAdd' | ||||
|   import Family from './components/Family' | ||||
|   import MonitorUser from './components/MonitorUser' | ||||
|  | ||||
|   export default { | ||||
|     name: "AppGridMemberJp", | ||||
|     label: "网格管理员(防返贫)", | ||||
|  | ||||
|     props: { | ||||
|       instance: Function, | ||||
|       dict: Object, | ||||
|       permissions: Function | ||||
|     }, | ||||
|  | ||||
|     data() { | ||||
|       return { | ||||
|         component: "List", | ||||
|         params: {}, | ||||
|         include: [], | ||||
|         currIndex: '0', | ||||
|         isShowDetail: false | ||||
|       }; | ||||
|     }, | ||||
|  | ||||
|       computed: { | ||||
|         tabs () { | ||||
|           const tabList = [ | ||||
|             {label: '网格员信息', name: 'List', comp: List, permission: ''}, | ||||
|             {label: '申报信息', name: 'ApplyList', comp: ApplyList, permission: 'app_appgirdmemberapply_detail'} | ||||
|           ].filter(item => { | ||||
|             return item.name !== 'ApplyList' || this.permissions(item.permission) | ||||
|           }) | ||||
|  | ||||
|           return tabList | ||||
|         } | ||||
|       }, | ||||
|  | ||||
|     components: { | ||||
|       Add, | ||||
|       List, | ||||
|       Family, | ||||
|       ApplyList, | ||||
|       ApplyDetail, | ||||
|       MonitorUser, | ||||
|       ApplyAdd | ||||
|     }, | ||||
|  | ||||
|     mounted() {}, | ||||
|  | ||||
|     methods: { | ||||
|       onChange(data) { | ||||
|         if (data.type === "Add") { | ||||
|           this.component = "Add" | ||||
|           this.isShowDetail = true | ||||
|           this.params = data.params | ||||
|         } | ||||
|  | ||||
|         if (data.type === "Family") { | ||||
|           this.component = "Family" | ||||
|           this.isShowDetail = true | ||||
|           this.params = data.params | ||||
|         } | ||||
|  | ||||
|         if (data.type === "MonitorUser") { | ||||
|           this.component = "MonitorUser" | ||||
|           this.isShowDetail = true | ||||
|           this.params = data.params | ||||
|         } | ||||
|         if (data.type === "ApplyDetail") { | ||||
|           this.component = "ApplyDetail" | ||||
|           this.isShowDetail = true | ||||
|           this.params = data.params | ||||
|         } | ||||
|  | ||||
|         if (data.type === "ApplyAdd") { | ||||
|           this.component = "ApplyAdd" | ||||
|           this.isShowDetail = true | ||||
|           this.params = data.params | ||||
|         } | ||||
|  | ||||
|         if (data.type === "list") { | ||||
|           this.component = "List" | ||||
|           this.isShowDetail = false | ||||
|           this.params = data.params | ||||
|         } | ||||
|  | ||||
|         if (data.type === "ApplyList") { | ||||
|           this.component = "ApplyList" | ||||
|           this.isShowDetail = false | ||||
|           this.params = data.params | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss"> | ||||
|   .AppGridMember { | ||||
|     height: 100%; | ||||
|   } | ||||
| </style> | ||||
| @@ -1,107 +0,0 @@ | ||||
| <template> | ||||
|   <ai-detail class="content-add"> | ||||
|     <template slot="title"> | ||||
|       <ai-title :title="params.id ? '编辑' : '添加'" isShowBack isShowBottomBorder @onBackClick="cancel(false)"> | ||||
|       </ai-title> | ||||
|     </template> | ||||
|     <template slot="content"> | ||||
|       <ai-card title="基本信息"> | ||||
|         <template #content> | ||||
|           <el-form class="ai-form" :model="form" label-width="120px" ref="form"> | ||||
|             <el-form-item label="姓名" style="width: 100%;" prop="name" :rules="[{required: true, message: '请输入姓名', trigger: 'blur'}]"> | ||||
|               <el-input size="small" v-model="form.name" placeholder="请输入..." :maxlength="20"></el-input> | ||||
|             </el-form-item> | ||||
|             <el-form-item label="联系电话" style="width: 100%;" prop="phone" :rules="[{required: true, message: '请输入联系电话', trigger: 'blur'}]"> | ||||
|               <el-input size="small" v-model="form.phone" placeholder="请输入..." :maxlength="11"></el-input> | ||||
|             </el-form-item> | ||||
|             <el-form-item label="网格名称" style="width: 100%;" prop="girdName" :rules="[{required: true, message: '请输入网格名称', trigger: 'blur'}]"> | ||||
|               <el-input size="small" v-model="form.girdName" placeholder="请输入..." :maxlength="50"></el-input> | ||||
|             </el-form-item> | ||||
|           </el-form> | ||||
|         </template> | ||||
|       </ai-card> | ||||
|     </template> | ||||
|     <template #footer> | ||||
|       <el-button @click="cancel">取消</el-button> | ||||
|       <el-button type="primary" :loading="isLoading" @click="confirm">提交</el-button> | ||||
|     </template> | ||||
|   </ai-detail> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|   export default { | ||||
|     name: 'ApplyAdd', | ||||
|  | ||||
|     props: { | ||||
|       instance: Function, | ||||
|       dict: Object, | ||||
|       params: Object | ||||
|     }, | ||||
|  | ||||
|     data () { | ||||
|       return { | ||||
|         form: { | ||||
|           name: '', | ||||
|           phone: '', | ||||
|           gridName: '' | ||||
|         }, | ||||
|         isLoading: false, | ||||
|         id: '' | ||||
|       } | ||||
|     }, | ||||
|  | ||||
|     created () { | ||||
|       if (this.params && this.params.id) { | ||||
|         this.id = this.params.id | ||||
|         this.getInfo(this.params.id) | ||||
|       } | ||||
|     }, | ||||
|  | ||||
|     methods: { | ||||
|       getInfo (id) { | ||||
|         this.instance.post(`/app/appcontentinfo/queryDetailById?id=${id}`).then(res => { | ||||
|           if (res.code === 0) { | ||||
|             this.form = res.data | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       onChange () { | ||||
|         this.form.files = [] | ||||
|       }, | ||||
|  | ||||
|       confirm () { | ||||
|         this.$refs.form.validate((valid) => { | ||||
|           if (valid) { | ||||
|             this.isLoading = true | ||||
|             this.instance.post(`/app/appgirdmemberapply/addOrUpdate`, { | ||||
|               ...this.form, | ||||
|               id: this.params.id || '' | ||||
|             }).then(res => { | ||||
|               if (res.code == 0) { | ||||
|                 this.$message.success('提交成功') | ||||
|                 setTimeout(() => { | ||||
|                   this.cancel(true) | ||||
|                 }, 600) | ||||
|               } else { | ||||
|                 this.isLoading = false | ||||
|               } | ||||
|             }).catch(() => { | ||||
|               this.isLoading = false | ||||
|             }) | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       cancel (isRefresh) { | ||||
|         this.$emit('change', { | ||||
|           type: 'list', | ||||
|           isRefresh: !!isRefresh | ||||
|         }) | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| </style> | ||||
| @@ -1,65 +0,0 @@ | ||||
| <template> | ||||
|   <ai-detail> | ||||
|     <template slot="title"> | ||||
|       <ai-title title="详情" isShowBack isShowBottomBorder @onBackClick="cancel(false)"> | ||||
|       </ai-title> | ||||
|     </template> | ||||
|     <template slot="content"> | ||||
|       <ai-card title="基本信息"> | ||||
|         <template #content> | ||||
|           <ai-wrapper> | ||||
|             <ai-info-item label="姓名" isLine :value="info.name"></ai-info-item> | ||||
|             <ai-info-item label="联系电话" isLine :value="info.phone"></ai-info-item> | ||||
|             <ai-info-item label="网格名称" isLine :value="info.girdName"></ai-info-item> | ||||
|           </ai-wrapper> | ||||
|         </template> | ||||
|       </ai-card> | ||||
|     </template> | ||||
|   </ai-detail> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|   export default { | ||||
|     name: 'ApplyDetail', | ||||
|  | ||||
|     props: { | ||||
|       instance: Function, | ||||
|       dict: Object, | ||||
|       params: Object | ||||
|     }, | ||||
|  | ||||
|     data () { | ||||
|       return { | ||||
|         info: {}, | ||||
|         id: '' | ||||
|       } | ||||
|     }, | ||||
|  | ||||
|     created () { | ||||
|       if (this.params && this.params.id) { | ||||
|         this.id = this.params.id | ||||
|         this.getInfo(this.params.id) | ||||
|       } | ||||
|     }, | ||||
|  | ||||
|     methods: { | ||||
|       getInfo (id) { | ||||
|         this.instance.post(`/app/appgirdmemberapply/queryDetailById?id=${id}`).then(res => { | ||||
|           if (res.code === 0) { | ||||
|             this.info = res.data | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       cancel (isRefresh) { | ||||
|         this.$emit('change', { | ||||
|           type: 'ApplyList', | ||||
|           isRefresh: !!isRefresh | ||||
|         }) | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| </style> | ||||
| @@ -1,179 +0,0 @@ | ||||
| <template> | ||||
|   <ai-list class="list" isTabs> | ||||
|     <template slot="content"> | ||||
|       <ai-search-bar bottomBorder> | ||||
|         <template slot="left"> | ||||
|           <el-button | ||||
|             icon="iconfont iconAdd" | ||||
|             type="primary" | ||||
|             size="small" | ||||
|             @click="add('')">添加</el-button> | ||||
|           <el-button | ||||
|             icon="iconfont iconDelete" | ||||
|             @click="deleteById(ids.join(','))" | ||||
|             :disabled="!Boolean(ids.length)"> | ||||
|             删除 | ||||
|           </el-button> | ||||
|           <ai-import :instance="instance" :dict="dict" type="appgirdmemberapply" name="网格员申报" @success="getList()"> | ||||
|             <el-button icon="iconfont iconImport">导入</el-button> | ||||
|           </ai-import> | ||||
|         </template> | ||||
|         <template slot="right"> | ||||
|           <el-input | ||||
|             v-model="searchObj.name" | ||||
|             size="small" | ||||
|             placeholder="网格员/责任网格" | ||||
|             @keyup.enter.native="(page.current = 1), getList()" | ||||
|             clearable | ||||
|             @clear="(searchObj.name = '', page.current = 1), getList()" | ||||
|             suffix-icon="iconfont iconSearch" /> | ||||
|         </template> | ||||
|       </ai-search-bar> | ||||
|       <ai-table | ||||
|         :tableData="tableData" | ||||
|         :col-configs="colConfigs" | ||||
|         :total="page.total" | ||||
|         ref="aitableex" | ||||
|         :current.sync="page.current" | ||||
|         :size.sync="page.size" | ||||
|         @selection-change="(v) => (ids = v.map((e) => e.id))" | ||||
|         @getList="getList()"> | ||||
|         <el-table-column label="操作" slot="options" align="center" fixed="right" width="120"> | ||||
|           <template slot-scope="{ row }"> | ||||
|             <div class="table-options"> | ||||
|               <el-button type="text" @click="toDetail(row.id)">详情</el-button> | ||||
|               <el-button type="text" @click="deleteById(row.id)">删除</el-button> | ||||
|             </div> | ||||
|           </template> | ||||
|         </el-table-column> | ||||
|       </ai-table> | ||||
|     </template> | ||||
|   </ai-list> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|   export default { | ||||
|     name: 'ApplyList', | ||||
|     label: '网格员管理', | ||||
|     props: { | ||||
|       instance: Function, | ||||
|       dict: Object, | ||||
|       permissions: Function, | ||||
|     }, | ||||
|     data() { | ||||
|       return { | ||||
|         searchObj: { | ||||
|           name: "", | ||||
|           selectionDate: "", | ||||
|         }, | ||||
|         page: { | ||||
|           current: 1, | ||||
|           size: 10, | ||||
|           total: 0, | ||||
|         }, | ||||
|         goAdd: false, | ||||
|         tableData: [], | ||||
|         fileList: [], | ||||
|         ids: [], | ||||
|         detail: {}, | ||||
|       }; | ||||
|     }, | ||||
|     created() { | ||||
|       this.dict.load("sex", "girdMemberType", "politicsStatus", "education"); | ||||
|       this.getList(); | ||||
|     }, | ||||
|     computed: { | ||||
|       colConfigs() { | ||||
|         let _ = this; | ||||
|         return [ | ||||
|           { | ||||
|             type: "selection", | ||||
|           }, | ||||
|           { | ||||
|             prop: "name", | ||||
|             label: "网格员姓名", | ||||
|           }, | ||||
|           { | ||||
|             prop: "girdName", | ||||
|             align: "left", | ||||
|             label: "责任网格", | ||||
|           }, | ||||
|           { | ||||
|             prop: "phone", | ||||
|             align: "center", | ||||
|             label: "联系电话", | ||||
|           } | ||||
|         ]; | ||||
|       }, | ||||
|     }, | ||||
|     methods: { | ||||
|       getList() { | ||||
|         this.instance | ||||
|           .post("/app/appgirdmemberapply/list", null, { | ||||
|             params: { | ||||
|               ...this.searchObj, | ||||
|               ...this.page, | ||||
|             }, | ||||
|           }) | ||||
|           .then((res) => { | ||||
|             if (res.code == 0) { | ||||
|               this.tableData = res.data.records; | ||||
|               this.page.total = res.data.total; | ||||
|             } | ||||
|           }); | ||||
|       }, | ||||
|       deleteById(ids) { | ||||
|         ids && | ||||
|           this.$confirm("是否要删除该网格员?", { | ||||
|             type: "error", | ||||
|           }) | ||||
|             .then(() => { | ||||
|               this.instance | ||||
|                 .post("/app/appgirdmemberapply/delete", null, { | ||||
|                   params: { ids }, | ||||
|                 }) | ||||
|                 .then((res) => { | ||||
|                   if (res?.code == 0) { | ||||
|                     this.$message.success("删除成功!"); | ||||
|                     this.getList(); | ||||
|                   } | ||||
|                 }); | ||||
|             }) | ||||
|             .catch(() => {}); | ||||
|       }, | ||||
|       add (id) { | ||||
|         this.$emit('change', { | ||||
|           type: 'ApplyAdd', | ||||
|           params: { | ||||
|             id: id || '' | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       toDetail (id) { | ||||
|         this.$emit('change', { | ||||
|           type: 'ApplyDetail', | ||||
|           params: { | ||||
|             id | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       handleSelectionChange(val) { | ||||
|         this.ids = []; | ||||
|         val.map((e) => { | ||||
|           this.ids.push(e.id); | ||||
|         }); | ||||
|       }, | ||||
|       resetSearch() { | ||||
|         Object.keys(this.searchObj).map((e) => { | ||||
|           this.searchObj[e] = ""; | ||||
|         }); | ||||
|         this.getList(); | ||||
|       }, | ||||
|     }, | ||||
|   } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| </style> | ||||
| @@ -1,499 +0,0 @@ | ||||
| <template> | ||||
|   <ai-list class="Family"> | ||||
|     <template slot="title"> | ||||
|       <ai-title title="责任家庭" isShowBack isShowBottomBorder @onBackClick="onBack"></ai-title> | ||||
|     </template> | ||||
|     <template slot="content"> | ||||
|       <ai-search-bar class="search-bar"> | ||||
|         <template #left> | ||||
|           <el-button size="small" type="primary" icon="iconfont iconAdd" @click="isShow = true">添加</el-button> | ||||
|           <el-button size="small" :disabled="!ids.length" icon="iconfont iconDelete" @click="removeAll">批量删除</el-button> | ||||
|           <el-select size="small" style="width: 200px;" v-model="search.girdId" placeholder="所属网格" clearable @change="getListInit()"> | ||||
|             <el-option | ||||
|               v-for="(item,i) in girdList" | ||||
|               :key="i" | ||||
|               :label="item.girdName" | ||||
|               :value="item.id" | ||||
|             > | ||||
|             </el-option> | ||||
|           </el-select> | ||||
|         </template> | ||||
|         <template #right> | ||||
|           <el-input | ||||
|             v-model="search.name" | ||||
|             class="search-input" | ||||
|             size="small" | ||||
|             v-throttle="() => {search.current = 1, getList()}" | ||||
|             placeholder="姓名/身份证/联系方式" | ||||
|             clearable | ||||
|             @clear="search.current = 1, search.name = '', getList()" | ||||
|             suffix-icon="iconfont iconSearch"> | ||||
|           </el-input> | ||||
|         </template> | ||||
|       </ai-search-bar> | ||||
|       <ai-table | ||||
|         :tableData="tableData" | ||||
|         :col-configs="colConfigs" | ||||
|         :total="total" | ||||
|         style="margin-top: 6px;" | ||||
|         :current.sync="search.current" | ||||
|         :size.sync="search.size" | ||||
|         @handleSelectionChange="handleSelectionChange" | ||||
|         @getList="getList"> | ||||
|         <el-table-column slot="options" width="100px" fixed="right" label="操作" align="center"> | ||||
|           <template slot-scope="{ row }"> | ||||
|             <div class="table-options"> | ||||
|               <el-button type="text" @click="remove(row.gmrId)">删除</el-button> | ||||
|             </div> | ||||
|           </template> | ||||
|         </el-table-column> | ||||
|       </ai-table> | ||||
|       <ai-dialog | ||||
|         :visible.sync="isShow" | ||||
|         width="890px" | ||||
|         @close="closeDialog" | ||||
|         title="添加户主" | ||||
|         @onConfirm="onConfirm"> | ||||
|         <ai-area-select clearable always-show :instance="instance"  v-model="areaId" :disabled-level="disabledLevel" @change="search.current = 1, getUserList()"></ai-area-select> | ||||
|         <span style="margin-top:16px;"><span style="color:#f46;margin-right:4px;">*</span>网格:</span> | ||||
|         <el-select size="small" style="width: 280px;margin-top:16px;" v-model="girdId" placeholder="请选择网格" clearable> | ||||
|           <el-option | ||||
|             v-for="(item,i) in girdList" | ||||
|             :key="i" | ||||
|             :label="item.girdName" | ||||
|             :value="item.id" | ||||
|           > | ||||
|           </el-option> | ||||
|         </el-select> | ||||
|         <div class="AiWechatSelecter-container"> | ||||
|           <div class="AiWechatSelecter-container__left" v-loading="isLoading"> | ||||
|             <div class="AiWechatSelecter-header"> | ||||
|               <div class="AiWechatSelecter-header__left"> | ||||
|                 <h2>户主信息列表</h2> | ||||
|               </div> | ||||
|               <el-input | ||||
|                 class="search-input" | ||||
|                 size="mini" | ||||
|                 placeholder="请输入姓名/身份证号" | ||||
|                 v-model="name" | ||||
|                 clearable | ||||
|                 @keyup.enter.native="getUserList()" | ||||
|                 @clear="name = '', getUserList()" | ||||
|                 suffix-icon="iconfont iconSearch"> | ||||
|               </el-input> | ||||
|             </div> | ||||
|             <el-scrollbar class="AiWechatSelecter-list"> | ||||
|               <el-checkbox-group v-model="chooseUser"> | ||||
|                 <el-checkbox | ||||
|                   :label="`${item.name}~${item.id}`" | ||||
|                   v-for="(item, index) in userList" | ||||
|                   :key="index"> | ||||
|                   {{ item.name }}-{{ item.idNumber }} | ||||
|                 </el-checkbox> | ||||
|               </el-checkbox-group> | ||||
|               <AiEmpty v-if="!this.userList.length"></AiEmpty> | ||||
|             </el-scrollbar> | ||||
|           </div> | ||||
|           <div class="AiWechatSelecter-container__right"> | ||||
|             <div class="AiWechatSelecter-header AiWechatSelecter-header__right"> | ||||
|               <h2>已选择</h2> | ||||
|               <el-button size="mini" icon="el-icon-delete" @click="clearAll">清空</el-button> | ||||
|             </div> | ||||
|             <el-scrollbar class="AiWechatSelecter-list"> | ||||
|               <div class="tags-wrapper"> | ||||
|                 <el-tag | ||||
|                   v-for="(item, index) in chooseUser" | ||||
|                   :key="index" | ||||
|                   closable | ||||
|                   @close="del(item)" | ||||
|                   size="small" | ||||
|                   type="info"> | ||||
|                   {{ item.split('~')[0] }} | ||||
|                 </el-tag> | ||||
|               </div> | ||||
|             </el-scrollbar> | ||||
|           </div> | ||||
|         </div> | ||||
|       </ai-dialog> | ||||
|     </template> | ||||
|   </ai-list> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|   import { mapState } from 'vuex' | ||||
|   export default { | ||||
|     name: 'Family', | ||||
|  | ||||
|     props: { | ||||
|       instance: Function, | ||||
|       dict: Object, | ||||
|       params: Object | ||||
|     }, | ||||
|  | ||||
|     data() { | ||||
|       return { | ||||
|         search: { | ||||
|           current: 1, | ||||
|           size: 10, | ||||
|           name: '', | ||||
|           girdId: '' | ||||
|         }, | ||||
|         isLoading: false, | ||||
|         form: { | ||||
|  | ||||
|         }, | ||||
|         userList: [], | ||||
|         name: '', | ||||
|         chooseUser: [], | ||||
|         isShow: false, | ||||
|         total: 10, | ||||
|         colConfigs: [ | ||||
|           { type: 'selection', label: '' }, | ||||
|           { prop: 'name',  label: '户主姓名', align: 'left', width: '200px' }, | ||||
|           { prop: 'idNumber', label: '身份证号', align: 'center' }, | ||||
|           { prop: 'phone', label: '联系方式', align: 'center' }, | ||||
|           { prop: 'girdName', label: '所属网格', align: 'center' }, | ||||
|           { prop: 'createTime', label: '添加时间', align: 'center' }, | ||||
|           { slot: 'options', label: '操作', align: 'center' } | ||||
|         ], | ||||
|         tableData: [], | ||||
|         areaId: '', | ||||
|         ids: [], | ||||
|         disabledLevel: 0, | ||||
|         girdList: [], | ||||
|         girdId: '', | ||||
|       } | ||||
|     }, | ||||
|  | ||||
|     computed: { | ||||
|       ...mapState(['user']) | ||||
|     }, | ||||
|  | ||||
|     created() { | ||||
|       this.areaId = this.user.info.areaId | ||||
|       this.disabledLevel = this.user.info.areaList.length | ||||
|       this.dict.load('epidemicDangerousAreaLevel').then(() => { | ||||
|         this.getGirdList() | ||||
|         this.getList() | ||||
|         this.getUserList() | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     methods: { | ||||
|       getGirdList() { | ||||
|         this.instance.post(`/app/appgirdmemberinfo/queryMyGirdListByLevel2?girdMemberId=${this.params.id}`).then(res => { | ||||
|           if (res.code == 0) { | ||||
|             this.girdList = res.data | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|       getListInit() { | ||||
|         this.search.current = 1 | ||||
|         this.getList() | ||||
|       }, | ||||
|       getList () { | ||||
|         this.instance.post(`/app/appgirdmemberresident/listByGirdMember`, null, { | ||||
|           params: { | ||||
|             ...this.search, | ||||
|             girdMemberId: this.params.id, | ||||
|             areaId: this.areaId | ||||
|           } | ||||
|         }).then(res => { | ||||
|           if (res.code == 0) { | ||||
|             this.tableData = res.data.records | ||||
|             this.total = res.data.total | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|     removeAll() { | ||||
|         if (!this.ids) { | ||||
|           return this.$message.error('请选择户主') | ||||
|         } | ||||
|         this.remove(this.ids.join(',')) | ||||
|       }, | ||||
|       handleSelectionChange(e) { | ||||
|         this.ids = e.map(v => v.gmrId) | ||||
|       }, | ||||
|  | ||||
|       clearAll () { | ||||
|         this.chooseUser = [] | ||||
|       }, | ||||
|  | ||||
|       onConfirm () { | ||||
|         if(!this.girdId) { | ||||
|           return this.$message.error('请选择网格') | ||||
|         } | ||||
|  | ||||
|         if (!this.chooseUser.length) { | ||||
|           return this.$message.error('请选择户主') | ||||
|         } | ||||
|  | ||||
|         const residentList = this.chooseUser.map(v => { | ||||
|           return { | ||||
|             girdMemberId: this.params.id, | ||||
|             name: v.split('~')[0], | ||||
|             residentId: v.split('~')[1], | ||||
|             girdId: this.girdId | ||||
|           } | ||||
|         }) | ||||
|         this.instance.post(`/app/appgirdmemberresident/add`, { | ||||
|           residentList | ||||
|         }).then(res => { | ||||
|           if (res.code == 0) { | ||||
|             this.current = 1 | ||||
|             this.getList() | ||||
|             this.$message.success('添加成功') | ||||
|             this.closeDialog() | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|       closeDialog() { | ||||
|         this.isShow = false | ||||
|         this.chooseUser = [] | ||||
|         this.girdId = '' | ||||
|         this.name = '' | ||||
|         this.areaId = this.user.info.areaId | ||||
|         this.getUserList() | ||||
|       }, | ||||
|  | ||||
|       del (e) { | ||||
|         this.chooseUser.splice(this.chooseUser.indexOf(e), 1) | ||||
|       }, | ||||
|  | ||||
|       getUserList () { | ||||
|         this.isLoading = true | ||||
|         this.instance.post(`/app/appresident/list`, null, { | ||||
|           params: { | ||||
|             current: 1, | ||||
|             size: 200, | ||||
|             con: this.name, | ||||
|             householdName: 1, | ||||
|             areaId: this.areaId, | ||||
|           } | ||||
|         }).then(res => { | ||||
|           if (res.code == 0) { | ||||
|             this.userList = res.data.records | ||||
|           } | ||||
|  | ||||
|           this.isLoading = false | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       onBack () { | ||||
|         this.$emit('change', { | ||||
|           type: 'list' | ||||
|         }) | ||||
|       }, | ||||
|  | ||||
|       remove(id) { | ||||
|         this.$confirm('确定删除该数据?').then(() => { | ||||
|           this.instance.post(`/app/appgirdmemberresident/delete?ids=${id}`).then(res => { | ||||
|             if (res.code == 0) { | ||||
|               this.$message.success('删除成功!') | ||||
|               this.getList() | ||||
|             } | ||||
|           }) | ||||
|         }) | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
|   .Family { | ||||
|     .AiWechatSelecter-container { | ||||
|       display: flex; | ||||
|       height: 380px; | ||||
|       margin-top: 20px; | ||||
|  | ||||
|       ::v-deep { | ||||
|         .el-icon-circle-close { | ||||
|           display: inline-block!important; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .tree-container { | ||||
|         & > span { | ||||
|           display: block; | ||||
|           margin-bottom: 4px; | ||||
|         } | ||||
|  | ||||
|         .tree-user__item { | ||||
|           display: flex; | ||||
|           align-items: center; | ||||
|           margin-bottom: 10px; | ||||
|  | ||||
|           &:last-child { | ||||
|             margin-bottom: 0; | ||||
|           } | ||||
|         } | ||||
|         img { | ||||
|           width: 27px; | ||||
|           height: 27px; | ||||
|           margin-right: 10px; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       ::v-deep .el-tree { | ||||
|         background: transparent; | ||||
|  | ||||
|         .el-tree-node { | ||||
|           margin-bottom: 8px; | ||||
|  | ||||
|           &:last-child { | ||||
|             margin-bottom: 0; | ||||
|           } | ||||
|         } | ||||
|  | ||||
|         .el-tree-node__content { | ||||
|           height: auto; | ||||
|           margin-top: 2px; | ||||
|           // align-items: inherit; | ||||
|         } | ||||
|          | ||||
|         .el-tree-node__expand-icon { | ||||
|           height: 24px; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .mask-btn__wrapper { | ||||
|         position: relative; | ||||
|       } | ||||
|  | ||||
|       .mask-btn { | ||||
|         position: absolute; | ||||
|         left: 0; | ||||
|         top: 0; | ||||
|         width: 100%; | ||||
|         height: 100%; | ||||
|         z-index: 1; | ||||
|       } | ||||
|  | ||||
|       .userlist-item { | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
|         justify-content: space-between; | ||||
|         margin-bottom: 8px; | ||||
|         padding: 0 17px; | ||||
|         cursor: pointer; | ||||
|         user-select: none; | ||||
|  | ||||
|         ::v-deep .el-checkbox__label { | ||||
|           display: none; | ||||
|         } | ||||
|  | ||||
|         .userlist-item__left { | ||||
|           display: flex; | ||||
|           align-items: center; | ||||
|  | ||||
|           span { | ||||
|             color: #222222; | ||||
|             font-size: 14px; | ||||
|           } | ||||
|  | ||||
|           img { | ||||
|             width: 40px; | ||||
|             height: 40px; | ||||
|             margin-right: 8px; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       & > div { | ||||
|         width: 280px; | ||||
|         background: #FCFCFC; | ||||
|         border: 1px solid #D0D4DC; | ||||
|       } | ||||
|  | ||||
|       .AiWechatSelecter-list { | ||||
|         height: calc(100% - 40px); | ||||
|         padding: 8px 0; | ||||
|  | ||||
|         ::v-deep .el-scrollbar__wrap { | ||||
|           margin-bottom: 0!important; | ||||
|           overflow-x: hidden; | ||||
|         } | ||||
|  | ||||
|         ::v-deep .el-checkbox-group { | ||||
|           padding: 0 8px; | ||||
|  | ||||
|           .el-checkbox { | ||||
|             display: block; | ||||
|             margin-right: 0; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .AiWechatSelecter-container__left { | ||||
|         flex: 1; | ||||
|       } | ||||
|  | ||||
|       .AiWechatSelecter-container__right { | ||||
|         flex: 1; | ||||
|         margin-left: 20px; | ||||
|  | ||||
|         .AiWechatSelecter-list { | ||||
|           .tags-wrapper { | ||||
|             padding: 0 8px; | ||||
|           } | ||||
|           .el-tag { | ||||
|             margin: 0 8px 8px 0px; | ||||
|             color: #222222; | ||||
|             font-size: 14px; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .AiWechatSelecter-header { | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
|         justify-content: space-between; | ||||
|         height: 40px; | ||||
|         padding: 0 8px 0 0; | ||||
|         border-bottom: 1px solid #D0D4DC; | ||||
|         background: #F5F7FA; | ||||
|  | ||||
|         .AiWechatSelecter-header__left { | ||||
|           display: flex; | ||||
|           align-items: center; | ||||
|           padding: 0 8px; | ||||
|  | ||||
|           h2 { | ||||
|             height: 100%; | ||||
|             line-height: 40px; | ||||
|             color: #222222; | ||||
|             font-size: 14px; | ||||
|             text-align: center; | ||||
|             cursor: pointer; | ||||
|             border-bottom: 2px solid transparent; | ||||
|  | ||||
|             &.active { | ||||
|               color: #2266FF; | ||||
|               border-color: #2266FF; | ||||
|             } | ||||
|           } | ||||
|         } | ||||
|  | ||||
|         .el-button { | ||||
|           height: 28px; | ||||
|           padding: 7px 5px; | ||||
|         } | ||||
|  | ||||
|         .el-input { | ||||
|           width: 160px; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .AiWechatSelecter-header__right { | ||||
|         padding: 0 8px; | ||||
|  | ||||
|         h2 { | ||||
|           color: #222222; | ||||
|           font-size: 14px; | ||||
|           text-align: center; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| </style> | ||||
| @@ -1,543 +0,0 @@ | ||||
| <template> | ||||
|   <section style="height: 100%"> | ||||
|     <ai-detail class="add"> | ||||
|       <template #title> | ||||
|         <ai-title :title="title" :isShowBack="true" :isShowBottomBorder="true" @onBackClick="cancel(false)"></ai-title> | ||||
|       </template> | ||||
|       <template #content> | ||||
|         <el-form | ||||
|           ref="rules" | ||||
|           :model="forms" | ||||
|           :rules="formRules" | ||||
|           size="small" | ||||
|           label-suffix=":" | ||||
|           label-width="136px"> | ||||
|           <ai-card title="基础信息" > | ||||
|             <template #right  v-if="title=='网格员详情'"> | ||||
|               <span style="color:#2266FF;cursor: pointer;font-size: 12px;" class="iconfont iconEdit" v-if="editOne==false" @click="editOne=true">修改</span> | ||||
|               <span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="editOne==true" @click="searchDetail(),editOne=false">取消</span> | ||||
|               <span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="editOne==true" @click="save()">保存</span> | ||||
|             </template> | ||||
|             <template slot="content"> | ||||
|               <div class="above" v-if="editOne==true"> | ||||
|                 <div class="left"> | ||||
|                   <el-form-item label="网格员姓名" prop="name" > | ||||
|                     <el-input v-model="forms.name" placeholder="请选择网格员" disabled> | ||||
|                       <template #append> | ||||
|                         <ai-wechat-selecter :isMultiple="false" refs="addTags" :instance="instance" v-model="users" @change="getSelectPerson"> | ||||
|                           <el-button size="small" type="primary"><span style="color: #fff">选择成员</span></el-button> | ||||
|                         </ai-wechat-selecter> | ||||
|                       </template> | ||||
|                     </el-input> | ||||
|                   </el-form-item> | ||||
|                   <el-form-item label="选用日期" prop="selectionDate" > | ||||
|                     <el-date-picker | ||||
|                       v-model="forms.selectionDate" | ||||
|                       type="date" | ||||
|                       style="width: 100%" | ||||
|                       value-format="yyyy-MM-dd" | ||||
|                       size="medium" | ||||
|                       placeholder="选择日期"> | ||||
|                     </el-date-picker> | ||||
|                   </el-form-item> | ||||
|                   <el-form-item label="身份证号" prop="idNumber" > | ||||
|                       <el-input v-model="forms.idNumber" placeholder="请输入…" maxlength="18" show-word-limit></el-input> | ||||
|                   </el-form-item> | ||||
|                 </div> | ||||
|                 <div class="right"> | ||||
|                   <el-form-item label="照片" prop="photo"> | ||||
|                     <!-- <ai-uploader :instance="instance" v-model="photoList" :limit="1" @change="photoChange"></ai-uploader> --> | ||||
|                     <ai-avatar :instance="instance"  v-model="forms.photo"/> | ||||
|                   </el-form-item> | ||||
|                 </div> | ||||
|               </div> | ||||
|               <div class="above" v-if="editOne==true"> | ||||
|                 <div class="left"> | ||||
|                   <el-form-item label="出生日期" prop="birthday" > | ||||
|                     <el-date-picker | ||||
|                         v-model="forms.birthday" | ||||
|                         type="date" | ||||
|                         style="width: 100%" | ||||
|                         value-format="yyyy-MM-dd" | ||||
|                         size="medium" | ||||
|                         placeholder="选择日期"> | ||||
|                     </el-date-picker> | ||||
|                   </el-form-item> | ||||
|                   <el-form-item label="联系电话" prop="phone" > | ||||
|                     <el-input v-model.number="forms.phone" placeholder="请输入…" maxlength="11" show-word-limit></el-input> | ||||
|                   </el-form-item> | ||||
|                 </div> | ||||
|                 <div class="right"> | ||||
|                   <el-form-item label="性别" prop="sex" > | ||||
|                     <el-select size="medium" style="width: 100%" v-model="forms.sex" placeholder="请选择..." clearable> | ||||
|                       <el-option | ||||
|                         v-for="(item,i) in dict.getDict('sex')" | ||||
|                         :key="i" | ||||
|                         :label="item.dictName" | ||||
|                         :value="item.dictValue" | ||||
|                       > | ||||
|                       </el-option> | ||||
|                     </el-select> | ||||
|                   </el-form-item> | ||||
|                   <el-form-item label="电子邮箱" prop="mail" > | ||||
|                       <el-input v-model="forms.mail" placeholder="请输入…"></el-input> | ||||
|                   </el-form-item> | ||||
|                 </div> | ||||
|               </div> | ||||
|               <template  v-if="editOne==false"> | ||||
|                 <div class="above"> | ||||
|                   <div class="left"> | ||||
|                     <ai-wrapper label-width="120px"  :columnsNumber="1"  style="margin-top: 16px;"> | ||||
|                       <ai-info-item label="网格员姓名:"><span >{{forms.name}}</span></ai-info-item> | ||||
|                       <ai-info-item label="选用日期:"><span >{{forms.selectionDate}}</span></ai-info-item> | ||||
|                       <ai-info-item label="身份证号:"><span >{{forms.idNumber}}</span></ai-info-item> | ||||
|                       <ai-info-item label="性别:"><span >{{dict.getLabel('sex', forms.sex)}}</span></ai-info-item> | ||||
|                       <ai-info-item label="出生日期:"><span >{{forms.birthday}}</span></ai-info-item> | ||||
|                       <ai-info-item label="电子邮箱:"><span >{{forms.mail}}</span></ai-info-item> | ||||
|                     </ai-wrapper> | ||||
|                   </div> | ||||
|                   <div class="right"> | ||||
|                     <ai-wrapper label-width="120px"  :columnsNumber="1"  style="margin-top: 16px;"> | ||||
|                       <ai-info-item label="照片:" v-if="forms.photo"> | ||||
|                         <span > | ||||
|                           <ai-uploader :instance="instance" v-model="photoList" disabled :limit="1" @change="photoChange"></ai-uploader> | ||||
|                         </span> | ||||
|                       </ai-info-item> | ||||
|                       <ai-info-item label="联系电话:"><span >{{forms.phone}}</span></ai-info-item> | ||||
|                     </ai-wrapper> | ||||
|                   </div> | ||||
|                 </div> | ||||
|               </template> | ||||
|             </template> | ||||
|           </ai-card> | ||||
|           <ai-card title="关联信息" > | ||||
|             <template #right  v-if="title=='网格员详情'"> | ||||
|               <span style="color:#2266FF;cursor: pointer;font-size: 12px;" class="iconfont iconEdit" v-if="editTwo==false" @click="editTwo=true">修改</span> | ||||
|               <span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="editTwo==true" @click="searchDetail(),editTwo=false">取消</span> | ||||
|               <span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="editTwo==true" @click="save()">保存</span> | ||||
|             </template> | ||||
|             <template slot="content"> | ||||
|               <template v-if="editTwo==true"> | ||||
|                 <el-form-item label="责任网格" prop="girdInfoList" style="margin-top: 8px;"> | ||||
|                   <el-form-item style="width: 100%" label-width="80px" :label="'网格' + (index + 1)" v-for="(item, index) in forms.girdInfoList" :key="'选项' + (index + 1)"> | ||||
|                     <div class="form-flex"> | ||||
|                       <el-select v-model="item.checkType" placeholder="请选择网格角色"> | ||||
|                         <el-option | ||||
|                           v-for="item in options" | ||||
|                           :key="item.value" | ||||
|                           :label="item.label" | ||||
|                           :value="item.value"> | ||||
|                         </el-option> | ||||
|                       </el-select> | ||||
|                       <el-input disabled v-model="item.girdName" :maxlength="200" size="small" placeholder="请选择责任网格"> | ||||
|                         <template slot="append"> | ||||
|                           <el-button size="small" @click="currIndex = index, showGrid = true">选择网格</el-button> | ||||
|                         </template> | ||||
|                       </el-input> | ||||
|                       <el-button type="danger" size="small" @click="removeGrid(index)">删除</el-button> | ||||
|                     </div> | ||||
|                   </el-form-item> | ||||
|                   <el-button type="primary" size="small" @click="addGrid">添加选项</el-button> | ||||
|                   <!-- <el-button size="small" @click="showGrid=true">选择网格</el-button> --> | ||||
|                 </el-form-item> | ||||
|                 <div class="above"> | ||||
|                   <div class="left"> | ||||
|                     <el-form-item label="是否特殊网格员" prop="isGirdMember" > | ||||
|                       <el-radio-group v-model="forms.isGirdMember"> | ||||
|                         <el-radio label="0">否</el-radio> | ||||
|                         <el-radio label="1">是</el-radio> | ||||
|                       </el-radio-group> | ||||
|                     </el-form-item> | ||||
|                     <el-form-item label="政治面貌" prop="politicsStatus" > | ||||
|                       <el-select v-model="forms.politicsStatus" size="small" style="width: 100%" placeholder="请选择..." clearable> | ||||
|                         <el-option v-for="(item,i) in dict.getDict('politicsStatus')" :key="i" :label="item.dictName" :value="item.dictValue"></el-option> | ||||
|                       </el-select> | ||||
|                     </el-form-item> | ||||
|                   </div> | ||||
|                   <div class="right"> | ||||
|                     <el-form-item label="特殊网格员" prop="girdMemberType" v-if="forms.isGirdMember==1"> | ||||
|                       <el-select v-model="forms.girdMemberType" size="small" placeholder="请选择..." clearable> | ||||
|                         <el-option v-for="(item,i) in dict.getDict('girdMemberType')" :key="i" :label="item.dictName" :value="item.dictValue"></el-option> | ||||
|                       </el-select> | ||||
|                     </el-form-item> | ||||
|                     <el-form-item label="学历" prop="education" > | ||||
|                       <el-select v-model="forms.education" style="width: 100%" size="small" placeholder="请选择..." clearable> | ||||
|                         <el-option v-for="(item,i) in dict.getDict('education')" :key="i" :label="item.dictName" :value="item.dictValue"></el-option> | ||||
|                       </el-select> | ||||
|                     </el-form-item> | ||||
|                   </div> | ||||
|                 </div> | ||||
|                 <el-form-item label="个人简介" prop="introduction" > | ||||
|                   <el-input | ||||
|                     type="textarea" | ||||
|                     maxlength="200" | ||||
|                     show-word-limit | ||||
|                     :rows="4" | ||||
|                     placeholder="请输入内容" | ||||
|                     v-model="forms.introduction"> | ||||
|                   </el-input> | ||||
|                 </el-form-item> | ||||
|                 <el-form-item label="人生格言" prop="motto" > | ||||
|                   <el-input | ||||
|                     type="textarea" | ||||
|                     maxlength="200" | ||||
|                     show-word-limit | ||||
|                     :rows="4" | ||||
|                     placeholder="请输入内容" | ||||
|                     v-model="forms.motto"> | ||||
|                   </el-input> | ||||
|                 </el-form-item> | ||||
|               </template> | ||||
|               <template v-if="editTwo==false"> | ||||
|                 <ai-wrapper label-width="120px" :columnsNumber="2" style="margin-top: 16px;"> | ||||
|                   <ai-info-item label="责任网格:" style="width: 100%;"><span v-html="girdInfoStr || '-'"></span></ai-info-item> | ||||
|                   <ai-info-item label="是否特殊网格员:"> | ||||
|                     <span>{{ !forms.isGirdMember ? '-' : forms.isGirdMember === '0' ? '否' : '是' }}</span> | ||||
|                   </ai-info-item> | ||||
|                   <ai-info-item label="特殊网格员:" v-if="forms.isGirdMember==1"><span >{{dict.getLabel('girdMemberType', forms.girdMemberType)}}</span></ai-info-item> | ||||
|                   <ai-info-item label="政治面貌:"><span >{{dict.getLabel('politicsStatus', forms.politicsStatus)}}</span></ai-info-item> | ||||
|                   <ai-info-item label="学历:"><span >{{dict.getLabel('education', forms.education)}}</span></ai-info-item> | ||||
|                   <ai-info-item label="人生格言:" style="width: 100%;"><span >{{forms.motto}}</span></ai-info-item> | ||||
|                   <ai-info-item label="个人简介:" style="width: 100%;"><span >{{forms.introduction}}</span></ai-info-item> | ||||
|                 </ai-wrapper> | ||||
|               </template> | ||||
|             </template> | ||||
|           </ai-card> | ||||
|         </el-form> | ||||
|         <ai-dialog title="选择网格" :visible.sync="showGrid" :customFooter="true"  :destroyOnClose="true" border  width="720px"> | ||||
|           <div class="grid"> | ||||
|             <el-tree | ||||
|               :data="treeObj.treeList" | ||||
|               :props="treeObj.defaultProps" | ||||
|               node-key="id" | ||||
|               ref="tree" | ||||
|               :check-strictly="true" | ||||
|               show-checkbox | ||||
|               :default-checked-keys="currCheckedKeys" | ||||
|               default-expand-all | ||||
|               @check="onCheckChange"> | ||||
|             </el-tree> | ||||
|           </div> | ||||
|           <div class="dialog-footer" slot="footer" > | ||||
|             <el-button  size="medium" @click="showGrid=false">取消</el-button> | ||||
|             <el-button  type="primary" size="medium" @click="getCheckedTree()">确认</el-button> | ||||
|           </div> | ||||
|         </ai-dialog> | ||||
|       </template> | ||||
|       <template #footer v-if="title=='添加网格员'"> | ||||
|         <el-button @click="cancel(false)" class="delete-btn footer-btn" >取 消</el-button> | ||||
|         <el-button type="primary" @click="save()"  class="footer-btn">提 交</el-button> | ||||
|       </template> | ||||
|     </ai-detail> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: "add", | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     dict: Object, | ||||
|     permissions: Function, | ||||
|     params: Object, | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       users: [], | ||||
|       currIndex: 0, | ||||
|       forms: { | ||||
|         birthday: "", | ||||
|         education: "", | ||||
|         girdId: "", | ||||
|         girdInfoList: [], | ||||
|         girdMemberType: "", | ||||
|         id: "", | ||||
|         wxUserId: '', | ||||
|         introduction: "", | ||||
|         isGirdMember: "", | ||||
|         mail: "", | ||||
|         motto: "", | ||||
|         name: "", | ||||
|         phone: "", | ||||
|         photo: "", | ||||
|         politicsStatus: "", | ||||
|         selectionDate: "", | ||||
|         sex: "", | ||||
|         userId: "", | ||||
|       }, | ||||
|       options: [{ | ||||
|         value: '2', | ||||
|         label: '网格长' | ||||
|       }, { | ||||
|         value: '1', | ||||
|         label: '网格员' | ||||
|       }], | ||||
|       showGrid: false, | ||||
|       treeObj: { | ||||
|         treeList: [], | ||||
|         defaultProps: { | ||||
|           children: "girdList", | ||||
|           label: "girdName", | ||||
|         }, | ||||
|         checkedKeys: [], | ||||
|       }, | ||||
|       girdInfoStr: '', | ||||
|       photoList: [], | ||||
|       title: "添加网格员", | ||||
|       editOne: false, | ||||
|       editTwo: false, | ||||
|     }; | ||||
|   }, | ||||
|   created() { | ||||
|     this.beforeSelectTree() | ||||
|     if (this.params.id) { | ||||
|       this.searchDetail(); | ||||
|       this.title = "网格员详情"; | ||||
|       this.editOne = false; | ||||
|       this.editTwo = false; | ||||
|     } else { | ||||
|       this.title = "添加网格员"; | ||||
|       this.editOne = true; | ||||
|       this.editTwo = true; | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     currCheckedKeys () { | ||||
|       if (this.forms && this.forms.girdInfoList && this.forms.girdInfoList[this.currIndex] && this.forms.girdInfoList[this.currIndex].id) { | ||||
|         return [this.forms.girdInfoList[this.currIndex].id] | ||||
|       } | ||||
|  | ||||
|       return [] | ||||
|     }, | ||||
|     formRules() { | ||||
|       let phonePass = (rule, value, callback) => { | ||||
|         let reg = /^(?:(?:\+|00)86)?1\d{10}$/; | ||||
|         if (value) { | ||||
|           if (reg.test(value)) { | ||||
|             callback(); | ||||
|           } else { | ||||
|             callback(new Error("联系电话格式错误")); | ||||
|           } | ||||
|         } else { | ||||
|           callback(new Error("请输入联系电话")); | ||||
|         } | ||||
|       }; | ||||
|       return { | ||||
|         name: [ | ||||
|           { required: true, message: "请输入网格员姓名", trigger: "change" }, | ||||
|         ], | ||||
|         selectionDate: [ | ||||
|           { required: true, message: "请选择选用日期", trigger: "change" }, | ||||
|         ], | ||||
|         phone: [{ required: true, validator: phonePass, trigger: "blur" }], | ||||
|         girdInfoList: [ | ||||
|           { required: true, message: "请选择责任网络", trigger: "change" }, | ||||
|         ], | ||||
|         mail: [ | ||||
|           { | ||||
|             type: "email", | ||||
|             message: "请输入正确的邮箱地址", | ||||
|             trigger: ["blur", "change"], | ||||
|           }, | ||||
|         ] | ||||
|       }; | ||||
|     }, | ||||
|   }, | ||||
|   methods: { | ||||
|     cancel (isRefresh) { | ||||
|       this.$emit('change', { | ||||
|         type: 'list', | ||||
|         isRefresh: !!isRefresh, | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     onCheckChange (e) { | ||||
|       this.$nextTick(() => { | ||||
|         this.$refs.tree.getCheckedKeys().forEach(v => { | ||||
|           this.$refs.tree.setChecked(v, false) | ||||
|         }) | ||||
|         this.$refs.tree.setChecked(e.id, true) | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     removeGrid (index) { | ||||
|       this.forms.girdInfoList.splice(index, 1) | ||||
|     }, | ||||
|  | ||||
|     addGrid () { | ||||
|       this.forms.girdInfoList.push({ | ||||
|         id: '', | ||||
|         girdName: '', | ||||
|         checkType: '' | ||||
|       }) | ||||
|     }, | ||||
|     photoChange(val) { | ||||
|       this.forms.photo = val[0].url; | ||||
|     }, | ||||
|     getSelectPerson(val) { | ||||
|       this.forms.name = val[0].name; | ||||
|       this.forms.phone = val[0].phone; | ||||
|       this.forms.userId = val[0].sysUserId | ||||
|       this.forms.wxUserId = val[0].id | ||||
|     }, | ||||
|     getCheckedTree() { | ||||
|       if (!this.$refs.tree.getCheckedNodes().length) { | ||||
|         return this.$message.error('请选择网格') | ||||
|       } | ||||
|  | ||||
|       if (this.$refs.tree.getCheckedNodes().length > 1) { | ||||
|         return this.$message.error('不支持多选') | ||||
|       } | ||||
|       this.$set(this.forms.girdInfoList, this.currIndex, { | ||||
|         ...this.$refs.tree.getCheckedNodes()[0], | ||||
|         checkType: this.forms.girdInfoList[this.currIndex].checkType | ||||
|       }) | ||||
|       this.showGrid = false; | ||||
|     }, | ||||
|     handleClose(tag) { | ||||
|       this.forms.girdInfoList.splice(this.forms.girdInfoList.indexOf(tag), 1); | ||||
|     }, | ||||
|     beforeSelectTree() { | ||||
|       this.treeObj.checkedKeys = []; | ||||
|       this.instance.post(`/app/appgirdinfo/listAll`, null, null).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.treeObj.treeList = res.data; | ||||
|           this.forms.girdInfoList.map((e) => { | ||||
|             this.treeObj.checkedKeys.push(e.id); | ||||
|           }); | ||||
|         } | ||||
|       }); | ||||
|     }, | ||||
|     save() { | ||||
|       this.$refs["rules"].validate((valid) => { | ||||
|         if (valid) { | ||||
|           for (let i = 0; i < this.forms.girdInfoList.length; i++) { | ||||
|             const currInfo = this.forms.girdInfoList[i] | ||||
|             const arr = JSON.parse(JSON.stringify(this.forms.girdInfoList)) | ||||
|             arr.splice(i, 1) | ||||
|             const sameInfo = arr.filter(v => v.id === currInfo.id) | ||||
|             if (!currInfo.checkType) { | ||||
|               return this.$message.error('请选择网格员类型') | ||||
|             } | ||||
|  | ||||
|             if (!currInfo.id) { | ||||
|               return this.$message.error('请选择网格') | ||||
|             } | ||||
|  | ||||
|             if (currInfo.checkType === '1' && currInfo.girdLevel !== '2') { | ||||
|               return this.$message.error(`一级、二级网格不能添加网格员`) | ||||
|             } | ||||
|  | ||||
|             if (sameInfo.length) { | ||||
|               return this.$message.error('不能选择同一网格重复绑定') | ||||
|             } | ||||
|           } | ||||
|  | ||||
|           this.instance.post(`/app/appgirdmemberinfo/addOrUpdate`,{ | ||||
|             ...this.forms, | ||||
|             girdInfoListStr: this.forms.girdInfoList.map(v => v.girdName).join(',') | ||||
|           }).then((res) => { | ||||
|             if (res.code == 0) { | ||||
|               if (this.title == "添加网格员") { | ||||
|                 this.cancel(true) | ||||
|               } else { | ||||
|                 this.editOne = false | ||||
|                 this.editTwo = false | ||||
|                 this.searchDetail() | ||||
|               } | ||||
|             } | ||||
|           }); | ||||
|         } else { | ||||
|           return false | ||||
|         } | ||||
|       }); | ||||
|     }, | ||||
|     searchDetail() { | ||||
|       this.instance | ||||
|         .post(`/app/appgirdmemberinfo/queryDetailById`, null, { | ||||
|           params: { id: this.params.id }, | ||||
|         }) | ||||
|         .then((res) => { | ||||
|           if (res.code == 0) { | ||||
|             this.forms = { | ||||
|               ...res.data, | ||||
|               girdInfoList: res.data.girdInfoList || [] | ||||
|             }; | ||||
|             this.users = [{ | ||||
|               name: res.data.name, | ||||
|               phone: res.data.phone, | ||||
|               userId: res.data.id, | ||||
|               id: res.data.wxUserId | ||||
|             }] | ||||
|             this.girdInfoStr = '' | ||||
|             this.photoList = [{ url: this.forms.photo }]; | ||||
|             if (res.data.girdInfoList) { | ||||
|               res.data.girdInfoList.forEach((e) => { | ||||
|                 this.girdInfoStr = this.girdInfoStr + `${e.checkType === '1' ? '网格员' : '网格长'}-${e.girdName} ` | ||||
|               }) | ||||
|             } | ||||
|           } | ||||
|         }); | ||||
|     }, | ||||
|   }, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .add { | ||||
|   height: 100%; | ||||
|  | ||||
|     .form-flex { | ||||
|       display: flex; | ||||
|       align-items: center; | ||||
|  | ||||
|       & > .el-button { | ||||
|         margin-left: 20px; | ||||
|       } | ||||
|  | ||||
|       .el-input { | ||||
|         width: 300px; | ||||
|         margin-left: 20px; | ||||
|       } | ||||
|  | ||||
|       ::v-deep .el-form-item__content { | ||||
|         margin-left: 0!important; | ||||
|       } | ||||
|     } | ||||
|   .ai-detail__title { | ||||
|     background-color: #fff; | ||||
|   } | ||||
|   .ai-detail__content { | ||||
|     .ai-detail__content--wrapper { | ||||
|       .el-form { | ||||
|         // background-color: #fff; | ||||
|         // padding: 0 60px; | ||||
|         .flex { | ||||
|           display: flex; | ||||
|           flex-wrap: wrap; | ||||
|           justify-content: space-between; | ||||
|           .el-form-item { | ||||
|             width: 48%; | ||||
|           } | ||||
|           .buildingTypes { | ||||
|             width: 100%; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   ::v-deep .el-tag { | ||||
|     margin-right: 8px; | ||||
|     color: #333333; | ||||
|   } | ||||
|   .footer-btn { | ||||
|     width: 92px; | ||||
|   } | ||||
|   .above{ | ||||
|     display: flex; | ||||
|     .left, .right{ | ||||
|       flex: 1; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
		Reference in New Issue
	
	Block a user