This commit is contained in:
lcw
2025-12-10 21:46:34 +08:00
parent ab73675b23
commit a19d69453f
55 changed files with 1124 additions and 225 deletions

View File

@ -10,41 +10,111 @@
<div class="form-container">
<div class="form-content" v-loading="loading">
<!-- <div class="form_cnt"> -->
<FormMessage :disabled="disabled" v-model="listQuery" :formList="formData" ref="elform" :rules="rules">
</FormMessage>
<FormMessage :disabled="disabled" v-model="listQuery" :formList="formData" ref="elform" :rules="rules">
</FormMessage>
<!-- </div> -->
</div>
<div class="ml50 mr50 timeline-container" v-if="disabled">
<div class="timeline-title">信息流程展示</div>
<el-timeline class="timeline-full-width">
<el-timeline-item :timestamp="item.czsj" placement="top" v-for="(item, index) in lcList" :key="index">
<el-card class="process-card">
<div class="process-info">
<div class="info-label">处置人</div>
<div class="info-value">{{ item.czrxm || '未记录' }}</div>
</div>
<div class="process-info">
<div class="info-label">处置结果</div>
<div class="info-value">
<DictTag :tag="false" :value="item.czzt" :options="dict.D_BZ_QBCZZT" />
</div>
</div>
</el-card>
</el-timeline-item>
</el-timeline>
<MOSTY.Empty :show="lcList.length == 0" :imgSize="100"></MOSTY.Empty>
<div class="tags-section" v-if="disabled">
<h3 class="tags-title">关注部门</h3>
<div class="tags-container">
<div v-for="(tag, index) in listQuery.gzbmList" :key="tag.id || index" class="tag-item">
<div class="tag-content">
{{ tag.ssbm }}
</div>
</div>
<span v-if="!listQuery.gzbmList || listQuery.gzbmList.length === 0" class="no-tags">
暂无标签
</span>
</div>
</div>
<div class="tags-section" v-if="disabled">
<h3 class="tags-title">关联标签</h3>
<div class="tags-container">
<div v-for="(tag, index) in listQuery.glbqList" :key="tag.id || index" class="tag-item">
<div class="tag-content">
{{ tag.bqmc }}
</div>
</div>
<span v-if="!listQuery.glbqList || listQuery.glbqList.length === 0" class="no-tags">
暂无标签
</span>
</div>
</div>
<div class="tags-section" v-if="disabled">
<h3 class="tags-title">续保信息</h3>
<div class="list-container">
<div v-for="(item, index) in dataList.xb" :key="item.id || index" class="list-item">
<div class="list-content">
{{ item.bcnr }}
</div>
<div class="tag-actions">
<el-icon class="action-icon edit-icon" :size="32" @click="openPursue('续保信息', item)">
<EditPen />
</el-icon>
<el-icon class="action-icon delete-icon" :size="32" @click="handleDeleteTag(item)">
<Delete />
</el-icon>
</div>
</div>
<span v-if="!dataList.xb || dataList.xb.length === 0" class="no-tags">
暂无标签
</span>
</div>
</div>
<div class="tags-section" v-if="disabled">
<h3 class="tags-title">补充信息</h3>
<div class="list-container">
<div v-for="(item, index) in dataList.bc" :key="item.id || index" class="list-item">
<div class="list-content">
{{ item.bcnr }}
</div>
<div class="tag-actions">
<el-icon class="action-icon edit-icon" :size="32" @click="openPursue('信息追加', item)">
<EditPen />
</el-icon>
<el-icon class="action-icon delete-icon" :size="32" @click="handleDeleteTag(item)">
<Delete />
</el-icon>
</div>
</div>
<span v-if="!dataList.bc || dataList.bc.length === 0" class="no-tags">
暂无标签
</span>
</div>
</div>
</div>
<div class="ml50 mr50 timeline-container" v-if="disabled">
<div class="timeline-title">信息流程展示</div>
<el-timeline class="timeline-full-width">
<el-timeline-item :timestamp="item.czsj" placement="top" v-for="(item, index) in lcList" :key="index">
<el-card class="process-card">
<div class="process-info">
<div class="info-label">处置人</div>
<div class="info-value">{{ item.czrxm || '未记录' }}</div>
</div>
<div class="process-info">
<div class="info-label">处置结果</div>
<div class="info-value">
<DictTag :tag="false" :value="item.czzt" :options="dict.D_BZ_QBCZZT" />
</div>
</div>
</el-card>
</el-timeline-item>
</el-timeline>
<MOSTY.Empty :show="lcList.length == 0" :imgSize="100"></MOSTY.Empty>
</div>
</div>
</div>
<pursueContent v-model="pursueShow" :dataList="dataVals" :title="processtitle" :updeteBool="true" />
</template>
<script setup>
import FormMessage from "@/components/aboutTable/FormMessage.vue";
import { qbcjAdd, qbcjUpdate, qbcjSelectByid } from "@/api/Intelligence.js";
import {xxcjAddEntity,xxcjUpdateEntity,xxcjSelectByid,xxcjSelectCzlcList} from "@/api/xxcj.js"
import { ref, defineExpose, onMounted, defineEmits, watch, getCurrentInstance } from "vue";
import { xxcjAddEntity, xxcjUpdateEntity, xxcjSelectByid, xxcjSelectCzlcList, xxcjSelectListBc, xxcjDeletesBc } from "@/api/xxcj.js"
import { EditPen, Delete } from '@element-plus/icons-vue'
import { ref, defineExpose, onMounted, defineEmits, watch, getCurrentInstance } from "vue"
import { ElMessage } from 'element-plus';
import { useRoute, useRouter } from 'vue-router'
import { qbcjCzztList, qbcjCzztDelete } from '@/api/qbcj'
import pursueContent from "@/views/backOfficeSystem/HumanIntelligence/components/pursueContent.vue";
import * as MOSTY from "@/components/MyComponents/index";
const { proxy } = getCurrentInstance()
const emit = defineEmits(["getList"]);
@ -81,7 +151,6 @@ const listQuery = ref({}); //表单
const elform = ref();
onMounted(() => {
})
const addForm = ref()
const msgeDat = ref()
const title = ref("")
const showPj = ref(false)
@ -96,6 +165,8 @@ const init = (type, row) => {
showPj.value = true
msgeDat.value = row
getqbcjPldb(row.id)
getxxcjSelectListBc(row.id, '01')
getxxcjSelectListBc(row.id, '02')
// 初始化表单数据,并根据详情页设置禁用状态
if (row) getDataById(row.id);
// getqbcjCzztList()
@ -108,8 +179,8 @@ const getDataById = (id) => {
xxcjSelectByid({ id }).then((res) => {
console.log(res);
lcList.value = res.czlcList || []
listQuery.value = res;
listQuery.value.fjdz=res.fjdz?res.fjdz?.split(","):[]
listQuery.value = res;
listQuery.value.fjdz = res.fjdz ? res.fjdz?.split(",") : []
});
};
@ -121,7 +192,9 @@ const submitForm = () => {
if (valid) {
const promes = {
...listQuery.value,
fjdz: listQuery.value.fjdz&&listQuery.value.fjdz.length > 0 ? listQuery.value.fjdz.join(',') : '',
fjdz: listQuery.value.fjdz && listQuery.value.fjdz.length > 0 ? listQuery.value.fjdz.map(item => {
return item.id
}).join(',') : '',
qbly: 0,
}
if (title.value == '新增') {
@ -152,7 +225,7 @@ const close = () => {
router.replace({ query });
}
fjdz.value = []
lcList.value=[]
lcList.value = []
listQuery.value = {};
dialogForm.value = false;
loading.value = false;
@ -166,6 +239,50 @@ const getqbcjPldb = (id) => {
.catch(() => {
})
}
//
const dataList = ref({
xb: [],
bc: [],
})
const getxxcjSelectListBc = (id, lx) => {
xxcjSelectListBc({ qbid: id, czlx: lx }).then(res => {
if (lx == '01') {
dataList.value.xb = res || []
} else {
dataList.value.bc = res || []
}
})
}
// 处理标签删除
const handleDeleteTag = (tag) => {
proxy.$confirm("确定要删除吗?", "警告", { type: "warning" }).then(() => {
xxcjDeletesBc({ ids: [tag.id] }).then(res => {
ElMessage({
message: '删除成功',
type: 'success',
showClose: true,
})
getxxcjSelectListBc(msgeDat.value.id, '01')
getxxcjSelectListBc(msgeDat.value.id, '02')
})
})
}
//
const pursueShow = ref(false)
const dataVals = ref([])
const processtitle = ref()
const openPursue = (title, data) => {
console.log(title, data);
pursueShow.value = true
processtitle.value = title
dataVals.value = data
}
defineExpose({ init });
</script>
@ -256,7 +373,7 @@ defineExpose({ init });
}
.action-icon {
font-size: 16px;
// font-size: 24px;
cursor: pointer;
transition: all 0.3s ease;
}
@ -362,7 +479,7 @@ defineExpose({ init });
}
.form-content {
display: flex;
// display: flex;
width: 80%;
}
@ -376,4 +493,144 @@ defineExpose({ init });
.timeline-full-width {
width: 100%;
}
/* 标签区域样式 */
.tags-section {
margin-top: 20px;
}
/* 标签标题样式 */
.tags-title {
font-size: 14px;
font-weight: 600;
color: #303133;
margin-bottom: 8px;
padding-left: 5px;
border-left: 3px solid #409EFF;
}
/* 标签容器样式 */
.tags-container {
padding: 12px;
background-color: #f5f7fa;
border-radius: 4px;
display: flex;
flex-wrap: wrap;
gap: 12px;
align-items: center;
}
/* 标签项目样式 */
.tag-item {
display: flex;
align-items: center;
gap: 6px;
padding: 6px 10px;
background-color: #ecf5ff;
border-radius: 4px;
border: 1px solid #d9ecff;
transition: all 0.3s ease;
}
/* 标签项目悬停效果 */
.tag-item:hover {
background-color: #e6f7ff;
border-color: #91d5ff;
box-shadow: 0 2px 8px rgba(0, 123, 255, 0.15);
}
/* 标签内容样式 */
.tag-content {
margin: 0;
font-size: 14px;
color: #303133;
font-weight: 500;
}
/* 标签操作按钮样式 */
.tag-actions {
display: flex;
// align-items: flex-start;
gap: 8px;
}
/* 操作图标样式 */
.action-icon {
font-size: 18px;
cursor: pointer;
transition: all 0.3s ease;
padding: 6px 8px;
border-radius: 4px;
display: inline-flex;
align-items: center;
justify-content: center;
}
/* 编辑图标样式 */
.edit-icon {
color: #409EFF;
background-color: #ecf5ff;
}
.edit-icon:hover {
color: #66B1FF;
background-color: #e6f7ff;
transform: scale(1.05);
box-shadow: 0 2px 4px rgba(64, 158, 255, 0.2);
}
/* 列表容器样式 */
.list-container {
padding: 12px;
background-color: #f5f7fa;
border-radius: 4px;
}
/* 列表项样式 */
.list-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 12px;
background-color: #ffffff;
border-radius: 4px;
margin-bottom: 8px;
border: 1px solid #e4e7ed;
transition: all 0.3s ease;
}
/* 列表项悬停效果 */
.list-item:hover {
background-color: #f5f7fa;
border-color: #dcdfe6;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
/* 列表内容样式 */
.list-content {
margin: 0;
font-size: 14px;
color: #303133;
font-weight: 500;
}
/* 删除图标样式 */
.delete-icon {
color: #F56C6C;
background-color: #fef0f0;
}
.delete-icon:hover {
color: #F78989;
background-color: #fde2e2;
transform: scale(1.05);
box-shadow: 0 2px 4px rgba(245, 108, 108, 0.2);
}
/* 无标签提示样式 */
.no-tags {
color: #909399;
font-size: 14px;
font-style: italic;
}
</style>