feat:更细一次
This commit is contained in:
@ -0,0 +1,83 @@
|
|||||||
|
<template>
|
||||||
|
<div class="dialog" v-if="dialogForm">
|
||||||
|
<div class="head_box">
|
||||||
|
<span class="title">积分排名{{ title }} </span>
|
||||||
|
<div>
|
||||||
|
<el-button size="small" @click="close">关闭</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form_cnt">
|
||||||
|
<FormMessage :formList="formData" v-model="listQuery" ref="elform">
|
||||||
|
</FormMessage>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
|
import { jfpmSelectList } from "@/api/yj.js";
|
||||||
|
|
||||||
|
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, watch } from "vue";
|
||||||
|
const emit = defineEmits(["updateDate"]);
|
||||||
|
const props = defineProps({
|
||||||
|
dict: {
|
||||||
|
type: Object,
|
||||||
|
default: () => { }
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
|
||||||
|
const dialogForm = ref(false);
|
||||||
|
const formData = ref([])
|
||||||
|
watch(() => props.dict, (res) => {
|
||||||
|
if (res) {
|
||||||
|
formData.value = [
|
||||||
|
{ label: "排名", prop: "pm", type: "input" },
|
||||||
|
{ label: "姓名", prop: "xm", type: "input" },
|
||||||
|
{ label: "部门", prop: "bm", type: "input" },
|
||||||
|
{ label: "积分", prop: "jf", type: "input", lx: "number" },
|
||||||
|
{ label: "身份类型", prop: "sflx", type: "input" },
|
||||||
|
{ label: "标签颜色", prop: "bqys", type: "select", options: props.dict.D_GS_SSYJ },
|
||||||
|
{ label: "处置状态", prop: "czzt", type: "select", options: props.dict.D_GSXT_YJXX_CZZT },
|
||||||
|
{ label: "所属部门", prop: "ssbm", type: "input" },
|
||||||
|
{ label: "所属县局", prop: "ssxgaj", type: "input" },
|
||||||
|
{ label: "所属市局", prop: "sssgaj", type: "input" },
|
||||||
|
{ label: "积分时间", prop: "jfsj", type: "input" },
|
||||||
|
{ label: "积分分值", prop: "jffz", type: "input", lx: "number" },
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}, { deep: true, immediate: true })
|
||||||
|
const listQuery = ref({});
|
||||||
|
const loading = ref(false);
|
||||||
|
const elform = ref();
|
||||||
|
const title = ref("详情");
|
||||||
|
const init = (type, row) => {
|
||||||
|
dialogForm.value = true;
|
||||||
|
jfpmSelectList(row.id).then(res => {
|
||||||
|
listQuery.value = {
|
||||||
|
...res,
|
||||||
|
|
||||||
|
jffz: res.jffz
|
||||||
|
}
|
||||||
|
})
|
||||||
|
};
|
||||||
|
// 关闭
|
||||||
|
const close = () => {
|
||||||
|
listQuery.value = {};
|
||||||
|
loading.value = false;
|
||||||
|
dialogForm.value = false;
|
||||||
|
listQuery.value = {}
|
||||||
|
};
|
||||||
|
|
||||||
|
defineExpose({ init });
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "~@/assets/css/layout.scss";
|
||||||
|
@import "~@/assets/css/element-plus.scss";
|
||||||
|
::v-deep {
|
||||||
|
.el-form-item__content {
|
||||||
|
align-items: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,57 @@
|
|||||||
|
<template>
|
||||||
|
<el-dialog :title="`积分详情(${pageData.tableData.length})`" v-model="dialogVisible" width="60%">
|
||||||
|
<MyTable
|
||||||
|
:tableData="pageData.tableData"
|
||||||
|
:tableColumn="pageData.tableColumn"
|
||||||
|
:tableHeight="pageData.tableHeight"
|
||||||
|
:key="pageData.keyCount"
|
||||||
|
:tableConfiger="pageData.tableConfiger"
|
||||||
|
>
|
||||||
|
</MyTable>
|
||||||
|
</el-dialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { qcckGet } from "@/api/qcckApi.js";
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import { ref , reactive , defineExpose} from 'vue'
|
||||||
|
const dialogVisible = ref(false)
|
||||||
|
const pageData = reactive({
|
||||||
|
tableData: [{jfbh:'JFBH-43',xm:'张三',bm:'刑侦支队',jf:'95',sflx:'重点人员',bqys:'红',czzt:'01',jfsj:'2023-08-24 15:00:00',jffz:'95'}], //表格数据
|
||||||
|
keyCount: 0,
|
||||||
|
tableConfiger: {
|
||||||
|
rowHieght: 61,
|
||||||
|
loading: false,
|
||||||
|
haveControls: false,
|
||||||
|
},
|
||||||
|
tableHeight:600,
|
||||||
|
total: 0,
|
||||||
|
pageConfiger: {
|
||||||
|
pageSize: 20,
|
||||||
|
pageCurrent: 1
|
||||||
|
}, //分页
|
||||||
|
tableColumn: [
|
||||||
|
{ label: "积分编号", prop: "jfbh"},
|
||||||
|
{ label: "积分时间", prop: "jfsj"},
|
||||||
|
{ label: "积分内容", prop: "jfnr"},
|
||||||
|
{ label: "积分分值", prop: "jffz"},
|
||||||
|
{ label: "积分类型", prop: "jflx"},
|
||||||
|
{ label: "操作员", prop: "czy"},
|
||||||
|
]
|
||||||
|
});
|
||||||
|
const init = (row) => {
|
||||||
|
dialogVisible.value = true;
|
||||||
|
pageData.tableConfiger.loading = true;
|
||||||
|
pageData.tableData = []
|
||||||
|
qcckGet({jfid:row.id},'/mosty-gsxt/jfpm/jfmx/selectList').then((res)=>{
|
||||||
|
pageData.tableData = res || [];
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
}).catch(()=>{
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
init
|
||||||
|
})
|
||||||
|
</script>
|
||||||
@ -0,0 +1,304 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="titleBox">
|
||||||
|
<PageTitle title="积分排名">
|
||||||
|
<el-button type="success" @click="openSearch">
|
||||||
|
<Search style="width: 1em; height: 1em; margin-right: 8px" />
|
||||||
|
<span style="vertical-align: middle" v-if="!search">搜索</span>
|
||||||
|
<span style="vertical-align: middle" v-else>关闭搜索</span>
|
||||||
|
</el-button>
|
||||||
|
</PageTitle>
|
||||||
|
</div>
|
||||||
|
<!-- 搜索 -->
|
||||||
|
<div ref="searchBox" v-if="search">
|
||||||
|
<Searchs :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
|
||||||
|
<template #defaultSlot>
|
||||||
|
<el-form-item label="预警类型" prop="yjlx">
|
||||||
|
<el-select v-model="listQuery.yjlx" placeholder="请选择预警类型">
|
||||||
|
<el-option v-for="item in D_BZ_YJLX" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<!-- <el-select @change="gettbGsxtBqglSelectList" v-model="queryFrom.sfdl" placeholder="请选择身份类型"
|
||||||
|
style="width: 100%">
|
||||||
|
<el-option :label="item.label" :value="item.value" v-for="(item, index) in bqLbData.bqDl" :key="index" />
|
||||||
|
</el-select> -->
|
||||||
|
</template>
|
||||||
|
<!-- <template #nameSlot>
|
||||||
|
<el-select v-model="queryFrom.sfxl" placeholder="请选择身份类型" style="width: 100%">
|
||||||
|
<el-option :label="item.label" :value="item.value" v-for="(item, index) in bqLbData.bqXl" :key="index" />
|
||||||
|
</el-select>
|
||||||
|
</template> -->
|
||||||
|
</Searchs>
|
||||||
|
</div>
|
||||||
|
<!-- 表格 -->
|
||||||
|
<div class="tabBox" :style="{ height: (pageData.tableHeight + 40) + 'px' }">
|
||||||
|
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||||
|
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||||
|
<template #sfcs="{ row }">
|
||||||
|
<span style="color: #0072ff;" @click="handleClick(row)">{{ row.sfcs }}</span>
|
||||||
|
</template>
|
||||||
|
<template #yjjb="{ row }">
|
||||||
|
<DictTag :value="row.yjjb" :tag="false" :color="bqYs(row.yjjb)" :options="D_BZ_YJJB" />
|
||||||
|
</template>
|
||||||
|
<template #yjlx="{ row }">
|
||||||
|
<DictTag :value="row.yjlx" :tag="false" :options="D_GS_ZDQT_YJLB" />
|
||||||
|
</template>
|
||||||
|
<template #yjlb="{ row }">
|
||||||
|
<DictTag :value="row.yjlb" :options="D_BZ_YJLX" />
|
||||||
|
</template>
|
||||||
|
<!-- <template #yjjb="{ row }">
|
||||||
|
<DictTag :value="row.yjjb" :tag="false" :color="bqYs(row.yjjb)" :options="D_BZ_YJJB" />
|
||||||
|
</template> -->
|
||||||
|
<template #yjtp="{ row }">
|
||||||
|
<template v-if="!row.yjtp || row.yjtp.includes('baidu')">
|
||||||
|
<img src="@/assets/images/car.png" width="30" height="30" />
|
||||||
|
</template>
|
||||||
|
<el-image style="width: 30px; height:30px" :src="row.yjtp" :preview-src-list="[row.yjtp]" show-progress>
|
||||||
|
<template #error>
|
||||||
|
<div class="image-slot error">
|
||||||
|
<img src="@/assets/images/car.png" width="30" height="30" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-image>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #hplx="{ row }">
|
||||||
|
<DictTag :value="row.hplx" :options="D_BZ_HPZL" />
|
||||||
|
</template>
|
||||||
|
<template #controls="{ row }">
|
||||||
|
<el-link type="success" @click="handleQsFk(row, '签收')" v-if="row.czzt == '01'">签收</el-link>
|
||||||
|
<!-- <el-link type="primary" @click="openAddFrom(row)">详情</el-link> -->
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
|
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
|
||||||
|
...pageData.pageConfiger,
|
||||||
|
total: pageData.total
|
||||||
|
}"></Pages>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- <Detail ref="detailRef" /> -->
|
||||||
|
<!-- <HolographicArchive v-model="assessShow" :dataList="dataList" /> -->
|
||||||
|
<!-- <FkDialog @change="getList" lx="03" /> -->
|
||||||
|
|
||||||
|
<!-- <AddFrom ref="addModelRef" :dict="{D_BZ_YJLX, D_BZ_YJJB,D_GS_SSYJ}"/> -->
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||||
|
import Searchs from "@/components/aboutTable/Search.vue";
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import Pages from "@/components/aboutTable/Pages.vue";
|
||||||
|
import DictTag from "@/components/DictTag/index.vue";
|
||||||
|
import { bqYs } from '@/utils/tools'
|
||||||
|
// import FkDialog from "@/views/backOfficeSystem/fourColorManage/warningControl/centerHome/components/fkDialog.vue";
|
||||||
|
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
|
||||||
|
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import { yjzxSfyjSelectList } from "@/api/yj.js";
|
||||||
|
import { tbGsxtBqglSelectList } from '@/api/zdr'
|
||||||
|
// import Detail from './components/detail.vue'
|
||||||
|
import { watch } from "vue";
|
||||||
|
import emitter from "@/utils/eventBus.js";
|
||||||
|
import { holographicProfileJump } from "@/utils/tools.js"
|
||||||
|
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const searchBox = ref();
|
||||||
|
const { D_BZ_YJLX, D_BZ_HPZL, D_GS_SSYJ, D_GS_ZDQT_YJLB } = proxy.$dict("D_BZ_YJLX", "D_BZ_HPZL", "D_GS_SSYJ", "D_GS_ZDQT_YJLB")
|
||||||
|
// 搜索配置
|
||||||
|
const searchConfiger = ref([
|
||||||
|
{ label: "姓名", prop: 'ryxm', placeholder: "请输入姓名", showType: "input" },
|
||||||
|
{ label: "身份证号码", prop: 'rysfzh', placeholder: "请输入身份证号码", showType: "input" },
|
||||||
|
{ label: "车牌号", prop: 'cph', placeholder: "请输入车牌号", showType: "input" },//yjClcph
|
||||||
|
{ label: "预警类型", prop: 'yjlb', placeholder: "请选择预警类型", showType: "select", options: [] },
|
||||||
|
{ label: "号牌类型", prop: 'hplx', placeholder: "请选择号牌类型", showType: "select", options: [] },
|
||||||
|
]);
|
||||||
|
|
||||||
|
const queryFrom = ref({});
|
||||||
|
const bqLbData = ref({});
|
||||||
|
const pageData = reactive({
|
||||||
|
tableData: [], //表格数据
|
||||||
|
keyCount: 0,
|
||||||
|
tableConfiger: {
|
||||||
|
rowHieght: 61,
|
||||||
|
showSelectType: "null",
|
||||||
|
loading: false,
|
||||||
|
haveControls: true
|
||||||
|
},
|
||||||
|
|
||||||
|
total: 0,
|
||||||
|
pageConfiger: {
|
||||||
|
pageSize: 20,
|
||||||
|
pageCurrent: 1
|
||||||
|
}, //分页
|
||||||
|
controlsWidth: 300, //操作栏宽度
|
||||||
|
tableColumn: [
|
||||||
|
// { label: "预警图片", prop: "yjtp", showSlot: true, width: 100 },
|
||||||
|
// { label: "预警时间", prop: "yjsj", showOverflowTooltip: true, width: 150 },
|
||||||
|
{ label: "姓名", prop: "ryxm", showOverflowTooltip: true },
|
||||||
|
{ label: "车牌号", prop: "cph", showOverflowTooltip: true },
|
||||||
|
// { label: "号牌类型", prop: "hplx", showOverflowTooltip: true },
|
||||||
|
// { label: "身份证号", prop: "rysfzh", showOverflowTooltip: true },
|
||||||
|
// { label: "部门名称", prop: "ssbm", showOverflowTooltip: true },
|
||||||
|
// { label: "预警地址", prop: "yjdz", showOverflowTooltip: true },
|
||||||
|
{ label: "预警标签", prop: "yjbq", showOverflowTooltip: true },
|
||||||
|
{ label: "预警级别", prop: "yjjb", showSolt: true, showOverflowTooltip: true },
|
||||||
|
{ label: "预警类型", prop: "yjlb", showSolt: true },
|
||||||
|
// { label: "身份次数", prop: "sfcs", showSlot: true },
|
||||||
|
{ label: "身份分值", prop: "sffz", showSolt: true },
|
||||||
|
{ label: "预警内容", prop: "yjnr", showOverflowTooltip: true },
|
||||||
|
]
|
||||||
|
});
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
tabHeightFn();
|
||||||
|
// 初始化搜索配置的选项
|
||||||
|
searchConfiger.value[3].options = D_BZ_YJLX;
|
||||||
|
searchConfiger.value[4].options = D_BZ_HPZL;
|
||||||
|
getList()
|
||||||
|
});
|
||||||
|
|
||||||
|
const changeNo = (val) => {
|
||||||
|
pageData.pageConfiger.pageCurrent = val;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
const changeSize = (val) => {
|
||||||
|
pageData.pageConfiger.pageSize = val;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取标签大类数据
|
||||||
|
const gettbGsxtBqglSelectList = (val) => {
|
||||||
|
tbGsxtBqglSelectList({ sflx: val }).then(res => {
|
||||||
|
bqLbData.value.bqXl = res
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取数据
|
||||||
|
const getList = (val) => {
|
||||||
|
pageData.tableConfiger.loading = true;
|
||||||
|
const promes = {
|
||||||
|
...val,
|
||||||
|
...queryFrom.value,
|
||||||
|
pageCurrent: pageData.pageConfiger.pageCurrent,
|
||||||
|
pageSize: pageData.pageConfiger.pageSize
|
||||||
|
}
|
||||||
|
qcckPost(promes, '/mosty-gsxt/tbYjxx/selectYjxxFzPage').then((res) => {
|
||||||
|
pageData.tableData = res.records || [];
|
||||||
|
pageData.total = res.total;
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
}).catch(() => {
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 处理签收
|
||||||
|
const handleQsFk = (val, type) => {
|
||||||
|
proxy.$confirm("是否确定转重点人?", "警告", { type: "warning" }).then(() => {
|
||||||
|
// qcckPost({ id: val.id }, "/mosty-gsxt/jfpm/yjqs").then(() => {
|
||||||
|
// proxy.$message({ type: "success", message: "转重点人成功" });
|
||||||
|
// getList()
|
||||||
|
// });
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
// 发送指令
|
||||||
|
const showDialog = ref(false)
|
||||||
|
const itemData = ref()
|
||||||
|
|
||||||
|
const semdFqzlRef = ref()
|
||||||
|
const tacitly = {
|
||||||
|
title: 'jfbt',
|
||||||
|
instructionContent: 'jfnr'
|
||||||
|
}
|
||||||
|
const submit = () => {
|
||||||
|
semdFqzlRef.value.getsendFqzl()
|
||||||
|
}
|
||||||
|
const closeFszl = () => {
|
||||||
|
semdFqzlRef.value.close()
|
||||||
|
}
|
||||||
|
const addModelRef = ref()
|
||||||
|
const openAddFrom = (row) => {
|
||||||
|
emitter.emit('openAddFrom', row)
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleClick = (row) => {
|
||||||
|
console.log('点击了身份:', row);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 根据身份分值设置行样式
|
||||||
|
const getRowClassName = (row) => {
|
||||||
|
if (!row.row.sffz) return '';
|
||||||
|
const score = Number(row.row.sffz);
|
||||||
|
if (score >= 90) return 'score-level-high';
|
||||||
|
if (score >= 70) return 'score-level-medium';
|
||||||
|
if (score >= 50) return 'score-level-low';
|
||||||
|
return '';
|
||||||
|
};
|
||||||
|
|
||||||
|
// 搜索栏
|
||||||
|
const search = ref(false)
|
||||||
|
const openSearch = () => {
|
||||||
|
search.value = !search.value
|
||||||
|
nextTick(() => {
|
||||||
|
tabHeightFn()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 表格高度计算
|
||||||
|
const tabHeightFn = () => {
|
||||||
|
if (search.value) {
|
||||||
|
pageData.tableHeight = window.innerHeight - (searchBox.value?.offsetHeight || 0) - 250;
|
||||||
|
} else {
|
||||||
|
pageData.tableHeight = window.innerHeight - 250;
|
||||||
|
}
|
||||||
|
window.onresize = function() {
|
||||||
|
tabHeightFn();
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
// 搜索
|
||||||
|
const onSearch = () => {
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
getList
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.el-loading-mask {
|
||||||
|
background: rgba(0, 0, 0, 0.5) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 积分级别的行样式 */
|
||||||
|
.score-level-high {
|
||||||
|
background-color: rgba(255, 215, 0, 0.1) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.score-level-high:hover {
|
||||||
|
background-color: rgba(255, 215, 0, 0.15) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.score-level-medium {
|
||||||
|
background-color: rgba(100, 149, 237, 0.1) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.score-level-medium:hover {
|
||||||
|
background-color: rgba(100, 149, 237, 0.15) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.score-level-low {
|
||||||
|
background-color: rgba(255, 193, 7, 0.1) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.score-level-low:hover {
|
||||||
|
background-color: rgba(255, 193, 7, 0.15) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 确保行样式应用到所有单元格 */
|
||||||
|
.score-level-high td,
|
||||||
|
.score-level-medium td,
|
||||||
|
.score-level-low td {
|
||||||
|
background-color: transparent !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user