From e26bacab0a5c325b55907d2c59fbe3e41acac1e6 Mon Sep 17 00:00:00 2001
From: huangchengfa <171504222@qq.com>
Date: Fri, 12 Dec 2025 21:08:46 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E6=9B=B4=E7=BB=86=E4=B8=80=E6=AC=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../scoreRanking/components/addFrom.vue       |  83 +++++
 .../scoreRanking/components/detail.vue        |  57 ++++
 .../warningControl/scoreRanking/index.vue     | 304 ++++++++++++++++++
 3 files changed, 444 insertions(+)
 create mode 100644 src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/components/addFrom.vue
 create mode 100644 src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/components/detail.vue
 create mode 100644 src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/index.vue

diff --git a/src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/components/addFrom.vue b/src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/components/addFrom.vue
new file mode 100644
index 0000000..7333c1d
--- /dev/null
+++ b/src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/components/addFrom.vue
@@ -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>
\ No newline at end of file
diff --git a/src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/components/detail.vue b/src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/components/detail.vue
new file mode 100644
index 0000000..18661c1
--- /dev/null
+++ b/src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/components/detail.vue
@@ -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>
\ No newline at end of file
diff --git a/src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/index.vue b/src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/index.vue
new file mode 100644
index 0000000..eedbc4f
--- /dev/null
+++ b/src/views/backOfficeSystem/fourColorManage/warningControl/scoreRanking/index.vue
@@ -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>