9 changed files with 4399 additions and 231 deletions
@ -1,213 +0,0 @@ |
|||
<template> |
|||
<div> |
|||
<div class="dialog-h-content scroll-h"> |
|||
<div v-if="initLoading" class="m-row"> |
|||
<div class="m-info"> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">姓名: </span> |
|||
<span>{{ formData.name || "--" }}</span> |
|||
</div> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">联系电话: </span> |
|||
<span>{{ formData.mobile || "--" }}</span> |
|||
</div> |
|||
</el-col> |
|||
</el-row> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">证件类型: </span> |
|||
<span>{{ formData.idTypeName || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">证件号: </span> |
|||
<span>{{ formData.idNum || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">性别: </span> |
|||
<span>{{ |
|||
formData.gender |
|||
? formData.gender == "1" |
|||
? "男" |
|||
: formData.gender == "2" |
|||
? "女" |
|||
: "--" |
|||
: "--" |
|||
}}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">本地户籍: </span> |
|||
<span>{{ |
|||
formData.localResidenceFlag |
|||
? formData.localResidenceFlag == "1" |
|||
? "是" |
|||
: formData.localResidenceFlag == "0" |
|||
? "否" |
|||
: "--" |
|||
: "--" |
|||
}}</span> |
|||
</div> |
|||
|
|||
<div class="info-prop"> |
|||
<span class="info-title-2">户籍地址: </span> |
|||
<span>{{ formData.placeOfDomicile || "--" }}</span> |
|||
</div> |
|||
|
|||
<div class="info-prop"> |
|||
<span class="info-title-2">现居地址: </span> |
|||
<span>{{ formData.currentResidence || "--" }}</span> |
|||
</div> |
|||
|
|||
<div class="info-prop"> |
|||
<span class="info-title-2">残疾类别: </span> |
|||
<span>{{ formData.disabilityCategoryName || "--" }}</span> |
|||
</div> |
|||
|
|||
<div class="info-prop"> |
|||
<span class="info-title-2">残疾级别: </span> |
|||
<span>{{ formData.disabilityLevelName || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">残疾证号: </span> |
|||
<span>{{ formData.disabilityNum || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">低保: </span> |
|||
<span>{{ |
|||
formData.subsistenceAllowanceFlag |
|||
? formData.subsistenceAllowanceFlag == "1" |
|||
? "是" |
|||
: formData.subsistenceAllowanceFlag == "0" |
|||
? "否" |
|||
: "--" |
|||
: "--" |
|||
}}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">退休金额: </span> |
|||
<span>{{ formData.retirementAmount || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">月收入: </span> |
|||
<span>{{ formData.monthIncome || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">联系人: </span> |
|||
<span>{{ formData.contactName || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">联系电话: </span> |
|||
<span>{{ formData.contactMobile || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">备注: </span> |
|||
<span>{{ formData.remark || "--" }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="div-btn"></div> |
|||
<el-row type="flex" justify="right"> |
|||
<el-col :span="24" align="right"> |
|||
<el-button size="small" @click="handleCancle" style="margin-right: 16px" |
|||
>关 闭</el-button |
|||
> |
|||
</el-col> |
|||
</el-row> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from "vuex"; |
|||
import { Loading } from "element-ui"; // 引入Loading服务 |
|||
import { requestPost, requestGet } from "@/js/dai/request"; |
|||
|
|||
let loading; // 加载动画 |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
initLoading: false, |
|||
formData: {}, |
|||
showPersonList: false, |
|||
}; |
|||
}, |
|||
components: {}, |
|||
async mounted() { |
|||
await this.loadInfo(); |
|||
this.initLoading = true; |
|||
}, |
|||
|
|||
methods: { |
|||
//加载详情信息 |
|||
async loadInfo() { |
|||
const url = `/governance/commonDemand/detail/${this.gxxqId}`; |
|||
const { data, code, msg } = await requestGet(url); |
|||
|
|||
if (code === 0) { |
|||
console.log(data); |
|||
this.formData = { ...data }; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
handleCancle() { |
|||
this.resetData(); |
|||
this.$emit("handleClose"); |
|||
}, |
|||
resetData() { |
|||
this.formData = {}; |
|||
}, |
|||
|
|||
// 开启加载动画 |
|||
startLoading() { |
|||
loading = Loading.service({ |
|||
lock: true, // 是否锁定 |
|||
text: "正在加载……", // 加载中需要显示的文字 |
|||
background: "rgba(0,0,0,.7)", // 背景颜色 |
|||
}); |
|||
}, |
|||
// 结束加载动画 |
|||
endLoading() { |
|||
// clearTimeout(timer); |
|||
if (loading) { |
|||
loading.close(); |
|||
} |
|||
}, |
|||
}, |
|||
computed: { |
|||
dataRule() { |
|||
return { |
|||
serviceTimeStart: [ |
|||
{ required: true, message: "服务时间不能为空", trigger: "blur" }, |
|||
], |
|||
}; |
|||
}, |
|||
serverOrgType() { |
|||
let text = ""; |
|||
this.serviceOptions.forEach((item) => { |
|||
if (item.value == this.formData.assignInfo.serverOrgType) { |
|||
text = item.label; |
|||
} |
|||
}); |
|||
return text ? text : "--"; |
|||
}, |
|||
}, |
|||
props: {}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/modules/management/detail-main.scss"; |
|||
.info-prop { |
|||
margin-top: 29px; |
|||
} |
|||
.scroll-h { |
|||
padding: 0 90px !important; |
|||
} |
|||
</style> |
|||
|
|||
@ -0,0 +1,524 @@ |
|||
<!-- 新增组件v3 --> |
|||
<template> |
|||
<div> |
|||
<div |
|||
class="dialog-h-content scroll-h" |
|||
:class="{ 'visiual-form': source === 'visiual' }" |
|||
> |
|||
<el-form |
|||
ref="ref_add_form" |
|||
:inline="true" |
|||
:model="formData" |
|||
:rules="dataRule" |
|||
class="div_form" |
|||
> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">姓名: </span> |
|||
<span>{{ formData.name || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="姓名" prop="name" v-else> |
|||
<el-input |
|||
v-model="formData.name" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">联系电话: </span> |
|||
<span>{{ formData.mobile || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="联系电话" v-else> |
|||
<el-input |
|||
v-model="formData.mobile" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">证件类型: </span> |
|||
<span>{{ formData.idTypeName || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="证件类型" prop="idType" v-else> |
|||
<el-select v-model="formData.idType" clearable> |
|||
<el-option |
|||
v-for="item in dicts.idCard_type" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">证件号: </span> |
|||
<span>{{ formData.idNum || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="证件号" prop="idNum" v-else> |
|||
<el-input |
|||
v-model="formData.idNum" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">性别: </span> |
|||
<span>{{ formData.gender?formData.gender=='1'?'男':formData.gender=='2'?'女':'--':'--' }}</span |
|||
> |
|||
</div> |
|||
<el-form-item label-width="100px" label="性别" v-else> |
|||
|
|||
<el-select v-model="formData.gender" clearable> |
|||
<el-option |
|||
v-for="item in genderList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">本地户籍: </span> |
|||
<span>{{ formData.localResidenceFlag?formData.localResidenceFlag=='1'?'是':formData.localResidenceFlag=='0'?'否':'--':'--' }}</span |
|||
> |
|||
</div> |
|||
<el-form-item label-width="100px" label="本地户籍" v-else> |
|||
<el-select v-model="formData.localResidenceFlag" clearable> |
|||
<el-option |
|||
v-for="item in binaryOptionList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">户籍地址: </span> |
|||
<span>{{ formData.placeOfDomicile || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="户籍地址" class="wd-wr" v-else> |
|||
<el-input |
|||
v-model="formData.placeOfDomicile" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">现居地址: </span> |
|||
<span>{{ formData.currentResidence || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="现居地址" class="wd-wr" v-else> |
|||
<el-input |
|||
v-model="formData.currentResidence" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">残疾类别: </span> |
|||
<span>{{ formData.disabilityCategoryName || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="残疾类别" v-else> |
|||
<el-select v-model="formData.disabilityCategoryCode" clearable> |
|||
<el-option |
|||
v-for="item in dicts.disability_category_code" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">残疾级别: </span> |
|||
<span>{{ formData.disabilityLevelName || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="残疾级别" v-else> |
|||
<el-select v-model="formData.disabilityLevel" clearable> |
|||
<el-option |
|||
v-for="item in dicts.disability_level" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">残疾证号: </span> |
|||
<span>{{ formData.disabilityNum || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="残疾证号" v-else> |
|||
<el-input |
|||
v-model="formData.disabilityNum" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">低保: </span> |
|||
<span>{{ formData.subsistenceAllowanceFlag?formData.subsistenceAllowanceFlag=='1'?'是':formData.subsistenceAllowanceFlag=='0'?'否':'--':'--' }}</span |
|||
> |
|||
</div> |
|||
<el-form-item label-width="100px" label="低保" v-else> |
|||
<el-select v-model="formData.subsistenceAllowanceFlag" clearable> |
|||
<el-option |
|||
v-for="item in binaryOptionList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">退休金额: </span> |
|||
<span>{{ formData.retirementAmount || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="退休金额" v-else> |
|||
<el-input |
|||
v-model="formData.retirementAmount" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">月收入: </span> |
|||
<span>{{ formData.monthIncome || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="月收入" v-else> |
|||
<el-input |
|||
v-model="formData.monthIncome" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">联系人: </span> |
|||
<span>{{ formData.contactName || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="联系人" v-else> |
|||
<el-input |
|||
v-model="formData.contactName" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">联系电话: </span> |
|||
<span>{{ formData.contactMobile || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="联系电话" v-else> |
|||
<el-input |
|||
v-model="formData.contactMobile" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">备注: </span> |
|||
<span>{{ formData.remark || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="备注" class="wd-wr" v-else> |
|||
<el-input |
|||
v-model="formData.remark" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<div class="div_btn"> |
|||
<el-button size="small" @click="handleCancle">取 消</el-button> |
|||
<el-button |
|||
size="small" |
|||
type="primary" |
|||
:disabled="btnDisable" |
|||
@click="handleComfirm" |
|||
>确 定</el-button |
|||
> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { Loading } from "element-ui"; // 引入Loading服务 |
|||
import { requestPost, requestGet } from "@/js/dai/request"; |
|||
import nextTick from "dai-js/tools/nextTick"; |
|||
import { genderList, binaryOptionList } from "@/js/columns/constants"; |
|||
|
|||
let loading; // 加载动画 |
|||
|
|||
export default { |
|||
props: { |
|||
formType:{ |
|||
type:String, |
|||
default:'add' |
|||
}, |
|||
source: { |
|||
//展示来源：manage 管理平台 visiual 可视化平台 |
|||
type: String, |
|||
default: "manage", |
|||
}, |
|||
}, |
|||
|
|||
data() { |
|||
return { |
|||
formType: "", |
|||
btnDisable: false, |
|||
|
|||
formData: { |
|||
name: "", |
|||
mobile: "", |
|||
idType: "", |
|||
idNum: "", |
|||
gender: "", |
|||
localResidenceFlag: null, |
|||
placeOfDomicile: "", |
|||
currentResidence: "", |
|||
disabilityCategoryCode: "", |
|||
disabilityLevel: "", |
|||
disabilityNum: "", |
|||
subsistenceAllowanceFlag: null, |
|||
retirementAmount: null, |
|||
monthIncome: null, |
|||
contactName: "", |
|||
contactMobile: "", |
|||
remark: "", |
|||
}, |
|||
genderList, |
|||
binaryOptionList, |
|||
dataRule: { |
|||
name: [{ required: true, message: "姓名不能为空", trigger: "bulr" }], |
|||
idNum: [{ required: true, message: "证件号不能为空", trigger: "bulr" }], |
|||
|
|||
idType: [ |
|||
{ required: true, message: "证件类型不能为空", trigger: "bulr" }, |
|||
], |
|||
}, |
|||
scopeId: "", |
|||
|
|||
dicts: { |
|||
disability_category_code: [], |
|||
disability_level: [], |
|||
idCard_type: [], |
|||
}, |
|||
}; |
|||
}, |
|||
|
|||
watch: {}, |
|||
|
|||
components: {}, |
|||
async created() { |
|||
await this.getDicts(); |
|||
}, |
|||
async mounted() { |
|||
this.startLoading(); |
|||
await this.endLoading(); |
|||
}, |
|||
|
|||
methods: { |
|||
async initForm(type, row) { |
|||
this.formType = type; |
|||
this.scopeId = row.categorizedResiId; |
|||
await this.getDetail(); |
|||
}, |
|||
async getDetail(categorizedResiId) { |
|||
const url = `/governance/commonDemand/detail/${categorizedResiId}`; |
|||
const { data, code, msg } = await requestGet(url); |
|||
if (code === 0) { |
|||
console.log(data); |
|||
// let obj = { |
|||
// name: "测试", |
|||
// mobile: "17555555555", |
|||
// idType: "1", |
|||
// idNum: "370254111111111111", |
|||
// gender: "1", |
|||
// localResidenceFlag: 1, |
|||
// placeOfDomicile: "青岛市市北区时代国际广场", |
|||
// currentResidence: "青岛市李沧区建安小区", |
|||
// disabilityCategoryCode: "tingli", |
|||
// disabilityLevel: "1", |
|||
// disabilityNum: "545461564512167", |
|||
// subsistenceAllowanceFlag: 1, |
|||
// retirementAmount: 1, |
|||
// monthIncome: 200.111, |
|||
// contactName: "刘备", |
|||
// contactMobile: "15655555454", |
|||
// remark: "备注", |
|||
// }; |
|||
this.formData = { ...obj }; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
async handleComfirm() { |
|||
this.$refs["ref_add_form"].validate(async (valid) => { |
|||
if (!valid) { |
|||
return false; |
|||
} |
|||
const url = |
|||
this.formType === "edit" |
|||
? "/governance/commonDemand/update" |
|||
: "/governance/commonDemand/save"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, this.formData); |
|||
if (code === 0) { |
|||
this.$message.success("添加成功"); |
|||
this.resetData(); |
|||
this.$emit("handleComfirm"); |
|||
} else if (code >= 8000) { |
|||
this.$message.error(msg); |
|||
} |
|||
}); |
|||
}, |
|||
async getDicts() { |
|||
try { |
|||
const dictTypes = [ |
|||
"disability_category_code", |
|||
"disability_level", |
|||
"idCard_type", |
|||
]; // 把所有dictType放在这个数组里 |
|||
const requests = dictTypes.map((dictType) => { |
|||
return this.$http.post("sys/dict/data/dictlist", { |
|||
dictType: dictType, |
|||
}); |
|||
}); |
|||
const results = await Promise.all(requests); |
|||
results.forEach((result, index) => { |
|||
if (result.data.code === 0) { |
|||
this.dicts[dictTypes[index]].push(...result.data.data); |
|||
} else { |
|||
console.log(`获取${dictTypes[index]}字典失败: ${result.msg}`); |
|||
} |
|||
}); |
|||
} catch (error) { |
|||
console.log("获取字典失败: ", error); |
|||
} |
|||
}, |
|||
handleCancle() { |
|||
this.resetData(); |
|||
this.$emit("handleClose"); |
|||
}, |
|||
|
|||
resetData() { |
|||
this.formData = {}; |
|||
}, |
|||
// 开启加载动画 |
|||
startLoading() { |
|||
loading = Loading.service({ |
|||
lock: true, // 是否锁定 |
|||
text: "正在加载……", // 加载中需要显示的文字 |
|||
background: "rgba(0,0,0,.7)", // 背景颜色 |
|||
}); |
|||
}, |
|||
// 结束加载动画 |
|||
endLoading() { |
|||
if (loading) { |
|||
loading.close(); |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/modules/management/form-main.scss"; |
|||
@import "@/assets/scss/modules/visual/a_customize.scss"; |
|||
@import "@/assets/scss/modules/management/detail-main.scss"; |
|||
|
|||
.form-item::v-deep .el-form-item__label { |
|||
color: #fff; |
|||
} |
|||
.form-item { |
|||
.el-radio { |
|||
color: #fff; |
|||
} |
|||
.el-checkbox { |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
.wd-wr { |
|||
width: 100%; |
|||
/deep/ .el-form-item__content { |
|||
width: calc(100% - 148px); |
|||
} |
|||
} |
|||
.info-prop { |
|||
margin-top: 29px; |
|||
.info-title-2 { |
|||
width: 100px; |
|||
text-align: right; |
|||
display: inline-block; |
|||
padding-right: 10px; |
|||
} |
|||
} |
|||
</style> |
|||
|
|||
|
|||
|
|||
@ -0,0 +1,732 @@ |
|||
<!-- 列表页模板V4 --> |
|||
<template> |
|||
<div class="g-main"> |
|||
<div> |
|||
<div class="m-search"> |
|||
<el-form |
|||
:inline="true" |
|||
:model="formData" |
|||
ref="ref_searchform" |
|||
:label-width="'100px'" |
|||
> |
|||
<el-form-item label="姓名"> |
|||
<el-input |
|||
v-model="formData.name" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="联系电话"> |
|||
<el-input |
|||
v-model="formData.mobile" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="证件号"> |
|||
<el-input |
|||
v-model="formData.idNum" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="性别"> |
|||
<el-select |
|||
v-model="formData.gender" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in genderList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="本地户籍"> |
|||
<el-select |
|||
v-model="formData.localResidenceFlag" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in binaryOptionList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="居住地址"> |
|||
<el-input |
|||
v-model="formData.currentResidence" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="低保"> |
|||
<el-select |
|||
v-model="formData.subsistenceAllowanceFlag" |
|||
placeholder="请选择" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in binaryOptionList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="备注"> |
|||
<el-input |
|||
v-model="formData.remark" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-row type="flex"> |
|||
<el-col :span="24" align="right"> |
|||
<el-button |
|||
style="margin-left: 30px" |
|||
size="small" |
|||
type="primary " |
|||
@click="handleSearch" |
|||
>查询</el-button |
|||
> |
|||
<el-button |
|||
style="margin-left: 10px" |
|||
is-plain |
|||
class="diy-button--white el-button--default" |
|||
size="small" |
|||
@click="resetSearch" |
|||
>重置</el-button |
|||
> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="m-table"> |
|||
<div class="div_btn"> |
|||
<div class="div_btn_left"> |
|||
<el-button |
|||
size="small" |
|||
@click="handleAdd" |
|||
type="primary" |
|||
icon="el-icon-plus" |
|||
>新增</el-button |
|||
> |
|||
</div> |
|||
<el-button |
|||
@click="handleExport" |
|||
type="primary" |
|||
size="small" |
|||
class="diy-button--white el-button--default" |
|||
>导出</el-button |
|||
> |
|||
<el-button |
|||
@click="onDeleteBatch" |
|||
style="margin: 0 10px" |
|||
size="small" |
|||
type="primary" |
|||
> |
|||
批量删除 |
|||
</el-button> |
|||
<!-- |
|||
:on-success="handleExcelSuccess" |
|||
:before-upload="beforeExcelUpload" |
|||
:http-request="uploadHttpRequest" |
|||
--> |
|||
<el-upload |
|||
:headers="$getElUploadHeaders()" |
|||
ref="upload" |
|||
class="upload-demo" |
|||
action="uploadUlr" |
|||
:limit="1" |
|||
:accept="'.xls,.xlsx'" |
|||
:with-credentials="true" |
|||
:show-file-list="false" |
|||
:auto-upload="true" |
|||
> |
|||
<el-button |
|||
type="primary" |
|||
size="small" |
|||
class="diy-button--white el-button--default" |
|||
:loading="importLoading" |
|||
>导入</el-button |
|||
> |
|||
</el-upload> |
|||
<el-button |
|||
style="margin-left: 10px" |
|||
class="diy-button--blue" |
|||
size="small" |
|||
@click="handleExportModule('room')" |
|||
>下载模板</el-button |
|||
> |
|||
</div> |
|||
|
|||
<el-table |
|||
:data="tableData" |
|||
border |
|||
v-loading="tableLoading" |
|||
class="m-table-item" |
|||
style="width: 100%" |
|||
:height="maxTableHeight" |
|||
@selection-change="onMultiSelection" |
|||
> |
|||
<el-table-column |
|||
type="selection" |
|||
fixed="left" |
|||
align="center" |
|||
width="50" |
|||
/> |
|||
<el-table-column |
|||
label="序号" |
|||
fixed="left" |
|||
type="index" |
|||
align="center" |
|||
width="50" |
|||
/> |
|||
|
|||
<el-table-column |
|||
prop="name" |
|||
align="center" |
|||
width="100" |
|||
label="姓名" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
|
|||
<el-table-column |
|||
prop="mobile" |
|||
align="center" |
|||
width="200" |
|||
label="联系电话" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="idNum" |
|||
align="center" |
|||
width="200" |
|||
label="证件号" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="genderName" |
|||
align="center" |
|||
width="80" |
|||
label="性别" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
<template slot-scope="scope"> |
|||
<span>{{ scope.row.gender?scope.row.gender == "1" ? "男":scope.row.gender == "2"?"女" :'--':"--" }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="localResidenceFlagName" |
|||
align="center" |
|||
width="100" |
|||
label="本地户籍" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="currentResidence" |
|||
align="center" |
|||
width="100" |
|||
label="居住地址" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="disabilityCategoryName" |
|||
align="center" |
|||
width="100" |
|||
label="残疾类别" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="disabilityCategoryName" |
|||
align="center" |
|||
width="100" |
|||
label="残疾级别" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
fixed="right" |
|||
label="操作" |
|||
align="center" |
|||
width="220" |
|||
> |
|||
<template slot-scope="scope"> |
|||
<el-button |
|||
@click="handleDetail(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
>查看</el-button |
|||
> |
|||
<el-button |
|||
v-if="scope.row.serviceStatus === 'in_service'" |
|||
@click="handleEdit(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
>编辑</el-button |
|||
> |
|||
|
|||
<el-button @click="handleDel(scope.row)" type="text" size="small" |
|||
>删除</el-button |
|||
> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<div> |
|||
<el-pagination |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
:current-page.sync="pageNo" |
|||
:page-sizes="[20, 50, 100, 200]" |
|||
:page-size="parseInt(pageSize)" |
|||
layout="sizes, prev, pager, next, total" |
|||
:total="total" |
|||
> |
|||
</el-pagination> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<el-dialog |
|||
v-if="showAdd" |
|||
:visible.sync="showAdd" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="addDiaTitle" |
|||
:modal-append-to-body="false" |
|||
width="720px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="showAdd = false" |
|||
> |
|||
<add-form |
|||
ref="ref_add_form" |
|||
:formType="formType" |
|||
@handleOk="handleOk" |
|||
@handleClose="handleClose" |
|||
></add-form> |
|||
</el-dialog> |
|||
<el-dialog |
|||
v-if="showDetail" |
|||
:visible.sync="showDetail" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="detailDiaTitle" |
|||
:modal-append-to-body="false" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="diaDetailClose" |
|||
> |
|||
<detail-form |
|||
ref="ref_detail_form" |
|||
:statusArray="statusArray" |
|||
@diaDetailClose="diaDetailClose" |
|||
> |
|||
</detail-form> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost } from "@/js/dai/request"; |
|||
import { genderList, binaryOptionList } from "@/js/columns/constants"; |
|||
import nextTick from "dai-js/tools/nextTick"; |
|||
import { mapGetters } from "vuex"; |
|||
import axios from "axios"; |
|||
import addForm from "./addForm"; |
|||
// import detailForm from "./detailForm"; |
|||
// import editForm from "./editForm"; |
|||
|
|||
export default { |
|||
components: { addForm, }, |
|||
|
|||
data() { |
|||
let endDisabledDate = (time) => { |
|||
//这个关键属性我们一定要写在data的里面并且return的外面，这是动态改变区间的关键 |
|||
let nowData = Date.now(); |
|||
if (this.formData.serviceTimeStart) { |
|||
let serviceTimeStart = new Date(this.formData.serviceTimeStart); |
|||
return ( |
|||
time.getTime() < serviceTimeStart - 24 * 60 * 60 * 1000 || |
|||
time.getTime() === serviceTimeStart - 24 * 60 * 60 * 1000 |
|||
); |
|||
} else { |
|||
return time.getTime() > nowData || time.getTime() === nowData; |
|||
} |
|||
}; |
|||
// let startDisabledDate = (time) => { |
|||
// //这个关键属性我们一定要写在data的里面并且return的外面，这是动态改变区间的关键 |
|||
// let nowData = Date.now() - 24 * 60 * 60 * 1000; |
|||
// return time.getTime() < nowData; |
|||
// }; |
|||
|
|||
return { |
|||
tableLoading: false, |
|||
user: {}, |
|||
agencyId: "", |
|||
searchH: 170, |
|||
tableData: [], |
|||
genderList, |
|||
binaryOptionList, |
|||
formData: { |
|||
name: "刘备", |
|||
mobile: "174744645454", |
|||
gender: "1", |
|||
idNum: "37024545454544545", |
|||
localResidenceFlag: "1", |
|||
currentResidence: "青岛市市北区时代国际广场", |
|||
disabilityCategoryCode: "", |
|||
disabilityLevel: "", |
|||
disabilityNum: "12345678", |
|||
subsistenceAllowanceFlag: "1", |
|||
monthIncome: 2000, |
|||
contactName: "关羽", |
|||
contactMobile: "12345678", |
|||
remark: "ipsum nostrud adipisicing", |
|||
}, |
|||
pageNo: 1, |
|||
pageSize: window.localStorage.getItem("pageSize") || 20, |
|||
total: 1, |
|||
endPickerOptions: { |
|||
disabledDate: endDisabledDate, |
|||
}, |
|||
startPickerOptions: { |
|||
// disabledDate: startDisabledDate |
|||
}, |
|||
|
|||
showAdd: false, |
|||
showEdit: false, |
|||
showDetail: false, |
|||
formType: "add", |
|||
addDiaTitle: "新增", |
|||
detailDiaTitle: "详情", |
|||
|
|||
multiSelection: [], // 多选结果 |
|||
importLoading: false, |
|||
|
|||
dicts: { |
|||
educationList: [], |
|||
nationList: [], |
|||
}, //字典对象 |
|||
}; |
|||
}, |
|||
computed: { |
|||
maxTableHeight() { |
|||
const h = this.clientHeight - this.searchH - 330 + this.iframeHeight; |
|||
const _h = this.clientHeight - 330 - this.searchH; |
|||
return this.$store.state.inIframe ? h : _h; |
|||
}, |
|||
...mapGetters(["clientHeight", "iframeHeight"]), |
|||
}, |
|||
watch: {}, |
|||
async created() { |
|||
await this.getDicts(); |
|||
}, |
|||
mounted() { |
|||
console.log(this.$store.state); |
|||
this.user = this.$store.state.user; |
|||
this.agencyId = this.user.agencyId; |
|||
this.getTableData(); |
|||
}, |
|||
methods: { |
|||
// --------------------------------------字典------------------------------------------ |
|||
async getDicts() { |
|||
try { |
|||
const requests = [ |
|||
this.$http.post("sys/dict/data/nation", { |
|||
formCode: "resi_base_info", |
|||
}), |
|||
this.$http.post("sys/dict/data/education", { |
|||
formCode: "resi_base_info", |
|||
}), |
|||
]; |
|||
const dictKeys = ["nationList", "educationList"]; // 对应的键名 |
|||
|
|||
const results = await Promise.all(requests); |
|||
results.forEach((result, index) => { |
|||
if (result.data.code === 0) { |
|||
this.dicts[dictKeys[index]].push(...result.data.data); |
|||
} else { |
|||
console.log(`获取${dictKeys[index]}失败: ${result.data.msg}`); |
|||
} |
|||
}); |
|||
} catch (error) { |
|||
console.log("获取字典失败: ", error); |
|||
} |
|||
}, |
|||
|
|||
binaryText(value){ |
|||
let text = '' |
|||
text = this.binaryOptionList.filter(item=>item.value == value)[0].label |
|||
return text || "--" |
|||
}, |
|||
// ------------------------------------事件------------------------------------------ |
|||
checkNumberInput(){ |
|||
if (isNaN(this.formData.retirementAmount)) { |
|||
this.$message.error('请输入数字'); |
|||
this.formData.retirementAmount = ''; |
|||
} else { |
|||
this.formData.retirementAmount = parseFloat(this.formData.retirementAmount); |
|||
} |
|||
}, |
|||
|
|||
// 搜索事件 |
|||
handleSearch(val) { |
|||
console.log(this.formData); |
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
// 调出新增组件 |
|||
async handleAdd() { |
|||
this.addDiaTitle = "新增"; |
|||
this.formType = "add"; |
|||
this.showAdd = true; |
|||
}, |
|||
// 查看详情触发事件 |
|||
async handleDetail(row) { |
|||
this.addDiaTitle = "详情"; |
|||
this.showDetail = true; |
|||
this.formType = "add"; |
|||
this.showAdd = true; |
|||
this.$nextTick(() => { |
|||
this.$refs.ref_add_form.initForm("detail", row); |
|||
}); |
|||
}, |
|||
// 详情弹出框取消事件 |
|||
diaDetailClose() { |
|||
this.$refs.ref_detail_form.diaDestroy(); |
|||
this.showDetail = false; |
|||
}, |
|||
// 编辑触发事件 |
|||
async handleEdit(row) {}, |
|||
// 新增弹出框组件取消事件 |
|||
handleClose() { |
|||
this.formType = ""; |
|||
this.showAdd = false; |
|||
this.showDetail = false; |
|||
this.showEdit = false; |
|||
}, |
|||
// 新增弹出框组件确定事件 |
|||
handleOk() { |
|||
this.handleClose(); |
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
// 删除触发事件 |
|||
async handleDel(row) { |
|||
this.$confirm("确认删除?", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning", |
|||
}) |
|||
.then(() => { |
|||
this.cancelFuwu([row.id]); |
|||
}) |
|||
.catch((err) => { |
|||
if (err == "cancel") { |
|||
// this.$message({ |
|||
// type: "info", |
|||
// message: "已取消删除" |
|||
// }); |
|||
} |
|||
}); |
|||
}, |
|||
// 删除处理 |
|||
async cancelFuwu(id) { |
|||
const url = "/governance/icServiceRecordV2/delete"; |
|||
const { data, code, msg } = await requestPost(url, id); |
|||
if (code === 0) { |
|||
this.$message.success("取消成功！"); |
|||
this.getTableData(); |
|||
} else { |
|||
this.$message.error("操作失败！"); |
|||
} |
|||
}, |
|||
// 获取列表 |
|||
async getTableData() { |
|||
this.tableLoading = true; |
|||
const url = "/actual/base/resiDisability/page"; |
|||
|
|||
const { pageSize, pageNo, formData } = this; |
|||
const { data, code, msg } = await requestPost(url, { |
|||
pageSize, |
|||
pageNo, |
|||
...formData, |
|||
}); |
|||
this.tableLoading = false; |
|||
if (code === 0) { |
|||
this.total = data.total || 0; |
|||
this.tableData = data.list; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
// 导出 |
|||
async handleExport() { |
|||
const url = "/governance/icServiceRecordV2/export"; |
|||
const { pageSize, pageNo, formData } = this; |
|||
axios({ |
|||
url: window.SITE_CONFIG["apiURL"] + url, |
|||
method: "post", |
|||
data: { |
|||
pageSize, |
|||
pageNo, |
|||
...formData, |
|||
}, |
|||
responseType: "blob", |
|||
}) |
|||
.then((res) => { |
|||
let fileName = window.decodeURI( |
|||
res.headers["content-disposition"].split(";")[1].split("=")[1] |
|||
); |
|||
console.log("filename", fileName); |
|||
let blob = new Blob([res.data], { |
|||
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", |
|||
}); |
|||
var url = window.URL.createObjectURL(blob); |
|||
var aLink = document.createElement("a"); |
|||
aLink.style.display = "none"; |
|||
aLink.href = url; |
|||
aLink.setAttribute("download", fileName); |
|||
document.body.appendChild(aLink); |
|||
aLink.click(); |
|||
document.body.removeChild(aLink); //下载完成移除元素 |
|||
window.URL.revokeObjectURL(url); //释放掉blob对象 |
|||
}) |
|||
.catch((err) => { |
|||
console.log("获取导出情失败", err); |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
// 下载模板 |
|||
async handleExportModule() { |
|||
let url = ""; |
|||
let params = {}; |
|||
await this.$http({ |
|||
method: "POST", |
|||
url, |
|||
responseType: "blob", |
|||
data: params, |
|||
}) |
|||
.then((res) => { |
|||
console.log("res----dddd", res); |
|||
// this.download(res.data, title + '.xls') |
|||
if (res.headers["content-disposition"]) { |
|||
let fileName = window.decodeURI( |
|||
res.headers["content-disposition"].split(";")[1].split("=")[1] |
|||
); |
|||
console.log("filename", fileName); |
|||
let blob = new Blob([res.data], { |
|||
type: "application/vnd.ms-excel", |
|||
}); |
|||
var url = window.URL.createObjectURL(blob); |
|||
var aLink = document.createElement("a"); |
|||
aLink.style.display = "none"; |
|||
aLink.href = url; |
|||
aLink.setAttribute("download", fileName); |
|||
document.body.appendChild(aLink); |
|||
aLink.click(); |
|||
document.body.removeChild(aLink); //下载完成移除元素 |
|||
window.URL.revokeObjectURL(url); //释放掉blob对象 |
|||
} else this.$message.error("下载失败"); |
|||
}) |
|||
.catch((err) => { |
|||
console.log("err", err); |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
// 分页 |
|||
handleSizeChange(val) { |
|||
this.pageSize = val; |
|||
window.localStorage.setItem("pageSize", val); |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
// 分页 |
|||
handleCurrentChange(val) { |
|||
this.pageNo = val; |
|||
this.getTableData(); |
|||
}, |
|||
// 重置 |
|||
resetSearch() { |
|||
this.formData = {}; |
|||
|
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
// 多选事件 |
|||
onMultiSelection(rows) { |
|||
this.multiSelection = rows; |
|||
}, |
|||
|
|||
// 批量删除 |
|||
onDeleteBatch() { |
|||
if (this.multiSelection.length == 0) { |
|||
this.$message.warning("请先选中至少一项"); |
|||
return; |
|||
} |
|||
|
|||
this.$confirm("删除之后无法恢复，确认删除？", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning", |
|||
}) |
|||
.then(() => { |
|||
this.cancelFuwu(this.multiSelection.map((e) => e.categorizedResiId)); |
|||
}) |
|||
.catch((err) => { |
|||
console.error(err); |
|||
this.$message.error("删除失败"); |
|||
}); |
|||
}, |
|||
}, |
|||
|
|||
props: {}, |
|||
}; |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/buttonstyle.scss"; |
|||
@import "@/assets/scss/modules/management/list-main.scss"; |
|||
@import "@/assets/scss/modules/shequzhili/event-info.scss"; |
|||
.div_btn_left > * { |
|||
margin-right: 10px; |
|||
} |
|||
</style> |
|||
|
|||
|
|||
@ -0,0 +1,782 @@ |
|||
<template> |
|||
<div> |
|||
<div |
|||
class="dialog-h-content scroll-h" |
|||
:class="{ 'visiual-form': source === 'visiual' }" |
|||
> |
|||
<el-form |
|||
ref="ref_add_form" |
|||
:inline="true" |
|||
:model="formData" |
|||
:rules="dataRule" |
|||
class="div_form" |
|||
> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">姓名: </span> |
|||
<span>{{ formData.name || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="姓名" prop="name" v-else> |
|||
<el-input |
|||
v-model="formData.name" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">联系电话: </span> |
|||
<span>{{ formData.mobile || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="联系电话" v-else> |
|||
<el-input |
|||
v-model="formData.mobile" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">证件类型: </span> |
|||
<span>{{ formData.idTypeName || "--" }}</span> |
|||
</div> |
|||
<el-form-item |
|||
label-width="100px" |
|||
label="证件类型" |
|||
prop="idType" |
|||
clearable |
|||
v-else |
|||
> |
|||
<el-select v-model="formData.idType" clearable> |
|||
<el-option |
|||
v-for="item in dicts.idCard_type" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">证件号: </span> |
|||
<span>{{ formData.idNum || "--" }}</span> |
|||
</div> |
|||
<el-form-item |
|||
label-width="100px" |
|||
label="证件号" |
|||
prop="idNum" |
|||
v-else |
|||
> |
|||
<el-input |
|||
v-model="formData.idNum" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">出生日期: </span> |
|||
<span>{{ formData.birthday || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="出生日期" v-else> |
|||
<el-date-picker |
|||
v-model="formData.birthday" |
|||
type="date" |
|||
placeholder="选择日期" |
|||
style="width: 202px" |
|||
clearable |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">性别: </span> |
|||
<span>{{ |
|||
formData.gender |
|||
? formData.gender == "1" |
|||
? "男" |
|||
: formData.gender == "2" |
|||
? "女" |
|||
: "--" |
|||
: "--" |
|||
}}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="性别" v-else> |
|||
<el-select v-model="formData.gender" clearable> |
|||
<el-option |
|||
v-for="item in genderList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">民族: </span> |
|||
<span>{{ formData.nationName || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="民族" class="wd-wr" v-else> |
|||
<template> |
|||
<el-select v-model="formData.nation" placeholder="请选择" clearable> |
|||
<el-option |
|||
v-for="item in dicts.nationList" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
:key="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</template> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">政治面貌: </span> |
|||
<span>{{ formData.politicsStatusName || "--" }}</span> |
|||
</div> |
|||
<el-form-item |
|||
label-width="100px" |
|||
label="政治面貌" |
|||
class="wd-wr" |
|||
v-else |
|||
> |
|||
<template> |
|||
<el-select |
|||
v-model="formData.politicsStatus" |
|||
placeholder="请选择" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in politicsStatusList" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
:key="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</template> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">文化程度: </span> |
|||
<span>{{ formData.cultureLevelName || "--" }}</span> |
|||
</div> |
|||
<el-form-item |
|||
label-width="100px" |
|||
label="文化程度" |
|||
class="wd-wr" |
|||
v-else |
|||
> |
|||
<template> |
|||
<el-select v-model="formData.cultureLevel" placeholder="请选择" clearable> |
|||
<el-option |
|||
v-for="item in dicts.educationList" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
:key="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</template> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">婚姻状况: </span> |
|||
<span>{{ formData.marriageName || "--" }}</span> |
|||
</div> |
|||
<el-form-item |
|||
label-width="100px" |
|||
label="婚姻状况" |
|||
class="wd-wr" |
|||
v-else |
|||
> |
|||
<template> |
|||
<el-select v-model="formData.marriage" placeholder="请选择" clearable> |
|||
<el-option |
|||
v-for="item in dicts.marriageList" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
:key="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</template> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">本地户籍: </span> |
|||
<span>{{ binaryText(formData.localResidenceFlag) }}</span> |
|||
</div> |
|||
<el-form-item |
|||
label-width="100px" |
|||
label="本地户籍" |
|||
class="wd-wr" |
|||
v-else |
|||
> |
|||
<template> |
|||
<el-select |
|||
v-model="formData.localResidenceFlag" |
|||
placeholder="请选择" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in binaryOptionList" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
:key="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</template> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">户籍地址: </span> |
|||
<span>{{ formData.placeOfDomicile || "--" }}</span> |
|||
</div> |
|||
<el-form-item |
|||
label-width="100px" |
|||
label="户籍地址" |
|||
class="wd-wr" |
|||
v-else |
|||
> |
|||
<el-input |
|||
v-model="formData.placeOfDomicile" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">现居地址: </span> |
|||
<span>{{ formData.currentResidence || "--" }}</span> |
|||
</div> |
|||
<el-form-item |
|||
label-width="100px" |
|||
label="现居地址" |
|||
class="wd-wr" |
|||
v-else |
|||
> |
|||
<el-input |
|||
v-model="formData.currentResidence" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">入伍日期: </span> |
|||
<span>{{ formData.joinArmyTime || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="入伍日期" v-else> |
|||
<el-date-picker |
|||
v-model="formData.joinArmyTime" |
|||
type="date" |
|||
placeholder="选择日期" |
|||
style="width: 202px" |
|||
clearable |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">退伍日期: </span> |
|||
<span>{{ formData.leaveArmyTime || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="退伍日期" v-else> |
|||
<el-date-picker |
|||
v-model="formData.leaveArmyTime" |
|||
type="date" |
|||
placeholder="选择日期" |
|||
style="width: 202px" |
|||
clearable |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">服役单位: </span> |
|||
<span>{{ formData.serviceUnit || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="服役单位" v-else> |
|||
<el-input |
|||
v-model="formData.serviceUnit" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">接收单位: </span> |
|||
<span>{{ formData.receiveUnit || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="接收单位" v-else> |
|||
<el-input |
|||
v-model="formData.receiveUnit" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">参战日期: </span> |
|||
<span |
|||
>{{ formData.joinWarStartTime || "--" }} 至 |
|||
{{ formData.joinWarEndTime || "--" }}</span |
|||
> |
|||
</div> |
|||
<el-form-item label-width="100px" label="参战日期" v-else> |
|||
<el-date-picker |
|||
v-model="formData.joinWarStartTime" |
|||
type="date" |
|||
class="u-item-width-daterange" |
|||
value-format="yyyy-MM-dd" |
|||
placeholder="开始日期" |
|||
:picker-options="startPickerOptions" |
|||
style="width: 259px" |
|||
clearable |
|||
> |
|||
</el-date-picker> |
|||
<span class="u-data-tag">至</span> |
|||
<el-date-picker |
|||
v-model="formData.joinWarEndTime" |
|||
type="date" |
|||
value-format="yyyy-MM-dd" |
|||
class="u-item-width-daterange u-data-tag" |
|||
placeholder="结束日期" |
|||
:picker-options="endPickerOptionsJoinWar" |
|||
style="width: 259px" |
|||
clearable |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">现就业情况: </span> |
|||
<span>{{ formData.employmentSituation || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="现就业情况" v-else> |
|||
<el-input |
|||
v-model="formData.employmentSituation" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">待安置补助金: </span> |
|||
<span>{{ formData.settlementAmount || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="105px" label="待安置补助金" v-else> |
|||
<el-input |
|||
v-model="formData.settlementAmount" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">培训状况: </span> |
|||
<span>{{ formData.trainDesc || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="培训状况" v-else> |
|||
<el-input |
|||
v-model="formData.trainDesc" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">是否办理公益性岗位: </span> |
|||
<span>{{ binaryText(formData.pubWelfareJobFlag) }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="是否办理公益性岗位" v-else> |
|||
<template> |
|||
<el-select |
|||
v-model="formData.pubWelfareJobFlag" |
|||
placeholder="请选择" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in binaryOptionList" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
:key="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</template> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">现工作单位: </span> |
|||
<span>{{ formData.workUnit || "--" }}</span> |
|||
</div> |
|||
<el-form-item |
|||
label-width="100px" |
|||
label="现工作单位" |
|||
class="wd-wr" |
|||
v-else |
|||
> |
|||
<el-input |
|||
v-model="formData.workUnit" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">备注: </span> |
|||
<span>{{ formData.remark || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="备注" class="wd-wr" v-else> |
|||
<el-input |
|||
v-model="formData.remark" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<div class="div_btn"> |
|||
<el-button size="small" @click="handleCancle">取 消</el-button> |
|||
<el-button |
|||
size="small" |
|||
type="primary" |
|||
:disabled="btnDisable" |
|||
@click="handleComfirm" |
|||
>确 定</el-button |
|||
> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { Loading } from "element-ui"; // 引入Loading服务 |
|||
import { requestPost, requestGet } from "@/js/dai/request"; |
|||
import nextTick from "dai-js/tools/nextTick"; |
|||
import { |
|||
genderList, |
|||
binaryOptionList, |
|||
politicsStatusList, |
|||
} from "@/js/columns/constants"; |
|||
|
|||
let loading; // 加载动画 |
|||
|
|||
export default { |
|||
props: { |
|||
formType: { |
|||
type: String, |
|||
default: "add", |
|||
}, |
|||
source: { |
|||
//展示来源：manage 管理平台 visiual 可视化平台 |
|||
type: String, |
|||
default: "manage", |
|||
}, |
|||
}, |
|||
|
|||
data() { |
|||
let self = this; |
|||
function endDisabledDate(time, key) { |
|||
let nowData = Date.now(); |
|||
let startTime = self.formData[key]; |
|||
if (startTime) { |
|||
let referenceTime = new Date(startTime); |
|||
return ( |
|||
time.getTime() < referenceTime - 24 * 60 * 60 * 1000 || |
|||
time.getTime() > nowData |
|||
); |
|||
} else { |
|||
return time.getTime() > nowData || time.getTime() === nowData; |
|||
} |
|||
} |
|||
let startDisabledDate = (time) => { |
|||
let nowData = Date.now(); |
|||
return time.getTime() > nowData; |
|||
}; |
|||
return { |
|||
btnDisable: false, |
|||
|
|||
formData: { |
|||
name: "张三", |
|||
mobile: "176777777777", |
|||
idType: "1", |
|||
idNum: "370215151515154551", |
|||
birthday: "2021-04-06", |
|||
gender: -2827257, |
|||
nation: "0", |
|||
politicsStatus: -54855012, |
|||
cultureLevel: "0", |
|||
marriage: "0", |
|||
localResidenceFlag: 0, |
|||
placeOfDomicile: "十大国际广场", |
|||
currentResidence: "李沧区", |
|||
joinArmyTime: "2021-05-07", |
|||
leaveArmyTime: "2021-05-05", |
|||
serviceUnit: "火箭军", |
|||
receiveUnit: "测测", |
|||
joinWarStartTime: "2021-05-07", |
|||
joinWarEndTime: "2021-05-07", |
|||
employmentSituation: "失业", |
|||
settlementAmount: 0, |
|||
trainDesc: "汽车维修", |
|||
pubWelfareJobFlag: 73704271, |
|||
workUnit: "时代国际广场", |
|||
remark: "备注", |
|||
}, |
|||
endPickerOptionsJoinWar: { |
|||
disabledDate: (time) => endDisabledDate(time, "joinWarStartTime"), |
|||
}, |
|||
startPickerOptions: { |
|||
disabledDate: startDisabledDate, |
|||
}, |
|||
genderList, |
|||
binaryOptionList, |
|||
politicsStatusList, |
|||
dataRule: { |
|||
name: [{ required: true, message: "姓名不能为空", trigger: "bulr" }], |
|||
idNum: [{ required: true, message: "证件号不能为空", trigger: "bulr" }], |
|||
|
|||
idType: [ |
|||
{ required: true, message: "证件类型不能为空", trigger: "bulr" }, |
|||
], |
|||
}, |
|||
scopeId: "", |
|||
|
|||
dicts: { |
|||
nationList: [], |
|||
educationList: [], |
|||
marriageList: [], |
|||
}, //字典对象 |
|||
}; |
|||
}, |
|||
|
|||
watch: {}, |
|||
|
|||
components: {}, |
|||
async created() { |
|||
await this.getDicts(); |
|||
}, |
|||
async mounted() { |
|||
this.startLoading(); |
|||
await this.endLoading(); |
|||
}, |
|||
|
|||
methods: { |
|||
async initForm(type, row) { |
|||
this.formType = type; |
|||
this.scopeId = row.categorizedResiId; |
|||
await this.getDetail(); |
|||
}, |
|||
binaryText(value) { |
|||
let text = ""; |
|||
text = this.binaryOptionList.filter((item) => item.value == value)[0] |
|||
.label; |
|||
return text || "--"; |
|||
}, |
|||
async getDetail(categorizedResiId) { |
|||
const url = `/governance/commonDemand/detail/${categorizedResiId}`; |
|||
const { data, code, msg } = await requestGet(url); |
|||
if (code === 0) { |
|||
console.log(data); |
|||
// let obj = { |
|||
// name: "测试", |
|||
// mobile: "17555555555", |
|||
// idType: "1", |
|||
// idNum: "370254111111111111", |
|||
// gender: "1", |
|||
// localResidenceFlag: 1, |
|||
// placeOfDomicile: "青岛市市北区时代国际广场", |
|||
// currentResidence: "青岛市李沧区建安小区", |
|||
// disabilityCategoryCode: "tingli", |
|||
// disabilityLevel: "1", |
|||
// disabilityNum: "545461564512167", |
|||
// subsistenceAllowanceFlag: 1, |
|||
// retirementAmount: 1, |
|||
// monthIncome: 200.111, |
|||
// contactName: "刘备", |
|||
// contactMobile: "15655555454", |
|||
// remark: "备注", |
|||
// }; |
|||
this.formData = { ...obj }; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
async handleComfirm() { |
|||
this.$refs["ref_add_form"].validate(async (valid) => { |
|||
if (!valid) { |
|||
return false; |
|||
} |
|||
const url = |
|||
this.formType === "edit" |
|||
? "/governance/commonDemand/update" |
|||
: "/governance/commonDemand/save"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, this.formData); |
|||
if (code === 0) { |
|||
this.$message.success("添加成功"); |
|||
this.resetData(); |
|||
this.$emit("handleComfirm"); |
|||
} else if (code >= 8000) { |
|||
this.$message.error(msg); |
|||
} |
|||
}); |
|||
}, |
|||
async getDicts() { |
|||
try { |
|||
const requests = [ |
|||
this.$http.post("sys/dict/data/nation", { |
|||
formCode: "resi_base_info", |
|||
}), |
|||
this.$http.post("sys/dict/data/education", { |
|||
formCode: "resi_base_info", |
|||
}), |
|||
this.$http.post("sys/dict/data/dictlist", { dictType: "marriage" }), |
|||
]; |
|||
const dictKeys = ["nationList", "educationList", "marriageList"]; |
|||
const results = await Promise.all(requests); |
|||
results.forEach((result, index) => { |
|||
if (result.data.code === 0) { |
|||
this.dicts[dictKeys[index]].push(...result.data.data); |
|||
} else { |
|||
console.log(`获取${dictKeys[index]}失败: ${result.data.msg}`); |
|||
} |
|||
}); |
|||
} catch (error) { |
|||
console.log("获取字典失败: ", error); |
|||
} |
|||
}, |
|||
handleCancle() { |
|||
this.resetData(); |
|||
this.$emit("handleClose"); |
|||
}, |
|||
|
|||
resetData() { |
|||
this.formData = {}; |
|||
}, |
|||
// 开启加载动画 |
|||
startLoading() { |
|||
loading = Loading.service({ |
|||
lock: true, // 是否锁定 |
|||
text: "正在加载……", // 加载中需要显示的文字 |
|||
background: "rgba(0,0,0,.7)", // 背景颜色 |
|||
}); |
|||
}, |
|||
// 结束加载动画 |
|||
endLoading() { |
|||
if (loading) { |
|||
loading.close(); |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/modules/management/form-main.scss"; |
|||
@import "@/assets/scss/modules/visual/a_customize.scss"; |
|||
@import "@/assets/scss/modules/management/detail-main.scss"; |
|||
|
|||
.form-item::v-deep .el-form-item__label { |
|||
color: #fff; |
|||
} |
|||
.form-item { |
|||
.el-radio { |
|||
color: #fff; |
|||
} |
|||
.el-checkbox { |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
.wd-wr { |
|||
width: 100%; |
|||
/deep/ .el-form-item__content { |
|||
width: calc(100% - 148px); |
|||
} |
|||
} |
|||
.info-prop { |
|||
margin-top: 29px; |
|||
.info-title-2 { |
|||
width: 100px; |
|||
text-align: right; |
|||
display: inline-block; |
|||
padding-right: 10px; |
|||
} |
|||
} |
|||
</style> |
|||
|
|||
|
|||
|
|||
@ -0,0 +1,946 @@ |
|||
<template> |
|||
<div class="g-main"> |
|||
<div> |
|||
<div class="m-search" :class=" |
|||
showSercahStatus |
|||
? 'm-form-box-height-auto' |
|||
: 'm-form-box-height' |
|||
"> |
|||
<el-form |
|||
:inline="true" |
|||
:model="formData" |
|||
ref="ref_searchform" |
|||
:label-width="'100px'" |
|||
> |
|||
<el-form-item label="姓名"> |
|||
<el-input |
|||
v-model="formData.name" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="联系电话"> |
|||
<el-input |
|||
v-model="formData.mobile" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="证件号"> |
|||
<el-input |
|||
v-model="formData.idNum" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="居住地址"> |
|||
<el-input |
|||
v-model="formData.currentResidence" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="出生日期"> |
|||
<el-date-picker |
|||
v-model="formData.birthdayStartTime" |
|||
type="date" |
|||
size="small" |
|||
class="u-item-width-daterange" |
|||
value-format="yyyy-MM-dd" |
|||
placeholder="开始日期" |
|||
:picker-options="startPickerOptions" |
|||
> |
|||
</el-date-picker> |
|||
<span class="u-data-tag">至</span> |
|||
<el-date-picker |
|||
v-model="formData.birthdayEndTime" |
|||
type="date" |
|||
size="small" |
|||
value-format="yyyy-MM-dd" |
|||
class="u-item-width-daterange u-data-tag" |
|||
placeholder="结束日期" |
|||
:picker-options="endPickerOptionsBirthday" |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
<el-form-item label="性别"> |
|||
<el-select |
|||
v-model="formData.gender" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in genderList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="民族"> |
|||
<el-select |
|||
v-model="formData.nation" |
|||
placeholder="请选择" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in dicts.nationList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="政治面貌"> |
|||
<el-select |
|||
v-model="formData.politicsStatus" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in politicsStatusList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="文化程度"> |
|||
<el-select |
|||
v-model="formData.education" |
|||
placeholder="请选择" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in dicts.educationList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="服役单位"> |
|||
<el-input |
|||
v-model="formData.serviceUnit" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="接收单位"> |
|||
<el-input |
|||
v-model="formData.receiveUnit" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="入伍日期"> |
|||
<el-date-picker |
|||
v-model="formData.joinArmyStartTime" |
|||
type="date" |
|||
size="small" |
|||
class="u-item-width-daterange" |
|||
value-format="yyyy-MM-dd" |
|||
placeholder="开始日期" |
|||
:picker-options="startPickerOptions" |
|||
> |
|||
</el-date-picker> |
|||
<span class="u-data-tag">至</span> |
|||
<el-date-picker |
|||
v-model="formData.joinArmyEndTime" |
|||
type="date" |
|||
size="small" |
|||
value-format="yyyy-MM-dd" |
|||
class="u-item-width-daterange u-data-tag" |
|||
placeholder="结束日期" |
|||
:picker-options="endPickerOptionsJoinArmy" |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
<el-form-item label="退伍日期"> |
|||
<el-date-picker |
|||
v-model="formData.leaveArmyStartTime" |
|||
type="date" |
|||
size="small" |
|||
class="u-item-width-daterange" |
|||
value-format="yyyy-MM-dd" |
|||
placeholder="开始日期" |
|||
:picker-options="startPickerOptions" |
|||
> |
|||
</el-date-picker> |
|||
<span class="u-data-tag">至</span> |
|||
<el-date-picker |
|||
v-model="formData.leaveArmyEndTime" |
|||
type="date" |
|||
size="small" |
|||
value-format="yyyy-MM-dd" |
|||
class="u-item-width-daterange u-data-tag" |
|||
placeholder="结束日期" |
|||
:picker-options="endPickerOptionsLeaveArmy" |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
<el-form-item label="参战日期"> |
|||
<el-date-picker |
|||
v-model="formData.joinWarStartTime" |
|||
type="date" |
|||
size="small" |
|||
class="u-item-width-daterange" |
|||
value-format="yyyy-MM-dd" |
|||
placeholder="开始日期" |
|||
:picker-options="startPickerOptions" |
|||
> |
|||
</el-date-picker> |
|||
<span class="u-data-tag">至</span> |
|||
<el-date-picker |
|||
v-model="formData.joinWarEndTime" |
|||
type="date" |
|||
size="small" |
|||
value-format="yyyy-MM-dd" |
|||
class="u-item-width-daterange u-data-tag" |
|||
placeholder="结束日期" |
|||
:picker-options="endPickerOptionsJoinWar" |
|||
> |
|||
</el-date-picker> |
|||
</el-form-item> |
|||
<el-form-item label="是否办理公益岗"> |
|||
<el-select |
|||
v-model="formData.pubWelfareJobFlag" |
|||
placeholder="请选择" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in binaryOptionList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="备注"> |
|||
<el-input |
|||
v-model="formData.remark" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-row type="flex"> |
|||
<el-col :span="24" align="right"> |
|||
<el-button |
|||
style="margin-left: 30px" |
|||
size="small" |
|||
type="primary " |
|||
@click="handleSearch" |
|||
>查询</el-button |
|||
> |
|||
<el-button |
|||
style="margin-left: 10px" |
|||
is-plain |
|||
class="diy-button--white el-button--default" |
|||
size="small" |
|||
@click="resetSearch" |
|||
>重置</el-button |
|||
> |
|||
<el-button |
|||
type="text" |
|||
size="small" |
|||
style="margin-left: 10px" |
|||
class="f-right5" |
|||
@click="showSercahStatus = !showSercahStatus" |
|||
> |
|||
<i |
|||
:class=" |
|||
showSercahStatus |
|||
? 'el-icon-arrow-up' |
|||
: 'el-icon-arrow-down' |
|||
" |
|||
></i> |
|||
{{ showSercahStatus ? "收起" : "展开" }} |
|||
</el-button> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="m-table"> |
|||
<div class="div_btn"> |
|||
<div class="div_btn_left"> |
|||
<el-button |
|||
size="small" |
|||
@click="handleAdd" |
|||
type="primary" |
|||
icon="el-icon-plus" |
|||
>新增</el-button |
|||
> |
|||
</div> |
|||
<el-button |
|||
@click="handleExport" |
|||
type="primary" |
|||
size="small" |
|||
class="diy-button--white el-button--default" |
|||
>导出</el-button |
|||
> |
|||
<el-button |
|||
@click="onDeleteBatch" |
|||
style="margin: 0 10px" |
|||
size="small" |
|||
type="primary" |
|||
> |
|||
批量删除 |
|||
</el-button> |
|||
<!-- |
|||
:on-success="handleExcelSuccess" |
|||
:before-upload="beforeExcelUpload" |
|||
:http-request="uploadHttpRequest" |
|||
--> |
|||
<el-upload |
|||
:headers="$getElUploadHeaders()" |
|||
ref="upload" |
|||
class="upload-demo" |
|||
action="uploadUlr" |
|||
:limit="1" |
|||
:accept="'.xls,.xlsx'" |
|||
:with-credentials="true" |
|||
:show-file-list="false" |
|||
:auto-upload="true" |
|||
> |
|||
<el-button |
|||
type="primary" |
|||
size="small" |
|||
class="diy-button--white el-button--default" |
|||
:loading="importLoading" |
|||
>导入</el-button |
|||
> |
|||
</el-upload> |
|||
<el-button |
|||
style="margin-left: 10px" |
|||
class="diy-button--blue" |
|||
size="small" |
|||
@click="handleExportModule('room')" |
|||
>下载模板</el-button |
|||
> |
|||
</div> |
|||
|
|||
<el-table |
|||
:data="tableData" |
|||
border |
|||
v-loading="tableLoading" |
|||
class="m-table-item" |
|||
style="width: 100%" |
|||
:height="maxTableHeight" |
|||
@selection-change="onMultiSelection" |
|||
> |
|||
<el-table-column |
|||
type="selection" |
|||
fixed="left" |
|||
align="center" |
|||
width="50" |
|||
/> |
|||
<el-table-column |
|||
label="序号" |
|||
fixed="left" |
|||
type="index" |
|||
align="center" |
|||
width="50" |
|||
/> |
|||
|
|||
<el-table-column |
|||
prop="name" |
|||
align="center" |
|||
width="100" |
|||
label="姓名" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
|
|||
<el-table-column |
|||
prop="mobile" |
|||
align="center" |
|||
width="200" |
|||
label="联系电话" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="idNum" |
|||
align="center" |
|||
width="200" |
|||
label="证件号" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="birthday" |
|||
align="center" |
|||
width="200" |
|||
label="证件号" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="genderName" |
|||
align="center" |
|||
width="80" |
|||
label="性别" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
<template slot-scope="scope"> |
|||
<span>{{scope.row.gender!=null?scope.row.gender==1?'男':scope.row.gender==2?'女':'--':'--'}}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="nationName" |
|||
align="center" |
|||
width="100" |
|||
label="民族" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="politicsStatusName" |
|||
align="center" |
|||
width="100" |
|||
label="政治面貌" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="cultureLevelName" |
|||
align="center" |
|||
width="100" |
|||
label="文化程度" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="joinArmyTime" |
|||
align="center" |
|||
width="100" |
|||
label="入伍日期" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="leaveArmyTime" |
|||
align="center" |
|||
width="100" |
|||
label="退伍日期" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="serviceUnit" |
|||
align="center" |
|||
width="100" |
|||
label="服役单位" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="currentResidence" |
|||
align="center" |
|||
width="100" |
|||
label="居住地址" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="remark" |
|||
align="center" |
|||
width="100" |
|||
label="备注" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
fixed="right" |
|||
label="操作" |
|||
align="center" |
|||
width="220" |
|||
> |
|||
<template slot-scope="scope"> |
|||
<el-button |
|||
@click="handleDetail(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
>查看</el-button |
|||
> |
|||
<el-button |
|||
v-if="scope.row.serviceStatus === 'in_service'" |
|||
@click="handleEdit(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
>编辑</el-button |
|||
> |
|||
|
|||
<el-button @click="handleDel(scope.row)" type="text" size="small" |
|||
>删除</el-button |
|||
> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<div> |
|||
<el-pagination |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
:current-page.sync="pageNo" |
|||
:page-sizes="[20, 50, 100, 200]" |
|||
:page-size="parseInt(pageSize)" |
|||
layout="sizes, prev, pager, next, total" |
|||
:total="total" |
|||
> |
|||
</el-pagination> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<el-dialog |
|||
v-if="showAdd" |
|||
:visible.sync="showAdd" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="addDiaTitle" |
|||
:modal-append-to-body="false" |
|||
width="720px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="showAdd = false" |
|||
> |
|||
<add-form |
|||
ref="ref_add_form" |
|||
:formType="formType" |
|||
@handleOk="handleOk" |
|||
@handleClose="handleClose" |
|||
></add-form> |
|||
</el-dialog> |
|||
<el-dialog |
|||
v-if="showDetail" |
|||
:visible.sync="showDetail" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="detailDiaTitle" |
|||
:modal-append-to-body="false" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="diaDetailClose" |
|||
> |
|||
<detail-form |
|||
ref="ref_detail_form" |
|||
:statusArray="statusArray" |
|||
@diaDetailClose="diaDetailClose" |
|||
> |
|||
</detail-form> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost } from "@/js/dai/request"; |
|||
import { genderList, binaryOptionList,politicsStatusList } from "@/js/columns/constants"; |
|||
import nextTick from "dai-js/tools/nextTick"; |
|||
import { mapGetters } from "vuex"; |
|||
import axios from "axios"; |
|||
import addForm from "./addForm"; |
|||
// import detailForm from "./detailForm"; |
|||
// import editForm from "./editForm"; |
|||
// |
|||
export default { |
|||
components: { addForm }, |
|||
data() { |
|||
let self = this |
|||
function endDisabledDate(time, key) { |
|||
let nowData = Date.now(); |
|||
let startTime = self.formData[key]; |
|||
if (startTime) { |
|||
let referenceTime = new Date(startTime); |
|||
return ( |
|||
time.getTime() < referenceTime - 24 * 60 * 60 * 1000 || |
|||
time.getTime() > nowData |
|||
); |
|||
} else { |
|||
return time.getTime() > nowData || time.getTime() === nowData; |
|||
} |
|||
} |
|||
let startDisabledDate = (time) => { |
|||
let nowData = Date.now(); |
|||
return time.getTime() > nowData; |
|||
}; |
|||
return { |
|||
tableLoading: false, |
|||
user: {}, |
|||
agencyId: "", |
|||
searchH: 170, |
|||
tableData: [], |
|||
genderList, |
|||
binaryOptionList, |
|||
politicsStatusList, |
|||
formData: { |
|||
name: "程合存华", |
|||
mobile: "18164434336", |
|||
idNum: null, |
|||
birthdayStartTime: "", |
|||
birthdayEndTime: "", |
|||
gender: 7, |
|||
nation: null, |
|||
politicsStatus: 36, |
|||
cultureLevel: null, |
|||
joinArmyStartTime: "", |
|||
joinArmyEndTime: "", |
|||
leaveArmyStartTime: "", |
|||
leaveArmyEndTime: "", |
|||
serviceUnit: "enim laboris", |
|||
receiveUnit: null, |
|||
joinWarStartTime: "", |
|||
joinWarEndTime: "", |
|||
pubWelfareJobFlag: 16, |
|||
remark: null, |
|||
|
|||
}, |
|||
showSercahStatus:false, |
|||
pageNo: 1, |
|||
pageSize: window.localStorage.getItem("pageSize") || 20, |
|||
total: 1, |
|||
|
|||
endPickerOptionsBirthday: { |
|||
disabledDate: (time) => endDisabledDate(time, 'birthdayStartTime'), |
|||
}, |
|||
endPickerOptionsJoinArmy: { |
|||
disabledDate: (time) => endDisabledDate(time, 'joinArmyStartTime'), |
|||
}, |
|||
endPickerOptionsLeaveArmy: { |
|||
disabledDate: (time) => endDisabledDate(time, 'leaveArmyStartTime'), |
|||
}, |
|||
endPickerOptionsJoinWar: { |
|||
disabledDate: (time) => endDisabledDate(time, 'joinWarStartTime'), |
|||
}, |
|||
startPickerOptions: { |
|||
disabledDate: startDisabledDate, |
|||
}, |
|||
showAdd: false, |
|||
showEdit: false, |
|||
showDetail: false, |
|||
formType: "add", |
|||
addDiaTitle: "新增", |
|||
detailDiaTitle: "详情", |
|||
|
|||
multiSelection: [], // 多选结果 |
|||
importLoading: false, |
|||
|
|||
dicts: { |
|||
nationList: [], |
|||
educationList: [], |
|||
}, //字典对象 |
|||
}; |
|||
}, |
|||
computed: { |
|||
maxTableHeight() { |
|||
const h = this.clientHeight - this.searchH - 330 + this.iframeHeight; |
|||
const _h = this.clientHeight - 330 - this.searchH; |
|||
return this.$store.state.inIframe ? h : _h; |
|||
}, |
|||
...mapGetters(["clientHeight", "iframeHeight"]), |
|||
}, |
|||
watch: {}, |
|||
async created() { |
|||
await this.getDicts(); |
|||
}, |
|||
mounted() { |
|||
console.log(this.$store.state); |
|||
this.user = this.$store.state.user; |
|||
this.agencyId = this.user.agencyId; |
|||
this.getTableData(); |
|||
}, |
|||
methods: { |
|||
// --------------------------------------字典------------------------------------------ |
|||
async getDicts() { |
|||
try { |
|||
const requests = [ |
|||
this.$http.post("sys/dict/data/nation", { |
|||
formCode: "resi_base_info", |
|||
}), |
|||
this.$http.post("sys/dict/data/education", { |
|||
formCode: "resi_base_info", |
|||
}), |
|||
]; |
|||
const dictKeys = ["nationList", "educationList"]; // 对应的键名 |
|||
|
|||
const results = await Promise.all(requests); |
|||
results.forEach((result, index) => { |
|||
if (result.data.code === 0) { |
|||
this.dicts[dictKeys[index]].push(...result.data.data); |
|||
} else { |
|||
console.log(`获取${dictKeys[index]}失败: ${result.data.msg}`); |
|||
} |
|||
}); |
|||
} catch (error) { |
|||
console.log("获取字典失败: ", error); |
|||
} |
|||
}, |
|||
binaryText(value) { |
|||
let text = ""; |
|||
text = this.binaryOptionList.filter((item) => item.value == value)[0] |
|||
.label; |
|||
return text || "--"; |
|||
}, |
|||
// ------------------------------------事件------------------------------------------ |
|||
checkNumberInput() { |
|||
if (isNaN(this.formData.retirementAmount)) { |
|||
this.$message.error("请输入数字"); |
|||
this.formData.retirementAmount = ""; |
|||
} else { |
|||
this.formData.retirementAmount = parseFloat( |
|||
this.formData.retirementAmount |
|||
); |
|||
} |
|||
}, |
|||
|
|||
// 搜索事件 |
|||
handleSearch(val) { |
|||
console.log(this.formData); |
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
// 调出新增组件 |
|||
async handleAdd() { |
|||
this.addDiaTitle = "新增"; |
|||
this.formType = "add"; |
|||
this.showAdd = true; |
|||
}, |
|||
// 查看详情触发事件 |
|||
async handleDetail(row) { |
|||
this.addDiaTitle = "详情"; |
|||
this.showDetail = true; |
|||
this.formType = "add"; |
|||
this.showAdd = true; |
|||
this.$nextTick(() => { |
|||
this.$refs.ref_add_form.initForm("detail", row); |
|||
}); |
|||
}, |
|||
// 详情弹出框取消事件 |
|||
diaDetailClose() { |
|||
this.$refs.ref_detail_form.diaDestroy(); |
|||
this.showDetail = false; |
|||
}, |
|||
// 编辑触发事件 |
|||
async handleEdit(row) {}, |
|||
// 新增弹出框组件取消事件 |
|||
handleClose() { |
|||
this.formType = ""; |
|||
this.showAdd = false; |
|||
this.showDetail = false; |
|||
this.showEdit = false; |
|||
}, |
|||
// 新增弹出框组件确定事件 |
|||
handleOk() { |
|||
this.handleClose(); |
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
// 删除触发事件 |
|||
async handleDel(row) { |
|||
this.$confirm("确认删除?", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning", |
|||
}) |
|||
.then(() => { |
|||
this.cancelFuwu([row.id]); |
|||
}) |
|||
.catch((err) => { |
|||
if (err == "cancel") { |
|||
} |
|||
}); |
|||
}, |
|||
// 删除处理 |
|||
async cancelFuwu(id) { |
|||
const url = "/governance/icServiceRecordV2/delete"; |
|||
const { data, code, msg } = await requestPost(url, id); |
|||
if (code === 0) { |
|||
this.$message.success("取消成功！"); |
|||
this.getTableData(); |
|||
} else { |
|||
this.$message.error("操作失败！"); |
|||
} |
|||
}, |
|||
// 获取列表 |
|||
async getTableData() { |
|||
this.tableLoading = true; |
|||
const url = "/actual/base/resiDisability/page"; |
|||
|
|||
const { pageSize, pageNo, formData } = this; |
|||
const { data, code, msg } = await requestPost(url, { |
|||
pageSize, |
|||
pageNo, |
|||
...formData, |
|||
}); |
|||
this.tableLoading = false; |
|||
if (code === 0) { |
|||
this.total = data.total || 0; |
|||
this.tableData = data.list; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
// 导出 |
|||
async handleExport() { |
|||
const url = "/governance/icServiceRecordV2/export"; |
|||
const { pageSize, pageNo, formData } = this; |
|||
axios({ |
|||
url: window.SITE_CONFIG["apiURL"] + url, |
|||
method: "post", |
|||
data: { |
|||
pageSize, |
|||
pageNo, |
|||
...formData, |
|||
}, |
|||
responseType: "blob", |
|||
}) |
|||
.then((res) => { |
|||
let fileName = window.decodeURI( |
|||
res.headers["content-disposition"].split(";")[1].split("=")[1] |
|||
); |
|||
console.log("filename", fileName); |
|||
let blob = new Blob([res.data], { |
|||
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", |
|||
}); |
|||
var url = window.URL.createObjectURL(blob); |
|||
var aLink = document.createElement("a"); |
|||
aLink.style.display = "none"; |
|||
aLink.href = url; |
|||
aLink.setAttribute("download", fileName); |
|||
document.body.appendChild(aLink); |
|||
aLink.click(); |
|||
document.body.removeChild(aLink); //下载完成移除元素 |
|||
window.URL.revokeObjectURL(url); //释放掉blob对象 |
|||
}) |
|||
.catch((err) => { |
|||
console.log("获取导出情失败", err); |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
// 下载模板 |
|||
async handleExportModule() { |
|||
let url = ""; |
|||
let params = {}; |
|||
await this.$http({ |
|||
method: "POST", |
|||
url, |
|||
responseType: "blob", |
|||
data: params, |
|||
}) |
|||
.then((res) => { |
|||
console.log("res----dddd", res); |
|||
// this.download(res.data, title + '.xls') |
|||
if (res.headers["content-disposition"]) { |
|||
let fileName = window.decodeURI( |
|||
res.headers["content-disposition"].split(";")[1].split("=")[1] |
|||
); |
|||
console.log("filename", fileName); |
|||
let blob = new Blob([res.data], { |
|||
type: "application/vnd.ms-excel", |
|||
}); |
|||
var url = window.URL.createObjectURL(blob); |
|||
var aLink = document.createElement("a"); |
|||
aLink.style.display = "none"; |
|||
aLink.href = url; |
|||
aLink.setAttribute("download", fileName); |
|||
document.body.appendChild(aLink); |
|||
aLink.click(); |
|||
document.body.removeChild(aLink); //下载完成移除元素 |
|||
window.URL.revokeObjectURL(url); //释放掉blob对象 |
|||
} else this.$message.error("下载失败"); |
|||
}) |
|||
.catch((err) => { |
|||
console.log("err", err); |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
// 分页 |
|||
handleSizeChange(val) { |
|||
this.pageSize = val; |
|||
window.localStorage.setItem("pageSize", val); |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
// 分页 |
|||
handleCurrentChange(val) { |
|||
this.pageNo = val; |
|||
this.getTableData(); |
|||
}, |
|||
// 重置 |
|||
resetSearch() { |
|||
this.formData = {}; |
|||
|
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
// 多选事件 |
|||
onMultiSelection(rows) { |
|||
this.multiSelection = rows; |
|||
}, |
|||
|
|||
// 批量删除 |
|||
onDeleteBatch() { |
|||
if (this.multiSelection.length == 0) { |
|||
this.$message.warning("请先选中至少一项"); |
|||
return; |
|||
} |
|||
|
|||
this.$confirm("删除之后无法恢复，确认删除？", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning", |
|||
}) |
|||
.then(() => { |
|||
this.cancelFuwu(this.multiSelection.map((e) => e.categorizedResiId)); |
|||
}) |
|||
.catch((err) => { |
|||
console.error(err); |
|||
this.$message.error("删除失败"); |
|||
}); |
|||
}, |
|||
}, |
|||
|
|||
props: {}, |
|||
}; |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/buttonstyle.scss"; |
|||
@import "@/assets/scss/modules/management/list-main.scss"; |
|||
@import "@/assets/scss/modules/shequzhili/event-info.scss"; |
|||
.div_btn_left > * { |
|||
margin-right: 10px; |
|||
} |
|||
</style> |
|||
|
|||
|
|||
@ -0,0 +1,522 @@ |
|||
<template> |
|||
<div> |
|||
<div |
|||
class="dialog-h-content scroll-h" |
|||
:class="{ 'visiual-form': source === 'visiual' }" |
|||
> |
|||
<el-form |
|||
ref="ref_add_form" |
|||
:inline="true" |
|||
:model="formData" |
|||
:rules="dataRule" |
|||
class="div_form" |
|||
> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">姓名: </span> |
|||
<span>{{ formData.name || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="姓名" prop="name" v-else> |
|||
<el-input |
|||
v-model="formData.name" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">联系电话: </span> |
|||
<span>{{ formData.mobile || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="联系电话" v-else> |
|||
<el-input |
|||
v-model="formData.mobile" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">证件类型: </span> |
|||
<span>{{ formData.idTypeName || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="证件类型" prop="idType" v-else> |
|||
<el-select v-model="formData.idType" clearable> |
|||
<el-option |
|||
v-for="item in dicts.idCard_type" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">证件号: </span> |
|||
<span>{{ formData.idNum || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="证件号" prop="idNum" v-else> |
|||
<el-input |
|||
v-model="formData.idNum" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">性别: </span> |
|||
<span>{{ formData.gender?formData.gender=='1'?'男':formData.gender=='2'?'女':'--':'--' }}</span |
|||
> |
|||
</div> |
|||
<el-form-item label-width="100px" label="性别" v-else> |
|||
|
|||
<el-select v-model="formData.gender" clearable> |
|||
<el-option |
|||
v-for="item in genderList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">本地户籍: </span> |
|||
<span>{{ formData.localResidenceFlag?formData.localResidenceFlag=='1'?'是':formData.localResidenceFlag=='0'?'否':'--':'--' }}</span |
|||
> |
|||
</div> |
|||
<el-form-item label-width="100px" label="本地户籍" v-else> |
|||
<el-select v-model="formData.localResidenceFlag" clearable> |
|||
<el-option |
|||
v-for="item in binaryOptionList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">户籍地址: </span> |
|||
<span>{{ formData.placeOfDomicile || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="户籍地址" class="wd-wr" v-else> |
|||
<el-input |
|||
v-model="formData.placeOfDomicile" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">现居地址: </span> |
|||
<span>{{ formData.currentResidence || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="现居地址" class="wd-wr" v-else> |
|||
<el-input |
|||
v-model="formData.currentResidence" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">残疾类别: </span> |
|||
<span>{{ formData.disabilityCategoryName || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="残疾类别" v-else> |
|||
<el-select v-model="formData.disabilityCategoryCode" clearable> |
|||
<el-option |
|||
v-for="item in dicts.disability_category_code" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">残疾级别: </span> |
|||
<span>{{ formData.disabilityLevelName || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="残疾级别" v-else> |
|||
<el-select v-model="formData.disabilityLevel" clearable> |
|||
<el-option |
|||
v-for="item in dicts.disability_level" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">残疾证号: </span> |
|||
<span>{{ formData.disabilityNum || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="残疾证号" v-else> |
|||
<el-input |
|||
v-model="formData.disabilityNum" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">低保: </span> |
|||
<span>{{ formData.subsistenceAllowanceFlag?formData.subsistenceAllowanceFlag=='1'?'是':formData.subsistenceAllowanceFlag=='0'?'否':'--':'--' }}</span |
|||
> |
|||
</div> |
|||
<el-form-item label-width="100px" label="低保" v-else> |
|||
<el-select v-model="formData.subsistenceAllowanceFlag" clearable> |
|||
<el-option |
|||
v-for="item in binaryOptionList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">退休金额: </span> |
|||
<span>{{ formData.retirementAmount || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="退休金额" v-else> |
|||
<el-input |
|||
v-model="formData.retirementAmount" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">月收入: </span> |
|||
<span>{{ formData.monthIncome || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="月收入" v-else> |
|||
<el-input |
|||
v-model="formData.monthIncome" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">联系人: </span> |
|||
<span>{{ formData.contactName || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="联系人" v-else> |
|||
<el-input |
|||
v-model="formData.contactName" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">联系电话: </span> |
|||
<span>{{ formData.contactMobile || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="联系电话" v-else> |
|||
<el-input |
|||
v-model="formData.contactMobile" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="info-prop" v-if="formType == 'detail'"> |
|||
<span class="info-title-2">备注: </span> |
|||
<span>{{ formData.remark || "--" }}</span> |
|||
</div> |
|||
<el-form-item label-width="100px" label="备注" class="wd-wr" v-else> |
|||
<el-input |
|||
v-model="formData.remark" |
|||
placeholder="请输入" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<div class="div_btn"> |
|||
<el-button size="small" @click="handleCancle">取 消</el-button> |
|||
<el-button |
|||
size="small" |
|||
type="primary" |
|||
:disabled="btnDisable" |
|||
@click="handleComfirm" |
|||
>确 定</el-button |
|||
> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { Loading } from "element-ui"; // 引入Loading服务 |
|||
import { requestPost, requestGet } from "@/js/dai/request"; |
|||
import nextTick from "dai-js/tools/nextTick"; |
|||
import { genderList, binaryOptionList } from "@/js/columns/constants"; |
|||
|
|||
let loading; // 加载动画 |
|||
|
|||
export default { |
|||
props: { |
|||
formType:{ |
|||
type:String, |
|||
default:'add' |
|||
}, |
|||
source: { |
|||
//展示来源：manage 管理平台 visiual 可视化平台 |
|||
type: String, |
|||
default: "manage", |
|||
}, |
|||
}, |
|||
|
|||
data() { |
|||
return { |
|||
btnDisable: false, |
|||
|
|||
formData: { |
|||
name: "", |
|||
mobile: "", |
|||
idType: "", |
|||
idNum: "", |
|||
gender: "", |
|||
localResidenceFlag: null, |
|||
placeOfDomicile: "", |
|||
currentResidence: "", |
|||
disabilityCategoryCode: "", |
|||
disabilityLevel: "", |
|||
disabilityNum: "", |
|||
subsistenceAllowanceFlag: null, |
|||
retirementAmount: null, |
|||
monthIncome: null, |
|||
contactName: "", |
|||
contactMobile: "", |
|||
remark: "", |
|||
}, |
|||
genderList, |
|||
binaryOptionList, |
|||
dataRule: { |
|||
name: [{ required: true, message: "姓名不能为空", trigger: "bulr" }], |
|||
idNum: [{ required: true, message: "证件号不能为空", trigger: "bulr" }], |
|||
|
|||
idType: [ |
|||
{ required: true, message: "证件类型不能为空", trigger: "bulr" }, |
|||
], |
|||
}, |
|||
scopeId: "", |
|||
|
|||
dicts: { |
|||
disability_category_code: [], |
|||
disability_level: [], |
|||
idCard_type: [], |
|||
}, |
|||
}; |
|||
}, |
|||
|
|||
watch: {}, |
|||
|
|||
components: {}, |
|||
async created() { |
|||
await this.getDicts(); |
|||
}, |
|||
async mounted() { |
|||
this.startLoading(); |
|||
await this.endLoading(); |
|||
}, |
|||
|
|||
methods: { |
|||
async initForm(type, row) { |
|||
this.formType = type; |
|||
this.scopeId = row.categorizedResiId; |
|||
await this.getDetail(); |
|||
}, |
|||
async getDetail(categorizedResiId) { |
|||
const url = `/governance/commonDemand/detail/${categorizedResiId}`; |
|||
const { data, code, msg } = await requestGet(url); |
|||
if (code === 0) { |
|||
console.log(data); |
|||
// let obj = { |
|||
// name: "测试", |
|||
// mobile: "17555555555", |
|||
// idType: "1", |
|||
// idNum: "370254111111111111", |
|||
// gender: "1", |
|||
// localResidenceFlag: 1, |
|||
// placeOfDomicile: "青岛市市北区时代国际广场", |
|||
// currentResidence: "青岛市李沧区建安小区", |
|||
// disabilityCategoryCode: "tingli", |
|||
// disabilityLevel: "1", |
|||
// disabilityNum: "545461564512167", |
|||
// subsistenceAllowanceFlag: 1, |
|||
// retirementAmount: 1, |
|||
// monthIncome: 200.111, |
|||
// contactName: "刘备", |
|||
// contactMobile: "15655555454", |
|||
// remark: "备注", |
|||
// }; |
|||
this.formData = { ...obj }; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
async handleComfirm() { |
|||
this.$refs["ref_add_form"].validate(async (valid) => { |
|||
if (!valid) { |
|||
return false; |
|||
} |
|||
const url = |
|||
this.formType === "edit" |
|||
? "/governance/commonDemand/update" |
|||
: "/governance/commonDemand/save"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, this.formData); |
|||
if (code === 0) { |
|||
this.$message.success("添加成功"); |
|||
this.resetData(); |
|||
this.$emit("handleComfirm"); |
|||
} else if (code >= 8000) { |
|||
this.$message.error(msg); |
|||
} |
|||
}); |
|||
}, |
|||
async getDicts() { |
|||
try { |
|||
const dictTypes = [ |
|||
"disability_category_code", |
|||
"disability_level", |
|||
"idCard_type", |
|||
]; // 把所有dictType放在这个数组里 |
|||
const requests = dictTypes.map((dictType) => { |
|||
return this.$http.post("sys/dict/data/dictlist", { |
|||
dictType: dictType, |
|||
}); |
|||
}); |
|||
const results = await Promise.all(requests); |
|||
results.forEach((result, index) => { |
|||
if (result.data.code === 0) { |
|||
this.dicts[dictTypes[index]].push(...result.data.data); |
|||
} else { |
|||
console.log(`获取${dictTypes[index]}字典失败: ${result.msg}`); |
|||
} |
|||
}); |
|||
} catch (error) { |
|||
console.log("获取字典失败: ", error); |
|||
} |
|||
}, |
|||
handleCancle() { |
|||
this.resetData(); |
|||
this.$emit("handleClose"); |
|||
}, |
|||
|
|||
resetData() { |
|||
this.formData = {}; |
|||
}, |
|||
// 开启加载动画 |
|||
startLoading() { |
|||
loading = Loading.service({ |
|||
lock: true, // 是否锁定 |
|||
text: "正在加载……", // 加载中需要显示的文字 |
|||
background: "rgba(0,0,0,.7)", // 背景颜色 |
|||
}); |
|||
}, |
|||
// 结束加载动画 |
|||
endLoading() { |
|||
if (loading) { |
|||
loading.close(); |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/modules/management/form-main.scss"; |
|||
@import "@/assets/scss/modules/visual/a_customize.scss"; |
|||
@import "@/assets/scss/modules/management/detail-main.scss"; |
|||
|
|||
.form-item::v-deep .el-form-item__label { |
|||
color: #fff; |
|||
} |
|||
.form-item { |
|||
.el-radio { |
|||
color: #fff; |
|||
} |
|||
.el-checkbox { |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
.wd-wr { |
|||
width: 100%; |
|||
/deep/ .el-form-item__content { |
|||
width: calc(100% - 148px); |
|||
} |
|||
} |
|||
.info-prop { |
|||
margin-top: 29px; |
|||
.info-title-2 { |
|||
width: 100px; |
|||
text-align: right; |
|||
display: inline-block; |
|||
padding-right: 10px; |
|||
} |
|||
} |
|||
</style> |
|||
|
|||
|
|||
|
|||
@ -0,0 +1,821 @@ |
|||
<template> |
|||
<div class="g-main"> |
|||
<div> |
|||
<div class="m-search"> |
|||
<el-form |
|||
:inline="true" |
|||
:model="formData" |
|||
ref="ref_searchform" |
|||
:label-width="'100px'" |
|||
> |
|||
<el-form-item label="志愿者类别"> |
|||
<el-select |
|||
v-model="formData.volunteerCategory" |
|||
placeholder="请选择" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
multiple |
|||
collapse-tags |
|||
> |
|||
<el-option |
|||
v-for="item in dicts.volunteerList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="姓名"> |
|||
<el-input |
|||
v-model="formData.name" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="联系电话"> |
|||
<el-input |
|||
v-model="formData.mobile" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="证件号"> |
|||
<el-input |
|||
v-model="formData.idNum" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="年龄"> |
|||
<el-input |
|||
v-model="formData.ageStart" |
|||
placeholder="请输入内容" |
|||
size="small" |
|||
class="u-item-width-daterange" |
|||
clearable |
|||
></el-input> |
|||
<span class="u-data-tag">至</span> |
|||
<el-input |
|||
v-model="formData.ageEnd" |
|||
placeholder="请输入内容" |
|||
size="small" |
|||
class="u-item-width-daterange u-data-tag" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="性别"> |
|||
<el-select |
|||
v-model="formData.gender" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in genderList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="民族"> |
|||
<el-select |
|||
v-model="formData.nation" |
|||
placeholder="请选择" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in dicts.nationList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="文化程度"> |
|||
<el-select |
|||
v-model="formData.cultureLevel" |
|||
placeholder="请选择" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
> |
|||
<el-option |
|||
v-for="item in dicts.educationList" |
|||
:key="item.value" |
|||
:label="item.label" |
|||
:value="item.value" |
|||
> |
|||
</el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="职业"> |
|||
<el-input |
|||
v-model="formData.occupation" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="兴趣特长"> |
|||
<el-input |
|||
v-model="formData.hobbyInfo" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="居住地址"> |
|||
<el-input |
|||
v-model="formData.currentResidence" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="备注"> |
|||
<el-input |
|||
v-model="formData.remark" |
|||
placeholder="请输入" |
|||
size="small" |
|||
class="u-item-width-normal" |
|||
clearable |
|||
></el-input> |
|||
</el-form-item> |
|||
<el-row type="flex"> |
|||
<el-col :span="24" align="right"> |
|||
<el-button |
|||
style="margin-left: 30px" |
|||
size="small" |
|||
type="primary " |
|||
@click="handleSearch" |
|||
>查询</el-button |
|||
> |
|||
<el-button |
|||
style="margin-left: 10px" |
|||
is-plain |
|||
class="diy-button--white el-button--default" |
|||
size="small" |
|||
@click="resetSearch" |
|||
>重置</el-button |
|||
> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="m-table"> |
|||
<div class="div_btn"> |
|||
<div class="div_btn_left"> |
|||
<el-button |
|||
size="small" |
|||
@click="handleAdd" |
|||
type="primary" |
|||
icon="el-icon-plus" |
|||
>新增</el-button |
|||
> |
|||
</div> |
|||
<el-button |
|||
@click="handleExport" |
|||
type="primary" |
|||
size="small" |
|||
class="diy-button--white el-button--default" |
|||
>导出</el-button |
|||
> |
|||
<el-button |
|||
@click="onDeleteBatch" |
|||
style="margin: 0 10px" |
|||
size="small" |
|||
type="primary" |
|||
> |
|||
批量删除 |
|||
</el-button> |
|||
<!-- |
|||
:on-success="handleExcelSuccess" |
|||
:before-upload="beforeExcelUpload" |
|||
:http-request="uploadHttpRequest" |
|||
--> |
|||
<el-upload |
|||
:headers="$getElUploadHeaders()" |
|||
ref="upload" |
|||
class="upload-demo" |
|||
action="uploadUlr" |
|||
:limit="1" |
|||
:accept="'.xls,.xlsx'" |
|||
:with-credentials="true" |
|||
:show-file-list="false" |
|||
:auto-upload="true" |
|||
> |
|||
<el-button |
|||
type="primary" |
|||
size="small" |
|||
class="diy-button--white el-button--default" |
|||
:loading="importLoading" |
|||
>导入</el-button |
|||
> |
|||
</el-upload> |
|||
<el-button |
|||
style="margin-left: 10px" |
|||
class="diy-button--blue" |
|||
size="small" |
|||
@click="handleExportModule('room')" |
|||
>下载模板</el-button |
|||
> |
|||
</div> |
|||
|
|||
<el-table |
|||
:data="tableData" |
|||
border |
|||
v-loading="tableLoading" |
|||
class="m-table-item" |
|||
style="width: 100%" |
|||
:height="maxTableHeight" |
|||
@selection-change="onMultiSelection" |
|||
> |
|||
<el-table-column |
|||
type="selection" |
|||
fixed="left" |
|||
align="center" |
|||
width="50" |
|||
/> |
|||
<el-table-column |
|||
label="序号" |
|||
fixed="left" |
|||
type="index" |
|||
align="center" |
|||
width="50" |
|||
/> |
|||
|
|||
<el-table-column |
|||
prop="volunteerCategoryName" |
|||
align="center" |
|||
width="200" |
|||
label="志愿者类别" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="name" |
|||
align="center" |
|||
width="100" |
|||
label="姓名" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
|
|||
<el-table-column |
|||
prop="mobile" |
|||
align="center" |
|||
width="200" |
|||
label="联系电话" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="idNum" |
|||
align="center" |
|||
width="200" |
|||
label="证件号" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="age" |
|||
align="center" |
|||
width="80" |
|||
label="年龄" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="genderName" |
|||
align="center" |
|||
width="80" |
|||
label="性别" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
<template slot-scope="scope"> |
|||
<span>{{ |
|||
scope.row.gender |
|||
? scope.row.gender == "1" |
|||
? "男" |
|||
: scope.row.gender == "2" |
|||
? "女" |
|||
: "--" |
|||
: "--" |
|||
}}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="nationName" |
|||
align="center" |
|||
width="100" |
|||
label="民族" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="cultureLevelName" |
|||
align="center" |
|||
width="100" |
|||
label="文化程度" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="occupation" |
|||
align="center" |
|||
width="100" |
|||
label="职业" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="hobbyInfo" |
|||
align="center" |
|||
width="100" |
|||
label="兴趣特长" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
prop="residentialAddress" |
|||
align="center" |
|||
width="100" |
|||
label="居住地址" |
|||
:show-overflow-tooltip="true" |
|||
> |
|||
</el-table-column> |
|||
<el-table-column |
|||
fixed="right" |
|||
label="操作" |
|||
align="center" |
|||
width="220" |
|||
> |
|||
<template slot-scope="scope"> |
|||
<el-button |
|||
@click="handleDetail(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
>查看</el-button |
|||
> |
|||
<el-button |
|||
v-if="scope.row.serviceStatus === 'in_service'" |
|||
@click="handleEdit(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
>编辑</el-button |
|||
> |
|||
|
|||
<el-button @click="handleDel(scope.row)" type="text" size="small" |
|||
>删除</el-button |
|||
> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<div> |
|||
<el-pagination |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
:current-page.sync="pageNo" |
|||
:page-sizes="[20, 50, 100, 200]" |
|||
:page-size="parseInt(pageSize)" |
|||
layout="sizes, prev, pager, next, total" |
|||
:total="total" |
|||
> |
|||
</el-pagination> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<el-dialog |
|||
v-if="showAdd" |
|||
:visible.sync="showAdd" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="addDiaTitle" |
|||
:modal-append-to-body="false" |
|||
width="720px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="showAdd = false" |
|||
> |
|||
<add-form |
|||
ref="ref_add_form" |
|||
:formType="formType" |
|||
@handleOk="handleOk" |
|||
@handleClose="handleClose" |
|||
></add-form> |
|||
</el-dialog> |
|||
<el-dialog |
|||
v-if="showDetail" |
|||
:visible.sync="showDetail" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="detailDiaTitle" |
|||
:modal-append-to-body="false" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="diaDetailClose" |
|||
> |
|||
<detail-form |
|||
ref="ref_detail_form" |
|||
:statusArray="statusArray" |
|||
@diaDetailClose="diaDetailClose" |
|||
> |
|||
</detail-form> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost } from "@/js/dai/request"; |
|||
import { genderList, binaryOptionList } from "@/js/columns/constants"; |
|||
import nextTick from "dai-js/tools/nextTick"; |
|||
import { mapGetters } from "vuex"; |
|||
import axios from "axios"; |
|||
import addForm from "./addForm.vue"; |
|||
// import detailForm from "./detailForm"; |
|||
// import editForm from "./editForm"; |
|||
|
|||
export default { |
|||
components: { addForm }, |
|||
|
|||
data() { |
|||
let endDisabledDate = (time) => { |
|||
//这个关键属性我们一定要写在data的里面并且return的外面，这是动态改变区间的关键 |
|||
let nowData = Date.now(); |
|||
if (this.formData.serviceTimeStart) { |
|||
let serviceTimeStart = new Date(this.formData.serviceTimeStart); |
|||
return ( |
|||
time.getTime() < serviceTimeStart - 24 * 60 * 60 * 1000 || |
|||
time.getTime() === serviceTimeStart - 24 * 60 * 60 * 1000 |
|||
); |
|||
} else { |
|||
return time.getTime() > nowData || time.getTime() === nowData; |
|||
} |
|||
}; |
|||
// let startDisabledDate = (time) => { |
|||
// //这个关键属性我们一定要写在data的里面并且return的外面，这是动态改变区间的关键 |
|||
// let nowData = Date.now() - 24 * 60 * 60 * 1000; |
|||
// return time.getTime() < nowData; |
|||
// }; |
|||
|
|||
return { |
|||
tableLoading: false, |
|||
user: {}, |
|||
agencyId: "", |
|||
searchH: 170, |
|||
tableData: [], |
|||
genderList, |
|||
binaryOptionList, |
|||
formData: { |
|||
name: "不马求华省", |
|||
mobile: "13847278127", |
|||
idNum: "60", |
|||
ageStart: "18", |
|||
ageEnd: "19", |
|||
gender: 1, |
|||
nation: "", |
|||
currentResidence: "", |
|||
cultureLevel: "1", |
|||
volunteerCategory: "", |
|||
occupation: "", |
|||
hobbyInfo: "", |
|||
remark: "", |
|||
}, |
|||
pageNo: 1, |
|||
pageSize: window.localStorage.getItem("pageSize") || 20, |
|||
total: 1, |
|||
endPickerOptions: { |
|||
disabledDate: endDisabledDate, |
|||
}, |
|||
startPickerOptions: { |
|||
// disabledDate: startDisabledDate |
|||
}, |
|||
|
|||
showAdd: false, |
|||
showEdit: false, |
|||
showDetail: false, |
|||
formType: "add", |
|||
addDiaTitle: "新增", |
|||
detailDiaTitle: "详情", |
|||
|
|||
multiSelection: [], // 多选结果 |
|||
importLoading: false, |
|||
|
|||
dicts: { |
|||
educationList: [], |
|||
nationList: [], |
|||
volunteerList: [], |
|||
}, //字典对象 |
|||
}; |
|||
}, |
|||
computed: { |
|||
maxTableHeight() { |
|||
const h = this.clientHeight - this.searchH - 330 + this.iframeHeight; |
|||
const _h = this.clientHeight - 330 - this.searchH; |
|||
return this.$store.state.inIframe ? h : _h; |
|||
}, |
|||
...mapGetters(["clientHeight", "iframeHeight"]), |
|||
}, |
|||
watch: {}, |
|||
async created() { |
|||
await this.getDicts(); |
|||
}, |
|||
mounted() { |
|||
console.log(this.$store.state); |
|||
this.user = this.$store.state.user; |
|||
this.agencyId = this.user.agencyId; |
|||
this.getTableData(); |
|||
}, |
|||
methods: { |
|||
// --------------------------------------字典------------------------------------------ |
|||
async getDicts() { |
|||
try { |
|||
const requests = [ |
|||
this.$http.post("sys/dict/data/nation", { |
|||
formCode: "resi_base_info", |
|||
}), |
|||
this.$http.post("sys/dict/data/education", { |
|||
formCode: "resi_base_info", |
|||
}), |
|||
this.$http.post("sys/dict/data/dictlist", { |
|||
dictType: "VOLUNTEER_CATEGORY", |
|||
}), |
|||
]; |
|||
const dictKeys = ["nationList", "educationList", "volunteerList"]; // 对应的键名 |
|||
|
|||
const results = await Promise.all(requests); |
|||
results.forEach((result, index) => { |
|||
if (result.data.code === 0) { |
|||
this.dicts[dictKeys[index]].push(...result.data.data); |
|||
} else { |
|||
console.log(`获取${dictKeys[index]}失败: ${result.data.msg}`); |
|||
} |
|||
}); |
|||
} catch (error) { |
|||
console.log("获取字典失败: ", error); |
|||
} |
|||
}, |
|||
|
|||
binaryText(value) { |
|||
let text = ""; |
|||
text = this.binaryOptionList.filter((item) => item.value == value)[0] |
|||
.label; |
|||
return text || "--"; |
|||
}, |
|||
// ------------------------------------事件------------------------------------------ |
|||
checkNumberInput() { |
|||
if (isNaN(this.formData.retirementAmount)) { |
|||
this.$message.error("请输入数字"); |
|||
this.formData.retirementAmount = ""; |
|||
} else { |
|||
this.formData.retirementAmount = parseFloat( |
|||
this.formData.retirementAmount |
|||
); |
|||
} |
|||
}, |
|||
|
|||
// 搜索事件 |
|||
handleSearch(val) { |
|||
console.log(this.formData); |
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
// 调出新增组件 |
|||
async handleAdd() { |
|||
this.addDiaTitle = "新增"; |
|||
this.formType = "add"; |
|||
this.showAdd = true; |
|||
}, |
|||
// 查看详情触发事件 |
|||
async handleDetail(row) { |
|||
this.addDiaTitle = "详情"; |
|||
this.showDetail = true; |
|||
this.formType = "add"; |
|||
this.showAdd = true; |
|||
this.$nextTick(() => { |
|||
this.$refs.ref_add_form.initForm("detail", row); |
|||
}); |
|||
}, |
|||
// 详情弹出框取消事件 |
|||
diaDetailClose() { |
|||
this.$refs.ref_detail_form.diaDestroy(); |
|||
this.showDetail = false; |
|||
}, |
|||
// 编辑触发事件 |
|||
async handleEdit(row) {}, |
|||
// 新增弹出框组件取消事件 |
|||
handleClose() { |
|||
this.formType = ""; |
|||
this.showAdd = false; |
|||
this.showDetail = false; |
|||
this.showEdit = false; |
|||
}, |
|||
// 新增弹出框组件确定事件 |
|||
handleOk() { |
|||
this.handleClose(); |
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
// 删除触发事件 |
|||
async handleDel(row) { |
|||
this.$confirm("确认删除?", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning", |
|||
}) |
|||
.then(() => { |
|||
this.cancelFuwu([row.id]); |
|||
}) |
|||
.catch((err) => { |
|||
if (err == "cancel") { |
|||
// this.$message({ |
|||
// type: "info", |
|||
// message: "已取消删除" |
|||
// }); |
|||
} |
|||
}); |
|||
}, |
|||
// 删除处理 |
|||
async cancelFuwu(id) { |
|||
const url = "/governance/icServiceRecordV2/delete"; |
|||
const { data, code, msg } = await requestPost(url, id); |
|||
if (code === 0) { |
|||
this.$message.success("取消成功！"); |
|||
this.getTableData(); |
|||
} else { |
|||
this.$message.error("操作失败！"); |
|||
} |
|||
}, |
|||
// 获取列表 |
|||
async getTableData() { |
|||
this.tableLoading = true; |
|||
const url = "/actual/base/resiDisability/page"; |
|||
|
|||
const { pageSize, pageNo, formData } = this; |
|||
const { data, code, msg } = await requestPost(url, { |
|||
pageSize, |
|||
pageNo, |
|||
...formData, |
|||
}); |
|||
this.tableLoading = false; |
|||
if (code === 0) { |
|||
this.total = data.total || 0; |
|||
this.tableData = data.list; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
// 导出 |
|||
async handleExport() { |
|||
const url = "/governance/icServiceRecordV2/export"; |
|||
const { pageSize, pageNo, formData } = this; |
|||
axios({ |
|||
url: window.SITE_CONFIG["apiURL"] + url, |
|||
method: "post", |
|||
data: { |
|||
pageSize, |
|||
pageNo, |
|||
...formData, |
|||
}, |
|||
responseType: "blob", |
|||
}) |
|||
.then((res) => { |
|||
let fileName = window.decodeURI( |
|||
res.headers["content-disposition"].split(";")[1].split("=")[1] |
|||
); |
|||
console.log("filename", fileName); |
|||
let blob = new Blob([res.data], { |
|||
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", |
|||
}); |
|||
var url = window.URL.createObjectURL(blob); |
|||
var aLink = document.createElement("a"); |
|||
aLink.style.display = "none"; |
|||
aLink.href = url; |
|||
aLink.setAttribute("download", fileName); |
|||
document.body.appendChild(aLink); |
|||
aLink.click(); |
|||
document.body.removeChild(aLink); //下载完成移除元素 |
|||
window.URL.revokeObjectURL(url); //释放掉blob对象 |
|||
}) |
|||
.catch((err) => { |
|||
console.log("获取导出情失败", err); |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
// 下载模板 |
|||
async handleExportModule() { |
|||
let url = ""; |
|||
let params = {}; |
|||
await this.$http({ |
|||
method: "POST", |
|||
url, |
|||
responseType: "blob", |
|||
data: params, |
|||
}) |
|||
.then((res) => { |
|||
console.log("res----dddd", res); |
|||
// this.download(res.data, title + '.xls') |
|||
if (res.headers["content-disposition"]) { |
|||
let fileName = window.decodeURI( |
|||
res.headers["content-disposition"].split(";")[1].split("=")[1] |
|||
); |
|||
console.log("filename", fileName); |
|||
let blob = new Blob([res.data], { |
|||
type: "application/vnd.ms-excel", |
|||
}); |
|||
var url = window.URL.createObjectURL(blob); |
|||
var aLink = document.createElement("a"); |
|||
aLink.style.display = "none"; |
|||
aLink.href = url; |
|||
aLink.setAttribute("download", fileName); |
|||
document.body.appendChild(aLink); |
|||
aLink.click(); |
|||
document.body.removeChild(aLink); //下载完成移除元素 |
|||
window.URL.revokeObjectURL(url); //释放掉blob对象 |
|||
} else this.$message.error("下载失败"); |
|||
}) |
|||
.catch((err) => { |
|||
console.log("err", err); |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
// 分页 |
|||
handleSizeChange(val) { |
|||
this.pageSize = val; |
|||
window.localStorage.setItem("pageSize", val); |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
// 分页 |
|||
handleCurrentChange(val) { |
|||
this.pageNo = val; |
|||
this.getTableData(); |
|||
}, |
|||
// 重置 |
|||
resetSearch() { |
|||
this.formData = {}; |
|||
|
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
// 多选事件 |
|||
onMultiSelection(rows) { |
|||
this.multiSelection = rows; |
|||
}, |
|||
|
|||
// 批量删除 |
|||
onDeleteBatch() { |
|||
if (this.multiSelection.length == 0) { |
|||
this.$message.warning("请先选中至少一项"); |
|||
return; |
|||
} |
|||
|
|||
this.$confirm("删除之后无法恢复，确认删除？", "提示", { |
|||
confirmButtonText: "确定", |
|||
cancelButtonText: "取消", |
|||
type: "warning", |
|||
}) |
|||
.then(() => { |
|||
this.cancelFuwu(this.multiSelection.map((e) => e.categorizedResiId)); |
|||
}) |
|||
.catch((err) => { |
|||
console.error(err); |
|||
this.$message.error("删除失败"); |
|||
}); |
|||
}, |
|||
}, |
|||
|
|||
props: {}, |
|||
}; |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/buttonstyle.scss"; |
|||
@import "@/assets/scss/modules/management/list-main.scss"; |
|||
@import "@/assets/scss/modules/shequzhili/event-info.scss"; |
|||
.div_btn_left > * { |
|||
margin-right: 10px; |
|||
} |
|||
</style> |
|||
|
|||
|
|||
Loading…
Reference in new issue