lcw
This commit is contained in:
@ -2,63 +2,50 @@
|
||||
<div>
|
||||
<div class="headClass" style="">
|
||||
<h3>密切联系人</h3>
|
||||
<!-- <el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button> -->
|
||||
|
||||
<el-button type="primary" @click="openDialog('新增密切联系人', {}, true)">新增</el-button>
|
||||
</div>
|
||||
<div class="headSelect">
|
||||
<el-form :model="formData" :inline="true" ref="formRef" :rules="rulesForm" class="form-inline">
|
||||
<!-- 姓名 -->
|
||||
<el-form-item label="姓名" prop="username" :rules="[
|
||||
{ required: true, message: '请输入用户名', trigger: 'blur' },
|
||||
{ min: 2, max: 4, message: '长度在 2 到 4 个字符', trigger: 'blur' }
|
||||
]">
|
||||
<el-input v-model="formData.username" placeholder="请输入姓名" style="width: 120px;" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="姓名">
|
||||
<el-input v-model="formData.username" placeholder="请输入姓名" />
|
||||
</el-form-item> -->
|
||||
<!-- 身份证号码 -->
|
||||
<el-form-item label="身份证号码" prop="cardID" :rules="[
|
||||
{ required: true, message: '请输入身份证号码', trigger: 'blur' }
|
||||
]">
|
||||
<el-input v-model="formData.ID" placeholder="请输入身份证号码" style="width: 200px;" />
|
||||
<el-form-item label="身份证号码">
|
||||
<el-input v-model="formData.rySfzh" placeholder="请输入身份证号码" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 按钮组：统一放在一个 item 中 -->
|
||||
<el-form-item class="form-actions">
|
||||
<el-button type="primary" @click="check">查询</el-button>
|
||||
<el-button @click="resetForm">重置</el-button>
|
||||
<el-button @click="openDialog('新增密切联系人')">新增</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<!-- <template #ryXm="{ row }">
|
||||
<DictTag :tag="false" :value="row.clys" :options="D_BZ_CLYS" />
|
||||
</template> -->
|
||||
<template #dygx="{ row }">
|
||||
<DictTag :tag="false" :value="row.dygx" :options="D_BZ_QSGXDM" />
|
||||
</template>
|
||||
<!-- 操作 -->
|
||||
<template #controls="{ row }">
|
||||
<el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
|
||||
<el-link type="danger" @click="openDialog('修改密切联系人', row)">修改</el-link>
|
||||
<el-link type="danger" @click="openDialog('修改密切联系人', row, false)">修改</el-link>
|
||||
</template>
|
||||
</MyTable>
|
||||
<diaLogForm v-model:visible="dialogVisible" :diaLogRules="diaLogRules" :diaLogRuleForm="diaLogRuleForm"
|
||||
@submit="addPersonOrModifica" :Tips="Tips">
|
||||
<diaLogForm v-model="dialogVisible" :data="diaLogRuleForm" @submit="addPersonOrModifica" :title="Tips"
|
||||
:dict="{ D_BZ_QSGXDM }">
|
||||
</diaLogForm>
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { identityCardRule } from "@/utils/rules"
|
||||
import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import diaLogForm from "../components/diaLogForm.vue";
|
||||
import { tbGsxtZdryLxrsaveOrUpdateLxr, tbZdryClxxBatchAdd, tbZdryClxxDelete, tbGsxtZdryLxrselectLxrBy, tbZdryClxxUpdate } from '@/api/zdr.js'
|
||||
import diaLogForm from "../component/diaLogForm.vue";
|
||||
import { tbZdryClxxUpdate, tbGsxtZdryLxrsaveOrUpdateLxr,tbGsxtZdryLxrselectLxrBy ,tbGsxtZdryLxr} from '@/api/zdr.js'
|
||||
import { ElMessage, ElMessageBox } from "element-plus";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP } = proxy.$dict("D_BZ_CLLX", "D_BZ_CLYS", "D_BZ_CLPP"); //获取字典数据
|
||||
const chooseMarksVisible = ref(false)
|
||||
const { D_BZ_QSGXDM } = proxy.$dict("D_BZ_QSGXDM"); //获取字典数据
|
||||
const props = defineProps({
|
||||
dataList: {
|
||||
type: Object,
|
||||
@ -72,37 +59,25 @@ const props = defineProps({
|
||||
default: false
|
||||
},
|
||||
})
|
||||
const ruleForm = ref({
|
||||
name: '',
|
||||
cardID: '',
|
||||
relation: '',
|
||||
phone: '',
|
||||
})
|
||||
const dialogVisible = ref(false)
|
||||
const listData = ref({})
|
||||
const Tips = ref(false)
|
||||
const addUpd = ref(true)
|
||||
const Tips = ref("密切联系人")
|
||||
// 表格数据
|
||||
const pageData = reactive({
|
||||
tableData: [],
|
||||
tableColumn: [{
|
||||
prop: 'ryXm',
|
||||
label: '人员姓名',
|
||||
|
||||
}, {
|
||||
prop: 'rySfzh',
|
||||
label: '身份证号码',
|
||||
width: 200
|
||||
|
||||
}, {
|
||||
|
||||
prop: 'dygx',
|
||||
label: '关系',
|
||||
showSolt: true,
|
||||
}, {
|
||||
|
||||
prop: 'lxrDh',
|
||||
label: '联系电话',
|
||||
width: 120
|
||||
}],
|
||||
tableHeight: '200px',
|
||||
keyCount: 0,
|
||||
@ -120,171 +95,104 @@ const pageData = reactive({
|
||||
controlsWidth: 200,
|
||||
})
|
||||
// 表单数据
|
||||
const formData = reactive({
|
||||
const formData = ref({
|
||||
username: "",
|
||||
ID: ""
|
||||
})
|
||||
const touchIn = ref(true)
|
||||
const rulesForm = ref(identityCardRule({ validator: true }, 'rySfzh'))
|
||||
const diaLogRuleForm = reactive([{ prop: 'username', label: '姓名', type: 'input', value: '' },
|
||||
{ prop: 'cardID', label: '身份证号', type: 'input', value: '' },
|
||||
{ prop: 'relation', label: '关系', type: 'input', value: '' },
|
||||
{ prop: 'phone', label: '联系电话', type: 'input', value: '' }
|
||||
])
|
||||
const diaLogRuleForm = ref({})
|
||||
watch(() => props.dataList, (val) => {
|
||||
if (val) {
|
||||
console.log(val, 'listData.value');
|
||||
|
||||
listData.value = val
|
||||
|
||||
getContact()
|
||||
}
|
||||
}, { deep: true })
|
||||
// 弹出增加或者修改弹窗
|
||||
const openDialog = (type, formVal) => {
|
||||
const openDialog = (type, formVal, bool) => {
|
||||
touchIn.value = bool
|
||||
dialogVisible.value = true
|
||||
Tips.value = type
|
||||
console.log(formVal, "formVal");
|
||||
|
||||
console.log(dialogVisible.value, "dialogVisible.value")
|
||||
if (type === '新增密切联系人') {
|
||||
diaLogRuleForm.forEach(item => {
|
||||
item.value = ''
|
||||
})
|
||||
} else {
|
||||
diaLogRuleForm[0].value = formVal.ryXm
|
||||
diaLogRuleForm[1].value = formVal.rySfzh
|
||||
diaLogRuleForm[2].value = formVal.dygx
|
||||
diaLogRuleForm[3].value = formVal.lxrDh
|
||||
}
|
||||
|
||||
diaLogRuleForm.value = { ...formVal }
|
||||
}
|
||||
// 增加或修改数据接口
|
||||
const dataModel = ref()
|
||||
const addPersonOrModifica = async (val) => {
|
||||
console.log('dafafaf', val)
|
||||
let params = {
|
||||
id: listData.value.id
|
||||
}
|
||||
val.forEach(item => {
|
||||
switch (item.label) {
|
||||
case '姓名':
|
||||
params.ryXm = item.value
|
||||
break
|
||||
case '身份证号':
|
||||
params.rySfzh = item.value
|
||||
break
|
||||
case '关系':
|
||||
params.dygx = item.value
|
||||
break
|
||||
case '联系电话':
|
||||
params.lxrDh = item.value
|
||||
break
|
||||
default:
|
||||
break
|
||||
// 提交表单
|
||||
const addPersonOrModifica = (val) => {
|
||||
if (touchIn.value) {
|
||||
const item = pageData.tableData.findIndex(item => item.rySfzh == val.rySfzh)
|
||||
if (item != -1) {
|
||||
proxy.$message({
|
||||
message: '该人员已存在',
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
}
|
||||
})
|
||||
console.log(params, "fafafafaff");
|
||||
|
||||
if (props.showBut && !props.disabled) {
|
||||
const res = await tbGsxtZdryLxrsaveOrUpdateLxr(params)
|
||||
console.log(res, "联系人增加res");
|
||||
|
||||
// if (type) {
|
||||
|
||||
// if (res.code == 200) {
|
||||
// gettbZdryClxxSelectPage()
|
||||
// proxy.$message({
|
||||
// message: '密切联系人添加成功',
|
||||
// type: 'success'
|
||||
// })
|
||||
// } else {
|
||||
// proxy.$message({
|
||||
// message: '密切联系人添加失败',
|
||||
// type: 'error'
|
||||
// })
|
||||
// }
|
||||
|
||||
|
||||
// } else {
|
||||
// if (res.code == 200) {
|
||||
// gettbZdryClxxSelectPage()
|
||||
// proxy.$message({
|
||||
// message: '密切联系人添加成功',
|
||||
// type: 'success'
|
||||
// })
|
||||
// } else {
|
||||
// proxy.$message({
|
||||
// message: '密切联系人添加失败',
|
||||
// type: 'error'
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
|
||||
} else {
|
||||
pageData.tableData.push(val)
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
// console.log(identityCardRule,"dadad1");
|
||||
|
||||
})
|
||||
// 删除车辆
|
||||
const delDictItem = (val) => {
|
||||
if (!props.disabled && props.showBut) {
|
||||
ElMessageBox.confirm(
|
||||
'是否删除关联车辆',
|
||||
'提示',
|
||||
{
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
tbZdryClxxDelete({ ids: [val] }).then(res => {
|
||||
gettbZdryClxxSelectPage()
|
||||
proxy.$message({
|
||||
message: '关联车辆删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
})
|
||||
})
|
||||
.catch(() => {
|
||||
ElMessage({
|
||||
type: 'info',
|
||||
message: '取消删除',
|
||||
})
|
||||
})
|
||||
} else {
|
||||
pageData.tableData = pageData.tableData.filter(v => v.id != val)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
const updDictItem = (val) => {
|
||||
chooseMarksVisible.value = true
|
||||
addUpd.value = false
|
||||
dataModel.value = val
|
||||
}
|
||||
const AddPore = () => {
|
||||
chooseMarksVisible.value = true
|
||||
dataModel.value = {}
|
||||
addUpd.value = true
|
||||
}
|
||||
// 初始化密切联系人
|
||||
const gettbZdryClxxSelectPage = () => {
|
||||
const promes = {
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
zdrid: listData.value.id
|
||||
...val,
|
||||
zdryId: listData.value.id
|
||||
}
|
||||
tbGsxtZdryLxrselectLxrBy(promes).then(res => {
|
||||
tbGsxtZdryLxrsaveOrUpdateLxr(promes).then((res) => {
|
||||
proxy.$message({
|
||||
message: '操作成功',
|
||||
type: 'success'
|
||||
})
|
||||
getContact()
|
||||
}).catch((err) => {
|
||||
proxy.$message({
|
||||
message: '操作失败',
|
||||
type: 'error'
|
||||
})
|
||||
});
|
||||
}
|
||||
const delDictItem = (val) => {
|
||||
ElMessageBox.confirm(
|
||||
'是否删除该联系人',
|
||||
'提示',
|
||||
{
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
|
||||
tbGsxtZdryLxr(val).then((res) => {
|
||||
proxy.$message({
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
getContact()
|
||||
}).catch((err) => {
|
||||
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
proxy.$message({
|
||||
message: '删除失败',
|
||||
type: 'info',
|
||||
})
|
||||
})
|
||||
}
|
||||
const getContact = () => {
|
||||
const promes = { zdryId: listData.value.id }
|
||||
tbGsxtZdryLxrselectLxrBy(promes).then((res) => {
|
||||
pageData.tableData = res
|
||||
console.log(pageData.tableData, "表格原生数据");
|
||||
|
||||
})
|
||||
}
|
||||
const resetForm = () => {
|
||||
formData.value = {}
|
||||
getContact()
|
||||
}
|
||||
const check = () => {
|
||||
if (formData.value.rySfzh) {
|
||||
// 模糊查询：检查身份证号码是否包含输入的内容
|
||||
pageData.tableData = pageData.tableData.filter(item => item.rySfzh && item.rySfzh.includes(formData.value.rySfzh))
|
||||
} else {
|
||||
// 如果输入为空，显示所有数据
|
||||
getContact()
|
||||
}
|
||||
}
|
||||
|
||||
// 抛出数据并验证标签列表不为空
|
||||
const throwData = () => {
|
||||
return new Promise((resolve) => {
|
||||
@ -335,7 +243,9 @@ defineExpose({
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 2px solid #409eff;
|
||||
position: relative;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.headSelect {
|
||||
|
||||
Reference in New Issue
Block a user