更新
This commit is contained in:
@ -1,168 +1,57 @@
|
||||
<template>
|
||||
<el-form
|
||||
ref="elform"
|
||||
:model="listQuery"
|
||||
:label-width="props.labelWidth"
|
||||
:rules="props.rules"
|
||||
:inline="props.inline"
|
||||
label-position="right"
|
||||
:disabled="props.disabled"
|
||||
>
|
||||
<el-form-item
|
||||
v-for="(item,idx) in props.formList"
|
||||
:style="item.width && { width: item.width }"
|
||||
:prop="item.prop"
|
||||
:label="item.label"
|
||||
:label-width="item.labelWidth"
|
||||
:key="idx"
|
||||
>
|
||||
<el-form ref="elform" :model="listQuery" :label-width="props.labelWidth" :rules="props.rules" :inline="props.inline"
|
||||
label-position="right" :disabled="props.disabled">
|
||||
<el-form-item v-for="(item, idx) in props.formList" :style="item.width && { width: item.width }" :prop="item.prop"
|
||||
:label="item.label" :label-width="item.labelWidth" :key="idx">
|
||||
<!-- input表单 input-->
|
||||
<MOSTY.Other
|
||||
v-if="item.type == 'input'"
|
||||
width="100%"
|
||||
clearable
|
||||
v-model="listQuery[item.prop]"
|
||||
:placeholder="`请输入${item.label}`"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<el-input
|
||||
v-model="listQuery[item.prop]"
|
||||
v-else-if="item.type == 'textarea'"
|
||||
type="textarea"
|
||||
:rows="3"
|
||||
:placeholder="`请输入${item.label}`"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<MOSTY.Other v-if="item.type == 'input'" width="100%" clearable v-model="listQuery[item.prop]"
|
||||
:placeholder="`请输入${item.label}`" :disabled="item.disabled" />
|
||||
<el-input v-model="listQuery[item.prop]" v-else-if="item.type == 'textarea'" type="textarea" :rows="3"
|
||||
:placeholder="`请输入${item.label}`" :disabled="item.disabled" />
|
||||
<!-- 数值 inputNumber-->
|
||||
<el-input
|
||||
type="number"
|
||||
v-model="listQuery[item.prop]"
|
||||
v-else-if="item.type == 'inputNumber'"
|
||||
:placeholder="`请输入${item.label}`"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<el-input type="number" v-model="listQuery[item.prop]" v-else-if="item.type == 'inputNumber'"
|
||||
:placeholder="`请输入${item.label}`" :disabled="item.disabled" />
|
||||
<!-- 数值 number-->
|
||||
<el-input-number
|
||||
v-model="listQuery[item.prop]"
|
||||
v-else-if="item.type == 'number'"
|
||||
style="width: 100%"
|
||||
:min="item.min || 0"
|
||||
:max="item.max || 1000"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<el-input-number v-model="listQuery[item.prop]" v-else-if="item.type == 'number'" style="width: 100%"
|
||||
:min="item.min || 0" :max="item.max || 1000" :disabled="item.disabled" />
|
||||
<!--选择 select-->
|
||||
<MOSTY.Select
|
||||
v-else-if="item.type == 'select'"
|
||||
filterable
|
||||
:multiple="item.multiple"
|
||||
v-model="listQuery[item.prop]"
|
||||
:dictEnum="item.options"
|
||||
width="100%"
|
||||
clearable
|
||||
:placeholder="`请选择${item.label}`"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<MOSTY.Select v-else-if="item.type == 'select'" filterable :multiple="item.multiple"
|
||||
v-model="listQuery[item.prop]" :dictEnum="item.options" width="100%" clearable :placeholder="`请选择${item.label}`"
|
||||
:disabled="item.disabled" />
|
||||
<!-- 部门department -->
|
||||
<template v-else-if="item.type === 'department'">
|
||||
<MOSTY.Department
|
||||
style="width: 100%;"
|
||||
clearable
|
||||
:isAll="item.isAll"
|
||||
@getDepValue="getdep($event,item.depMc)"
|
||||
v-model="listQuery[item.prop]"
|
||||
:placeholder="listQuery[item.depMc] ? listQuery[item.depMc]:'请选择'" />
|
||||
<MOSTY.Department style="width: 100%;" clearable :isAll="item.isAll" @getDepValue="getdep($event, item.depMc)"
|
||||
:placeholder="listQuery[item.depMc] || '请选择'" v-model="listQuery[item.prop]" />
|
||||
</template>
|
||||
|
||||
<!-- 上传 upload -->
|
||||
<MOSTY.Upload
|
||||
v-else-if="item.type == 'upload'"
|
||||
width="100%"
|
||||
v-model="listQuery[item.prop]"
|
||||
:isImg="item.isImg"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<MOSTY.Upload v-else-if="item.type == 'upload'" width="100%" v-model="listQuery[item.prop]" :isImg="item.isImg"
|
||||
:disabled="item.disabled" />
|
||||
<!--选择checkbox -->
|
||||
<MOSTY.CheckBox
|
||||
v-else-if="item.type == 'checkbox'"
|
||||
width="100%"
|
||||
clearable
|
||||
v-model="listQuery[item.prop]"
|
||||
:checkList="item.options"
|
||||
:placeholder="`请选择${item.label}`"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<MOSTY.CheckBox v-else-if="item.type == 'checkbox'" width="100%" clearable v-model="listQuery[item.prop]"
|
||||
:checkList="item.options" :placeholder="`请选择${item.label}`" :disabled="item.disabled" />
|
||||
|
||||
<!-- 单选radio -->
|
||||
<el-radio-group
|
||||
v-model="listQuery[item.prop]"
|
||||
v-else-if="item.type == 'radio'"
|
||||
:disabled="item.disabled"
|
||||
>
|
||||
<el-radio
|
||||
v-for="obj in item.options"
|
||||
:key="obj.value"
|
||||
:label="obj.value"
|
||||
>{{ obj.label }}</el-radio
|
||||
>
|
||||
<el-radio-group v-model="listQuery[item.prop]" v-else-if="item.type == 'radio'" :disabled="item.disabled">
|
||||
<el-radio v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
|
||||
<!-- 时间选择 -->
|
||||
<el-time-picker
|
||||
v-else-if="item.type == 'time'"
|
||||
v-model="listQuery[item.prop]"
|
||||
placeholder="选择时间"
|
||||
style="width: 100%"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-else-if="item.type == 'date'"
|
||||
v-model="listQuery[item.prop]"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="请选择日期"
|
||||
style="width: 100%"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-else-if="item.type == 'datetime'"
|
||||
v-model="listQuery[item.prop]"
|
||||
type="datetime"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
placeholder="请选择时间"
|
||||
style="width: 100%"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-else-if="item.type == 'datetimerange'"
|
||||
v-model="listQuery[item.prop]"
|
||||
type="datetimerange"
|
||||
:shortcuts="shortcuts"
|
||||
range-separator="To"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
start-placeholder="选择开始时间"
|
||||
end-placeholder="选择结束时间"
|
||||
style="width: 100%"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<el-date-picker
|
||||
v-else-if="item.type == 'daterange'"
|
||||
v-model="listQuery[item.prop]"
|
||||
type="daterange"
|
||||
range-separator="To"
|
||||
value-format="YYYY-MM-DD"
|
||||
start-placeholder="选择开始日期"
|
||||
end-placeholder="选择开始日期"
|
||||
style="width: 100%"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
<el-time-picker v-else-if="item.type == 'time'" v-model="listQuery[item.prop]" placeholder="选择时间"
|
||||
style="width: 100%" :disabled="item.disabled" />
|
||||
<el-date-picker v-else-if="item.type == 'date'" v-model="listQuery[item.prop]" type="date"
|
||||
value-format="YYYY-MM-DD" placeholder="请选择日期" style="width: 100%" :disabled="item.disabled" />
|
||||
<el-date-picker v-else-if="item.type == 'datetime'" v-model="listQuery[item.prop]" type="datetime"
|
||||
value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择时间" style="width: 100%" :disabled="item.disabled" />
|
||||
<el-date-picker v-else-if="item.type == 'datetimerange'" v-model="listQuery[item.prop]" type="datetimerange"
|
||||
:shortcuts="shortcuts" range-separator="To" value-format="YYYY-MM-DD HH:mm:ss" start-placeholder="选择开始时间"
|
||||
end-placeholder="选择结束时间" style="width: 100%" :disabled="item.disabled" />
|
||||
<el-date-picker v-else-if="item.type == 'daterange'" v-model="listQuery[item.prop]" type="daterange"
|
||||
range-separator="To" value-format="YYYY-MM-DD" start-placeholder="选择开始日期" end-placeholder="选择开始日期"
|
||||
style="width: 100%" :disabled="item.disabled" />
|
||||
|
||||
<el-switch
|
||||
v-else-if="item.type == 'switch'"
|
||||
v-model="listQuery[item.prop]"
|
||||
class="ml-2"
|
||||
:disabled="item.disabled"
|
||||
style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
|
||||
/>
|
||||
<el-switch v-else-if="item.type == 'switch'" v-model="listQuery[item.prop]" class="ml-2" :disabled="item.disabled"
|
||||
style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949" />
|
||||
|
||||
<template v-else-if="item.type === 'slot'">
|
||||
<slot :name="item.prop"></slot>
|
||||
@ -191,13 +80,13 @@ const props = defineProps({
|
||||
type: Object,
|
||||
default: {}
|
||||
},
|
||||
inline:{
|
||||
type:Boolean,
|
||||
default:true
|
||||
inline: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
disabled:{
|
||||
type:Boolean,
|
||||
default:false
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
});
|
||||
const elform = ref();
|
||||
@ -211,23 +100,23 @@ const submit = (resfun) => {
|
||||
});
|
||||
};
|
||||
|
||||
const getdep = (e,val) =>{
|
||||
if(val)listQuery.value[val] = e ? e.orgName : '';
|
||||
const getdep = (e, val) => {
|
||||
if (val) listQuery.value[val] = e ? e.orgName : '';
|
||||
}
|
||||
const reset = () =>{
|
||||
const reset = () => {
|
||||
elform.value.resetFields()
|
||||
}
|
||||
|
||||
// 修改这里的watch逻辑，避免无限循环
|
||||
let isUpdatingFromProps = false;
|
||||
|
||||
watch(() => listQuery.value,(newVal) => {
|
||||
if(newVal && !isUpdatingFromProps) {
|
||||
watch(() => listQuery.value, (newVal) => {
|
||||
if (newVal && !isUpdatingFromProps) {
|
||||
emits("update:modelValue", newVal);
|
||||
}
|
||||
},{ deep: true });
|
||||
}, { deep: true });
|
||||
|
||||
watch(() => props.modelValue,(newVal) => {
|
||||
watch(() => props.modelValue, (newVal) => {
|
||||
// 只有在新值确实变化时才更新（避免空值覆盖）
|
||||
if (newVal && Object.keys(newVal).length > 0) {
|
||||
isUpdatingFromProps = true;
|
||||
@ -236,7 +125,7 @@ watch(() => props.modelValue,(newVal) => {
|
||||
isUpdatingFromProps = false;
|
||||
}, 0);
|
||||
}
|
||||
},{ immediate: true, deep: true });
|
||||
}, { immediate: true, deep: true });
|
||||
|
||||
defineExpose({ submit,reset });
|
||||
defineExpose({ submit, reset });
|
||||
</script>
|
||||
|
||||
@ -1,182 +0,0 @@
|
||||
<template>
|
||||
<!-- 弹框 -->
|
||||
<el-dialog v-model="dialogVisible" title="智能解析数据" width="80vw">
|
||||
<div class="infoCnt">
|
||||
<div class="baseInfo">
|
||||
<div v-for="(item, index) in tableData" :key="index" >
|
||||
发掘文本{{ index + 1 }}:<span class="text-danger">{{ item.nr }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<MyTable
|
||||
:tableData="pageData.dtoList"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
:tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount"
|
||||
:tableConfiger="pageData.tableConfiger"
|
||||
:controlsWidth="pageData.controlsWidth"
|
||||
:row-class-name="({ row }) => (row.status ? '' : 'row-deleted')"
|
||||
>
|
||||
<!-- 管辖单位 -->
|
||||
<template #gxDwDm="{ row }">
|
||||
<el-select
|
||||
v-model="row.gxDwDm"
|
||||
placeholder="请选择管辖单位"
|
||||
style="width: 130px"
|
||||
@change="handleDeptChange('gxDwMc', $event, row)"
|
||||
:disabled="!row.status"
|
||||
>
|
||||
<el-option v-for="item in deptList" :key="item.value" :label="item.label" :value="item.value.toString()"/>
|
||||
</el-select>
|
||||
</template>
|
||||
<!-- 是否关注 -->
|
||||
<template #sfGz="{ row }">
|
||||
<el-radio-group v-model="row.sfGz">
|
||||
<el-radio v-for="(item, index) in D_BZ_SF" size="large" :key="index" :label="item.zdmc || item.label" :value="item.dm || item.value"></el-radio>
|
||||
</el-radio-group>
|
||||
</template>
|
||||
<!-- 管辖单位 -->
|
||||
<template #ryFjZp="{ row }"> 照片上传 </template>
|
||||
<template :key="idx" v-for="(item,idx) in pageData.tableColumn.filter((col) => !['gxDwDm', 'sfGz', 'ryFjZp'].includes(col.prop) )" #[item.prop]="{ row }">
|
||||
<el-input style="width: 100px" v-model="row[item.prop]" :placeholder="'请输入' + item.label" :disabled="!row.status" />
|
||||
</template>
|
||||
<!-- 操作列 -->
|
||||
<template #controls="{ row, $index }">
|
||||
<el-link v-if="row.status" type="danger" @click="delDictItem($index)">删除</el-link>
|
||||
<el-link v-else type="primary" @click="recover($index)"> 恢复 </el-link>
|
||||
</template>
|
||||
</MyTable>
|
||||
<div class="stats">
|
||||
共 {{ pageData.dtoList.length }} 条数据， 其中
|
||||
{{ pageData.dtoList.filter((x) => !x.status).length }} 条已标记删除
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="submitData"> 确定 </el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
||||
import { reactive, ref, defineEmits,onMounted, getCurrentInstance, defineExpose } from "vue";
|
||||
import { selectUserDeptPage } from "@/api/user-manage";
|
||||
import { ElMessage } from "element-plus";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_SF } = proxy.$dict("D_BZ_SF"); //获取字典数据
|
||||
const props = defineProps({
|
||||
tableData: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
});
|
||||
const emit = defineEmits(['upadate'])
|
||||
const dialogVisible = ref(false);
|
||||
const pageData = reactive({
|
||||
dtoList: [],
|
||||
keyCount: 0,
|
||||
tableConfiger: {
|
||||
rowHieght: 61,
|
||||
showSelectType: "checkBox",
|
||||
loading: false
|
||||
},
|
||||
tableHeight: 330,
|
||||
total: 0,
|
||||
pageConfiger: {
|
||||
pageSize: 20,
|
||||
pageCurrent: 1
|
||||
},
|
||||
controlsWidth: 80,
|
||||
tableColumn: [
|
||||
{ label: "管辖单位", prop: "gxDwDm", showSolt: true, width: 200 },
|
||||
{ label: "姓名", prop: "ryXm", showSolt: true, width: 130 },
|
||||
{ label: "手机号码", prop: "rySjhm", showSolt: true, width: 130 },
|
||||
{ label: "身份证号码", prop: "rySfzh", showSolt: true, width: 130 },
|
||||
{ label: "户籍地址", prop: "ryHjdz", showSolt: true, width: 130 },
|
||||
{ label: "护照号码", prop: "ryHzhm", showSolt: true, width: 130 },
|
||||
{ label: "现住地址", prop: "ryXzdz", showSolt: true, width: 130 },
|
||||
{ label: "银行卡号", prop: "ryYhkh", showSolt: true, width: 130 },
|
||||
{ label: "是否关注", prop: "sfGz", showSolt: true, width: 130 },
|
||||
{ label: "附件照片", prop: "ryFjZp", showSolt: true, width: 130 }
|
||||
]
|
||||
});
|
||||
const deptList = ref([]); //部门列表
|
||||
onMounted(() => {
|
||||
getdepartmentList();
|
||||
});
|
||||
// 获取部门列表
|
||||
const getdepartmentList = () => {
|
||||
selectUserDeptPage().then((res) => {
|
||||
deptList.value = res?.records.map((item) => ({
|
||||
label: item.deptName,
|
||||
value: item.deptId
|
||||
}));
|
||||
});
|
||||
};
|
||||
const handleDeptChange = (nameField, selectedValue, row) => {
|
||||
// 找到选中的部门
|
||||
const selectedDept = deptList.value.find((item) => item.value.toString() === selectedValue);
|
||||
// 更新名称
|
||||
row[nameField] = selectedDept ? selectedDept.label : "";
|
||||
};
|
||||
const init = () => {
|
||||
dialogVisible.value = true;
|
||||
qcckGet({}, "/mosty-gsxt/tbGsxtRqfjRy/createCbfj").then((res) => {
|
||||
pageData.dtoList = res.map((item) => ({ ...item, status: true }));
|
||||
}).catch(() => {
|
||||
pageData.tableConfiger.loading = false;
|
||||
});
|
||||
};
|
||||
// 删除方法
|
||||
const delDictItem = (index) => {
|
||||
pageData.dtoList[index].status = false;
|
||||
ElMessage.success("已标记为删除");
|
||||
};
|
||||
// 恢复方法
|
||||
const recover = (index) => {
|
||||
pageData.dtoList[index].status = true;
|
||||
ElMessage.success("已恢复");
|
||||
};
|
||||
// 提交
|
||||
const submitData = () => {
|
||||
const validData = pageData.dtoList.filter((item) => item.status);
|
||||
qcckPost(validData, "/mosty-gsxt/tbGsxtRqfjRy/saveList").then((res) => {
|
||||
ElMessage.success("新增成功");
|
||||
dialogVisible.value = false;
|
||||
emit("upadate");
|
||||
close();
|
||||
})
|
||||
};
|
||||
|
||||
defineExpose({ init });
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
/* 为已删除的行添加特殊样式 */
|
||||
.el-table .row-deleted {
|
||||
background-color: #fef0f0;
|
||||
color: #f56c6c;
|
||||
}
|
||||
|
||||
|
||||
.infoCnt{
|
||||
height: 63vh;
|
||||
}
|
||||
.baseInfo{
|
||||
font-size: 16px;
|
||||
max-height: 230px;
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
line-height: 24px;
|
||||
color: #000;
|
||||
font-weight: 600;
|
||||
letter-spacing: 1px;
|
||||
.text-danger {
|
||||
color: #333;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -92,7 +92,6 @@
|
||||
|
||||
<script setup>
|
||||
import ListDialog from './components/listDialog.vue'
|
||||
import { download } from "@/utils/request";
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
@ -238,13 +237,11 @@ const chooseType = (val) => {
|
||||
isShow.value = true;
|
||||
break;
|
||||
case "导出":
|
||||
// download("/mosty-api/mosty-gsxt/tbGsxtRqfjRy/exportRyfjFxjg", {"bkBt":"1"},`模型智能识别/LP解析结果_${new Date().getTime()}.xlsx`);
|
||||
window.open('/mosty-api/mosty-gsxt/tbGsxtRqfjRy/exportRyfjFxjg','_self')
|
||||
break;
|
||||
case "批量删除":
|
||||
if (ids.value.length == 0) return ElMessage.warning("请选择对应删除的数据");
|
||||
ids.value.forEach((id) => {
|
||||
deleteRowBottom(id);
|
||||
});
|
||||
ids.value.forEach((id) => { deleteRowBottom(id); });
|
||||
break;
|
||||
}
|
||||
};
|
||||
@ -270,7 +267,6 @@ const updateDate = (val) =>{
|
||||
|
||||
const handelSub = (val) =>{
|
||||
pageData.tableData = val;
|
||||
|
||||
}
|
||||
|
||||
// 智能解析
|
||||
|
||||
@ -215,7 +215,6 @@ const delDictItem = (id) =>{
|
||||
// 导出
|
||||
const exportFile = () =>{
|
||||
window.open('/mosty-api/mosty-gsxt/qbcj/exportQbsjcjDc?cjLx=1','_self')
|
||||
// download("/mosty-api/mosty-gsxt/qbcj/exportQbsjcjDc",{},`情报采集流转_${new Date().getTime()}.xlsx`);
|
||||
}
|
||||
|
||||
// 详情
|
||||
|
||||
Reference in New Issue
Block a user