170 lines
		
	
	
		
			7.5 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			170 lines
		
	
	
		
			7.5 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
|   <section class="hrList">
 | |
|     <ai-list>
 | |
|       <ai-title slot="title" title="监测对象" isShowBottomBorder isShowArea v-model="search.areaId" :instance="instance"
 | |
|                 @change="page.current=1,getTableData()">
 | |
|         <template #rightBtn>
 | |
|           <el-button type="primary" icon="iconfont iconSetting" @click="dialog=true">预警规则</el-button>
 | |
|         </template>
 | |
|       </ai-title>
 | |
|       <template #content>
 | |
|         <ai-search-bar>
 | |
|           <template #left>
 | |
|             <ai-select placeholder="档案状态" v-model="search.status" :selectList="dict.getDict('fpPrtpStatus')" @change="page.current=1,getTableData()"/>
 | |
|             <ai-select placeholder="监测对象类型" v-model="search.objectType" :selectList="dict.getDict('fpType')" @change="page.current=1,getTableData()"/>
 | |
|             <ai-select placeholder="风险因素" v-model="search.riskType" :selectList="dict.getDict('fpRiskType')" @change="page.current=1,getTableData()"/>
 | |
|             <el-date-picker value-format="yyyy-MM-dd HH:mm:ss" v-model="search.birthStart"  type="date" size="small"
 | |
|               unlink-panels placeholder="选择出生开始日期" @change="page.current=1,getTableData()" />
 | |
|             <el-date-picker value-format="yyyy-MM-dd HH:mm:ss" v-model="search.birthEnd" type="date" size="small" placeholder="选择出生结束日期"
 | |
|               unlink-panels @change="page.current=1,getTableData()" />
 | |
|             <ai-select placeholder="性别" v-model="search.sex" :selectList="dict.getDict('sex')" @change="page.current=1,getTableData()"/>
 | |
|             <ai-select placeholder="文化程度" v-model="search.education" :selectList="dict.getDict('fpEducation')" @change="page.current=1,getTableData()"/>
 | |
|             <ai-select placeholder="民族" v-model="search.nation" :selectList="dict.getDict('fpNation')" @change="page.current=1,getTableData()"/>
 | |
|             <ai-select placeholder="政治面貌" v-model="search.politicsStatus" :selectList="dict.getDict('fpPoliticalOutlook')" @change="page.current=1,getTableData()"/>
 | |
|           </template>
 | |
|           <template #right>
 | |
|             <el-input size="small" placeholder="姓名/身份证/联系方式" v-model="search.con" clearable
 | |
|                       @change="page.current=1,getTableData()"/>
 | |
|           </template>
 | |
|         </ai-search-bar>
 | |
|         <ai-search-bar>
 | |
|           <template #left>
 | |
|             <el-button type="primary" icon="iconfont iconAdd" @click="showEdit()">添加</el-button>
 | |
|             <el-button icon="iconfont iconDelete" :disabled="!ids.length" @click="handleDelete(ids)">删除</el-button>
 | |
|           </template>
 | |
|           <template #right>
 | |
|             <ai-import :instance="instance" name="监测对象" title="导入监测对象"
 | |
|                        suffixName="xlsx"
 | |
|                        url="/app/apppreventionreturntopoverty/downloadTemplate"
 | |
|                        importUrl="/app/apppreventionreturntopoverty/import"
 | |
|                        @onSuccess="page.current=1,search={},getTableData()"/>
 | |
|             <ai-download url="/app/apppreventionreturntopoverty/export" :params="{...search,ids}"
 | |
|                          :instance="instance" fileName="监测对象导出文件"/>
 | |
|           </template>
 | |
|         </ai-search-bar>
 | |
|         <ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size"
 | |
|                   @getList="getTableData" :col-configs="colConfigs" :dict="dict"
 | |
|                   @selection-change="v=>ids=v.map(e=>e.id)">
 | |
|           <el-table-column slot="idNumber" label="身份证号" show-overflow-tooltip align="center">
 | |
|             <template slot-scope="{row}">
 | |
|               <ai-id mode="show" v-model="row.idNumber" :showEyes="false"/>
 | |
|             </template>
 | |
|           </el-table-column>
 | |
|           <el-table-column slot="options" label="操作" fixed="right" align="center">
 | |
|             <template slot-scope="{row}">
 | |
|               <el-button type="text" @click="showDetail(row.id)">详情</el-button>
 | |
|               <el-button type="text" @click="handleDelete(row.id)">删除</el-button>
 | |
|             </template>
 | |
|           </el-table-column>
 | |
|         </ai-table>
 | |
|       </template>
 | |
|     </ai-list>
 | |
|     <ai-dialog :visible.sync="dialog" title="预警规则设置" @closed="form={}" @onConfirm="submitDialog" width="600px">
 | |
|       <el-form :model="form" :rules="rules" ref="DialogForm" size="small" label-width="160px">
 | |
|         <el-form-item label="家庭纯收入标准" prop="type0">
 | |
|           <el-input v-model.number="form.type0" placeholder="请输入" maxlength="8" show-word-limit/>
 | |
|         </el-form-item>
 | |
|         <el-form-item label="家庭人均纯收入标准" prop="type1">
 | |
|           <el-input v-model.number="form.type1" placeholder="请输入" maxlength="8" show-word-limit/>
 | |
|         </el-form-item>
 | |
|       </el-form>
 | |
|     </ai-dialog>
 | |
|   </section>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| import {mapState} from "vuex";
 | |
| 
 | |
| export default {
 | |
|   name: "hrList",
 | |
|   props: {
 | |
|     instance: Function,
 | |
|     dict: Object,
 | |
|     permissions: Function
 | |
|   },
 | |
|   computed: {
 | |
|     ...mapState(['user'])
 | |
|   },
 | |
|   data() {
 | |
|     return {
 | |
|       search: {name: '', objectType: '', riskType: '',isHousehold: 1},
 | |
|       page: {current: 1, size: 10, total: 0},
 | |
|       tableData: [],
 | |
|       colConfigs: [
 | |
|         {type: 'selection'},
 | |
|         {label: "姓名", prop: "name", align: "center"},
 | |
|         {label: "性别", prop: "sex", dict: 'sex', align: "center"},
 | |
|         {slot: "idNumber"},
 | |
|         {label: "年龄", prop: "age", align: "center"},
 | |
|         {label: "民族", prop: "nation", align: "center", dict: "fpNation"},
 | |
|         {label: "文化程度", prop: "education", align: "center", dict: "fpEducation"},
 | |
|         {label: "监测对象类型", prop: "objectType", align: "center", dict:"fpType"},
 | |
|         {label: "风险因素", prop: "riskType", align: "center", dict:"fpRiskType"},
 | |
|         {label: "档案状态", prop: "status", dict: "fpPrtpStatus", align: "center"},
 | |
|         {slot: "options"}
 | |
|       ],
 | |
|       ids: [],
 | |
|       dialog: false,
 | |
|       form: {},
 | |
|       rules: {
 | |
|         type0: [{required: true, message: "请输入家庭纯收入标准", trigger: "change"}],
 | |
|         type1: [{required: true, message: "请输入家庭人均纯收入标准", trigger: "change"}],
 | |
|       }
 | |
|     }
 | |
|   },
 | |
|   methods: {
 | |
|     getTableData() {
 | |
|       this.instance.post("/app/apppreventionreturntopoverty/list", null, {
 | |
|         params: {...this.page, ...this.search}
 | |
|       }).then(res => {
 | |
|         if (res?.data) {
 | |
|           this.tableData = res.data?.records
 | |
|           this.page.total = res.data.total
 | |
|         }
 | |
|       })
 | |
|     },
 | |
|     showEdit(id) {
 | |
|       this.$router.push({query: {id}, hash: "#add"})
 | |
|     },
 | |
|     showDetail(id) {
 | |
|       this.$router.push({query: {id}})
 | |
|     },
 | |
|     handleDelete(ids) {
 | |
|       this.$confirm("是否要删除监测对象").then(() => {
 | |
|         this.instance.post("/app/apppreventionreturntopoverty/delete", null, {
 | |
|           params: {ids: ids?.toString()}
 | |
|         }).then(res => {
 | |
|           if (res?.code == 0) {
 | |
|             this.$message.success("删除成功!")
 | |
|             this.getTableData()
 | |
|           }
 | |
|         })
 | |
|       }).catch(() => 0)
 | |
|     },
 | |
|     submitDialog() {
 | |
|       this.$refs.DialogForm.validate(v => {
 | |
|         if (v) {
 | |
|           this.instance.post(`/app/apppreventionreturntopovertyalarmconfig/addOrUpdate`, this.form).then(res => {
 | |
|             if (res.code == 0) {
 | |
|               this.$message.success('预警规则设置成功');
 | |
|               this.getTableData()
 | |
|               this.dialog = false
 | |
|             }
 | |
|           })
 | |
|         }
 | |
|       })
 | |
|     }
 | |
|   },
 | |
|   created() {
 | |
|     this.search.areaId = this.user.info.areaId
 | |
|     this.getTableData()
 | |
|   }
 | |
| }
 | |
| </script>
 | |
| 
 | |
| <style lang="scss" scoped>
 | |
| .hrList {
 | |
|   height: 100%;
 | |
| }
 | |
| </style>
 |