更新页面

src/components/aboutTable/DarkTable.vue

@@ -29,10 +29,7 @@
       :header-cell-class-name="() => 'myTableHeadBgColorDark'"
       :highlight-current-row="getConfiger.showSelectType === 'radio'"
       :row-style="{
-        height:
+        height: getConfiger.rowHeight === 'auto' ? getConfiger.rowHeight : getConfiger.rowHeight + 'px'
-          getConfiger.rowHeight === 'auto'
-            ? getConfiger.rowHeight
-            : getConfiger.rowHeight + 'px'
       }"
     >
       <el-table-column

src/components/aboutTable/FormMessage.vue

@@ -70,8 +70,7 @@
           :isAll="item.isAll"
           @getDepValue="getdep($event,item.depMc)"
           v-model="listQuery[item.prop]"
-          :placeholder="listQuery[item.depMc] ? listQuery[item.depMc]:'请选择'"
+          :placeholder="listQuery[item.depMc] ? listQuery[item.depMc]:'请选择'" />
-        />
       </template>
 
       <!-- 上传 upload -->

src/router/index.js

@@ -450,7 +450,7 @@ export const publicRoutes = [
             name: "ResearchHome",
             component: () => import("@/views/backOfficeSystem/JudgmentHome/ResearchHome/index"),
             meta: {
-              title: "研判首页",
+              title: "专题研判",
               icon: "article"
             }
           },

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/components/addForm.vue

@@ -128,7 +128,7 @@ const formData = ref([
   { label: "群体成立时间", prop: "qtClsj", type: "date" },
   { label: "群体标签", prop: "bqList", type: "slot", width: "100%" },
   { label: "两群采集录入", prop: "lqxxList", type: "slot", width: "100%" },
-  { label: "管辖单位", prop: "gxSsbmdm",depMc:'gxSsbmmc', type: "department" },
+  { label: "管辖单位", prop: "gxSsdwdm",depMc:'gxSsdwmc', type: "department" },
   { label: "入库开始时间", prop: "zdrRkkssj", type: "datetime" },
   { label: "入库截至时间", prop: "zdrRkjssj", type: "datetime" },
   { label: "列控原因", prop: "zdrLkyy", type: "textarea",width: "100%" },

src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/index.vue

@@ -70,7 +70,7 @@
           <div class="flex one_text_detail">创建单位：{{ row.xtCjbmmc }}</div>
         </template>
         <template #gkxx="{ row }">
-          <div class="flex one_text_detail">管辖单位：{{ row.gxSsbmmc }}</div>
+          <div class="flex one_text_detail">管辖单位：{{ row.gxSsdwmc }}</div>
           <div class="flex one_text_detail">列控原因：{{ row.zdrLkyy }}</div>
           <div class="flex one_text_detail">开始时间：{{ row.zdrRkkssj }}</div>
           <div class="flex one_text_detail">截至时间：{{ row.zdrRkjssj }}</div>

src/views/backOfficeSystem/JudgmentHome/ResearchHome/index.vue

@@ -26,7 +26,7 @@
     <div class="rightbox">
       <div class="title">
         <span v-for="idx in 3" :key="idx" :class="'sircleL'+idx" class="sircle mr5"></span>
-        <span class="ml10 mr10">研判首页</span>
+        <span class="ml10 mr10">专题研判</span>
         <span v-for="idx in 3" :key="idx" :class="'sircleR'+idx" class="sircle ml5"></span>
          <el-button class="btn" type="primary">研判报告</el-button>
       </div>

src/views/backOfficeSystem/ResearchJudgment/DatAcquisition/index.vue

@@ -46,7 +46,7 @@
         <template #controls="{ row }">
           <el-link size="small" type="success" @click="addEdit('edit', row)">编辑</el-link>
          
-          <!-- <el-popover placement="left" :visible="row.visible" :width="400" trigger="click">
+          <el-popover placement="left" :visible="row.visible" :width="400" trigger="click">
             <template #reference>
               <el-link size="small" type="primary" @click.stop="handleSh(row)">审核</el-link>
             </template>
@@ -71,7 +71,7 @@
               <el-button size="small" @click.stop="cancel(row)">取消</el-button>
               <el-button size="small" type="primary" @click.stop="handleSumbit(row)">确定</el-button>
             </div>
-          </el-popover> -->
+          </el-popover>
 
           <el-link size="small" type="danger" @click="delDictItem(row.id)">删除</el-link>
           <!-- 续报 == 编辑 -->

src/views/backOfficeSystem/ResearchJudgment/IntelligenceManagement/index.vue

@@ -2,7 +2,7 @@
   <div>
     <div class="titleBox">
       <PageTitle title="人力情报信息采集流转">
-        <el-button type="primary">情报研判分析</el-button>
+        <el-button type="primary" @click="showHome = true">情报研判分析</el-button>
         <el-button type="primary" @click="handleHB">线索串联</el-button>
       </PageTitle>
     </div>
@@ -58,7 +58,7 @@
    <ZlForm ref="zlDialog" v-if="isShow" :dic="{D_GS_XS_ZLLX,D_GS_ZDQT_FXDJ}"></ZlForm>
    <HbForm ref="isShowhB" :dic="{D_GS_XS_LX,D_GS_XS_LY,D_GS_XS_CZZT,D_BZ_XSSHZT,D_GS_XS_QTLX}"></HbForm>
     <teleport to="#app">
-      <!-- <Qbypfx></Qbypfx> -->
+      <Qbypfx v-if="showHome" @close="showHome = false"></Qbypfx>
     </teleport>
   </div>
 </template>
@@ -79,6 +79,7 @@ const {D_GS_ZDQT_FXDJ,D_GS_XS_ZLLX,D_GS_XS_CZZT,D_GS_XS_LY, D_BZ_SSZT,D_BZ_SF,D_
 const detailDiloag = ref();
 const searchBox = ref(); //搜索框
 const isShow = ref(false)
+const showHome = ref(false)
 const zlDialog = ref(false)
 const isShowhB = ref()
 const searchConfiger = ref([
@@ -97,11 +98,6 @@ const pageData = reactive({
     showSelectType: "checkBox",
     loading: false
   },
-  tableConfiger: {
-    rowHieght: 61,
-    showSelectType: "checkBox",
-    loading: false
-  },
   total: 0,
   pageConfiger: {
     pageSize: 20,

src/views/backOfficeSystem/ResearchJudgment/IntelligenceManagement/qbypfx/hot_hm/index.vue

@@ -0,0 +1,57 @@
+<template>
+  <div>
+     <MyTable
+        :tableData="pageData.tableData"
+        :tableColumn="pageData.tableColumn"
+        :tableHeight="pageData.tableHeight"
+        :key="pageData.keyCount"
+        :fixed ="false"
+        :tableConfiger="pageData.tableConfiger"
+        :controlsWidth="pageData.controlsWidth">
+        <template #controls="{ row }">
+          <el-link size="small" type="primary" @click="addEdit('detail', row)">详情</el-link>
+        </template>
+      </MyTable>
+  </div>
+</template>
+
+<script setup>
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import { reactive } from "vue";
+const pageData = reactive({
+  tableData: [],
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "null",
+    loading: false
+  },
+  total: 0,
+  pageConfiger: {
+    pageSize: 20,
+    pageCurrent: 1
+  },
+  tableHeight:143,
+  controlsWidth: 52,
+  tableColumn: [
+    { label: "号码类型", prop: "zzMc",width:'70px' },
+    { label: "号码", prop: "sjrs",width:'70px'},
+    { label: "所属人员", prop: "bq",width:'50px'},
+    { label: "线索数", prop: "xss",width:'70px'},
+    { label: "指令数", prop: "zls" ,width:'70px'},
+  ]
+});
+
+</script>
+
+<style lang="scss" scoped>
+::v-deep  .el-table .cell{
+    padding: 0;
+}
+::v-deep .el-table tr{
+    background: rgba(239, 245, 247,1) !important;
+}
+::v-deep .el-table th.el-table__cell{
+    background: rgba(239, 245, 247,1) !important;
+}
+</style>

src/views/backOfficeSystem/ResearchJudgment/IntelligenceManagement/qbypfx/hot_ry/index.vue

@@ -0,0 +1,57 @@
+<template>
+  <div>
+     <MyTable
+        :tableData="pageData.tableData"
+        :tableColumn="pageData.tableColumn"
+        :tableHeight="pageData.tableHeight"
+        :key="pageData.keyCount"
+        :fixed ="false"
+        :tableConfiger="pageData.tableConfiger"
+        :controlsWidth="pageData.controlsWidth">
+        <template #controls="{ row }">
+          <el-link size="small" type="primary" @click="addEdit('detail', row)">详情</el-link>
+        </template>
+      </MyTable>
+  </div>
+</template>
+
+<script setup>
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import { reactive } from "vue";
+const pageData = reactive({
+  tableData: [],
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "null",
+    loading: false
+  },
+  total: 0,
+  pageConfiger: {
+    pageSize: 20,
+    pageCurrent: 1
+  },
+  tableHeight:143,
+  controlsWidth: 52,
+  tableColumn: [
+    { label: "姓名", prop: "zzMc",width:'70px' },
+    { label: "身份证", prop: "sjrs",width:'70px'},
+    { label: "标签", prop: "bq",width:'50px'},
+    { label: "线索数", prop: "xss",width:'70px'},
+    { label: "指令数", prop: "zls" ,width:'70px'},
+  ]
+});
+
+</script>
+
+<style lang="scss" scoped>
+::v-deep  .el-table .cell{
+    padding: 0;
+}
+::v-deep .el-table tr{
+    background: rgba(239, 245, 247,1) !important;
+}
+::v-deep .el-table th.el-table__cell{
+    background: rgba(239, 245, 247,1) !important;
+}
+</style>

src/views/backOfficeSystem/ResearchJudgment/IntelligenceManagement/qbypfx/hot_xs/index.vue

@@ -0,0 +1,57 @@
+<template>
+  <div>
+     <MyTable
+        :tableData="pageData.tableData"
+        :tableColumn="pageData.tableColumn"
+        :tableHeight="pageData.tableHeight"
+        :key="pageData.keyCount"
+        :fixed ="false"
+        :tableConfiger="pageData.tableConfiger"
+        :controlsWidth="pageData.controlsWidth">
+        <template #controls="{ row }">
+          <el-link size="small" type="primary" @click="addEdit('detail', row)">详情</el-link>
+        </template>
+      </MyTable>
+  </div>
+</template>
+
+<script setup>
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import { reactive } from "vue";
+const pageData = reactive({
+  tableData: [],
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "null",
+    loading: false
+  },
+  total: 0,
+  pageConfiger: {
+    pageSize: 20,
+    pageCurrent: 1
+  },
+  tableHeight:143,
+  controlsWidth: 52,
+  tableColumn: [
+    { label: "线索名称", prop: "xsMc",width:'70px' },
+    { label: "涉及人数", prop: "sjrs",width:'70px'},
+    { label: "标签", prop: "bq",width:'50px'},
+    { label: "风险等级", prop: "fxdj",width:'70px'},
+    { label: "指向地点", prop: "zxdz" ,width:'70px'},
+  ]
+});
+
+</script>
+
+<style lang="scss" scoped>
+::v-deep  .el-table .cell{
+    padding: 0;
+}
+::v-deep .el-table tr{
+    background: rgba(239, 245, 247,1) !important;
+}
+::v-deep .el-table th.el-table__cell{
+    background: rgba(239, 245, 247,1) !important;
+}
+</style>

src/views/backOfficeSystem/ResearchJudgment/IntelligenceManagement/qbypfx/hot_zz/index.vue

@@ -0,0 +1,57 @@
+<template>
+  <div>
+     <MyTable
+        :tableData="pageData.tableData"
+        :tableColumn="pageData.tableColumn"
+        :tableHeight="pageData.tableHeight"
+        :key="pageData.keyCount"
+        :fixed ="false"
+        :tableConfiger="pageData.tableConfiger"
+        :controlsWidth="pageData.controlsWidth">
+        <template #controls="{ row }">
+          <el-link size="small" type="primary" @click="addEdit('detail', row)">详情</el-link>
+        </template>
+      </MyTable>
+  </div>
+</template>
+
+<script setup>
+import MyTable from "@/components/aboutTable/MyTable.vue";
+import { reactive } from "vue";
+const pageData = reactive({
+  tableData: [],
+  keyCount: 0,
+  tableConfiger: {
+    rowHieght: 61,
+    showSelectType: "null",
+    loading: false
+  },
+  total: 0,
+  pageConfiger: {
+    pageSize: 20,
+    pageCurrent: 1
+  },
+  tableHeight:143,
+  controlsWidth: 52,
+  tableColumn: [
+    { label: "组织名称", prop: "zzMc",width:'70px' },
+    { label: "涉及人数", prop: "sjrs",width:'70px'},
+    { label: "标签", prop: "bq",width:'50px'},
+    { label: "线索数", prop: "xss",width:'70px'},
+    { label: "指令数", prop: "zls" ,width:'70px'},
+  ]
+});
+
+</script>
+
+<style lang="scss" scoped>
+::v-deep  .el-table .cell{
+    padding: 0;
+}
+::v-deep .el-table tr{
+    background: rgba(239, 245, 247,1) !important;
+}
+::v-deep .el-table th.el-table__cell{
+    background: rgba(239, 245, 247,1) !important;
+}
+</style>

src/views/backOfficeSystem/ResearchJudgment/IntelligenceManagement/qbypfx/index.vue

@@ -2,67 +2,267 @@
     <div class="container">
         <div class="header flex just-between">
             <span>情报研判分析</span>
-        <span class="pointer"><el-icon><Close /></el-icon></span>
+            <span class="pointer" @click="close"><el-icon><Close /></el-icon></span>
         </div>
         <div class="seachsBox">
-        <Search :searchArr="searchConfiger" @submit="onSearch"/>
+            <Search :searchArr="searchConfiger" @submit="onSearch">
+                <template #defaultSlot>
+                    <div class="flex align-center">
+                        <span class="marks" @click="active = idex" :class="active == idex ? 'activeBtn' : ''" v-for="(it, idex) in time" :key="idex">{{ it.label }}</span>
+                        <el-date-picker v-model="listQuery.dateRange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+                    </div>
+                </template>
+            </Search>
         </div>
         <div class="contant">
             <div class="contant-left aside">
-            <div></div>
+                <div class="model">
+                    <div class="modelTitle">热点线索</div>
+                    <div class="cnt">
+                        <Hot_xs></Hot_xs>
+                    </div>
+                </div>
+                <div class="model">
+                    <div class="modelTitle">热点组织</div>
+                    <div class="cnt">
+                        <Hot_zz></Hot_zz>
+                    </div>
+                </div>
+                <div class="model">
+                    <div class="modelTitle">热点人员</div>
+                    <div class="cnt">
+                        <Hot_ry></Hot_ry>
+                    </div>
+                </div>
+                <div class="model">
+                    <div class="modelTitle">热点号码</div>
+                    <div class="cnt">
+                        <Hot_hm></Hot_hm>
+                    </div>
+                </div>
+            </div>
+            <div class="map">
+                <GdMap></GdMap>
+                <ul class="btns">
+                    <li><span>热点集访单位</span></li>
+                    <li><span>点位图</span></li>
+                    <li><span>指令分布</span></li>
+                </ul>
+            </div>
+            <div class="contant-right aside">
+                <div class="model">
+                    <div class="modelTitle">诉求分类</div>
+                    <div class="cnt">
+                        <Zqfl></Zqfl>
+                    </div>
+                </div>
+                <div class="model">
+                    <div class="modelTitle">重点线索分类</div>
+                    <div class="cnt">
+                        <Zdxsfl></Zdxsfl>
+                    </div>
+                </div>
+                <div class="model">
+                    <div class="modelTitle">指令次数</div>
+                    <div class="cnt">
+                        <Zlcs></Zlcs>
+                    </div>
+                </div>
             </div>
-        <div class="contant-right aside"></div>
         </div>
     </div>
 </template>
 
 <script setup>
+import GdMap from "@/components/GdMap/index.vue";
+import Hot_xs from './hot_xs/index.vue'
+import Hot_zz from './hot_zz/index.vue'
+import Hot_ry from './hot_ry/index.vue'
+import Hot_hm from './hot_hm/index.vue'
+import Zqfl from './zqfl/index.vue'
+import Zlcs from './zlcs/index.vue'
+import Zdxsfl from './zdxsfl/index.vue'
 import Search from "@/components/aboutTable/Search.vue";
-import { reactive, ref } from 'vue';
+import { reactive, ref } from "vue";
-const searchConfiger = reactive([
+const emits = defineEmits(['close'])
-  { label: "所属部门", prop: 'ssbmdm', placeholder: "请输入所属部门", showType: "department" },
+const listQuery = ref({});
-  { label: "内容关键字", prop: 'xsNr', placeholder: "请输入语义关键字", showType: "input" },
+const active = ref(0);
-  { label: "线索类型", prop: 'xlLx', placeholder: "请选择线索类型", showType: "select"},
+const time = reactive([
-  { label: "线索来源", prop: 'qbLy', placeholder: "请选择线索来源", showType: "select"},
+    { label: "今天", value: "10" },
-  { label: "指向地点", prop: 'zxdz', placeholder: "请输入指向地点", showType: "input" },
+    { label: "近一周", value: "20" },
+    { label: "近一月", value: "30" },
+    { label: "近一季度", value: "40" },
+    { label: "近一年", value: "50" }
 ]);
+const searchConfiger = reactive([
+    {
+        label: "所属部门",
+        prop: "ssbmdm",
+        placeholder: "请选择",
+        showType: "department"
+    },
+    {
+        label: "数据周期",
+        prop: "sjzq",
+        placeholder: "请选择",
+        showType: "defaultSlot"
+    },
+    {
+        label: "热点集访单位",
+        prop: "jfdw",
+        placeholder: "请选择",
+        showType: "select"
+    },
+    {
+        label: "行为特征",
+        prop: "xwtz",
+        placeholder: "请选择",
+        showType: "select"
+    },
+    { label: "指向地点", prop: "zxdz", placeholder: "请输入", showType: "input" },
+    {
+        label: "事件诱因类型",
+        prop: "yxlx",
+        placeholder: "请选择",
+        showType: "select"
+    },
+    { label: "诉求类型", prop: "sqlx", placeholder: "请选择", showType: "select" }
+]);
+
+// 关闭
+function close(){
+    emits('close')
+}
 </script>
 
 <style lang="scss" scoped>
-.container{
+.container {
     width: 100%;
     height: 100%;
-    background: #fff;
+    background: rgb(232, 237, 246);
     color: #333;
     padding: 10px;
     box-sizing: border-box;
-    .header{
+
+    .header {
         height: 60px;
         font-size: 30px;
         font-weight: 600;
+        background: #fff;
+        padding: 0 15px;
+        box-sizing: border-box;
+        border-radius: 4px;
     }
-    .seachsBox{
 
+    .seachsBox {
+        margin-bottom: 10px;
+        .marks {
+            padding: 5px 6px;
+            box-sizing: border-box;
+            border-radius: 4px;
+            margin-right: 5px;
+            border: 1px solid #e1e1e1;
+            color: #333;
+            cursor: pointer;
         }
-    .contant{
+
-        position: relative;
+        .activeBtn {
-        height: calc(100% - 65px);
+            border: 1px solid #0072ff;
+            background: #0072ff;
+            color: #fff;
+        }
+
+        ::v-deep .el-form-item--default {
+            margin-bottom: 0;
+        }
+
+        ::v-deep .pageSearch {
+            margin-bottom: 0 !important;
+        }
+
+        .searchBox {
+            padding: 0px 15px 0px;
+        }
+    }
+
+    .contant {
+        display: flex;
+        justify-content: space-between;
+        width: 100%;
+        height: calc(100% - 160px);
         overflow: hidden;
         overflow-y: auto;
-        .aside{
+        .aside {
-            position: absolute;
+            display: flex;
-            width: 400px;
+            flex-direction: column;
+            width: 450px;
             height: 100%;
             top: 0;
-            background: red;
+            .model {
+                background: #fff;
+                flex: 1 0 0;
+                margin-bottom: 10px;
+                border-radius: 4px;
+
+                .modelTitle {
+                    position: relative;
+                    padding: 0 4px;
+                    box-sizing: border-box;
+                    height: 30px;
+                    line-height: 30px;
+                    color: #333;
+                    &::before{
+                        position: absolute;
+                        content: '';
+                        left: 4px;
+                        bottom: 4px;
+                        width:50px ;
+                        height: 4px;
+                        background: linear-gradient(to right,#0072ff,#fff);
+                    }
+                }
+                .cnt{
+                    height: calc(100% - 30px);
+                    padding: 0 4px;
+                    box-sizing: border-box;
+                    overflow: hidden;
+                    overflow-y: auto;
+                }
+
+                &:last-child {
+                    margin-bottom: 0;
+                }
+            }
+        }
+        .map{
+            flex: 1 0 0;
+            margin: 0 10px;
+            position: relative;
+            .btns{
+                position: absolute;
+                bottom:0 ;
+                left: 50%;
+                transform: translateX(-50%);
+                display: flex;
+                z-index: 99;
+                li{
+                    white-space: nowrap;
+                    padding: 10px 30px;
+                    margin: 0 10px;
+                    background: #004597;
+                    color: #fff;
+                    transform: skewX(-30deg);
+                    cursor: pointer;
+                    span{
+                        display: inline-block;
+                        transform: skewX(30deg);
+                    }
+                    &:nth-child(2){
+                        background: #ee8134;
+                    }
                 }
-        .contant-left{
-            left: 0;
             }
-        .contant-right{
-            right: 0;
         }
     }
 }
-
 </style>

src/views/backOfficeSystem/ResearchJudgment/IntelligenceManagement/qbypfx/zdxsfl/index.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="comom-cnt">
+   <LineEcharts echartsId="qbsbEcharts111" :data="dataList"></LineEcharts>
+  </div>
+</template>
+
+<script setup>
+import { qcckPost } from "@/api/qcckApi.js";
+import LineEcharts from "@/views/home/echarts/moreLineEcharts.vue";
+import { reactive, onMounted } from 'vue';
+
+const dataList = reactive({
+  xData:['巴宜区','工布江达县','米林县','墨脱县','波密县','察隅县','朗县'],
+  color:['#0386FB','#00FFFF'],
+  labelColor:'#333',
+  list:[
+    {label:'总数',val:[10,0,10,0,10,0,0]},
+    {label:'已处置',val:[0,10,10,10,0,10,0]},
+  ]
+});
+onMounted(() => {
+});
+
+
+
+</script>
+
+
+<style lang="scss" scoped>
+@import "@/assets/css/homeScreen.scss";
+.comom-cnt{
+    width: 100%;
+    height: 100%;
+}
+
+</style>

src/views/backOfficeSystem/ResearchJudgment/IntelligenceManagement/qbypfx/zlcs/index.vue

@@ -0,0 +1,58 @@
+<template>
+    <ul class="box-zl">
+        <li class="items" v-for="(it,idx) in list" :key="idx">
+            <div>{{ it.num }}</div>
+            <div>{{ it.label }}</div>
+        </li>
+    </ul>
+  
+</template>
+
+<script setup>
+import { reactive } from 'vue';
+const list = reactive([
+    { label:'线索数量', num :0 },
+    { label:'线索转指令数量', num :0 },
+    { label:'关联群体数量', num :0 },
+    { label:'关联人员数量', num :0 },
+])
+</script>
+
+<style lang="scss" scoped>
+.box-zl{
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    gap: 20px 0;
+    width: 100%;
+    height: 100%;
+    padding: 10px 4px;
+    box-sizing: border-box;
+    .items{
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        color: #fff;
+        font-size: 16px;
+        width: 48%;
+        border-radius: 6px;
+        background: linear-gradient(to top,#ff9585,#ffffff);
+        border: 2px solid;
+        border-image: linear-gradient(to top, #fc6750, #ffffff) 1;
+        &:nth-child(2){
+            background: linear-gradient(to top,#ffcc8d,#ffffff);
+            border-image: linear-gradient(to top, #e09c27, #ffffff) 1;
+        }
+        &:nth-child(3){
+            background: linear-gradient(to top,#81eefe,#ffffff);
+            border-image: linear-gradient(to top, #27dce0, #ffffff) 1;
+        }
+        &:nth-child(4){
+            background: linear-gradient(to top,#96ccfe,#ffffff);
+            border-image: linear-gradient(to top, #407fba, #ffffff) 1;
+        }
+    }
+}
+
+</style>

src/views/backOfficeSystem/ResearchJudgment/IntelligenceManagement/qbypfx/zqfl/index.vue

@@ -0,0 +1,39 @@
+<template>
+  <div class="comom-cnt">
+   <PieEcharts echartsId="zqflEcharts" color="#333" :data="dataList"></PieEcharts>
+  </div>
+</template>
+
+<script setup>
+import { qcckPost } from "@/api/qcckApi.js";
+import PieEcharts from "@/views/home/echarts/pieEcharts.vue";
+import { reactive, onMounted } from 'vue';
+
+const dataList = reactive([
+ {
+    label: "待办",
+    value: 2056,
+    color:['#FF6B9A','#FF4B7A']
+},
+{
+    label: "已办",
+    value: 4356,
+    color:['#FFAA33','#FF8A00'],
+},
+]);
+onMounted(() => {
+});
+
+
+
+</script>
+
+
+<style lang="scss" scoped>
+@import "@/assets/css/homeScreen.scss";
+.comom-cnt{
+    width: 100%;
+    height: 100%;
+}
+
+</style>

src/views/home/echarts/3DpieEcharts.vue

@@ -1,291 +0,0 @@
-<template>
-  <div style="height:100%;width:100%" :id="echartsId"></div>
-</template>
-   
-<script setup>
-import * as echarts from "echarts";
-import "echarts-gl";
-import { fa } from "element-plus/es/locale.mjs";
-import { onMounted, toRefs,nextTick, defineProps,ref, reactive } from "vue";
-const props = defineProps({
-  echartsId:{
-    type:String,
-    default:'lineId'
-  },
-//   传入数据生成 option
-  data:{
-    type:Array,
-    default:[
-        {
-            name: "待办",
-            value: 2056,
-            itemStyle: {
-            // color: "#2A71FF"
-            echarts: "rgba(44,44,44,0.8)"
-            }
-        },
-        {
-            name: "已办",
-            value: 4356,
-            itemStyle: {
-            color: "#00EDFE"
-            }
-        },
-    ]
-  }
-});
-
-watch(()=>props.data,val=>{
-  nextTick(()=>{ 
-    echartInit()
-   })
-},{immediate:true,deep:true})
-
-
-const echartInit = () => {
-  var myChart = echarts.init(document.getElementById(props.echartsId));
-  const series = getPie3D(props.data, 0.8, 240, 28, 26, 0.5);
-  series.push({
-    name: "pie2d",
-    type: "pie",
-    label: {
-      // show: false,
-      opacity: 1,
-      fontSize: 14,
-      lineHeight: 20,
-      textStyle: {
-        fontSize: 14,
-        color: "#fff"
-      }
-    },
-    labelLine: {
-      // show: false,
-      length: 20,
-      length2: 25
-    },
-    startAngle: -30, //起始角度，支持范围[0, 360]。
-    clockwise: false, //饼图的扇区是否是顺时针排布。上述这两项配置主要是为了对齐3d的样式
-    // radius: ["40%", "60%"],
-    center: ["40%", "50%"],
-    data: props.data,
-    itemStyle: {
-      opacity: 0
-    }
-  });
-  // 准备待返回的配置项，把准备好的 legendData、series 传入。
-  let option = {
-    legend: {
-      show: true,
-      tooltip: {
-        show: true
-      },
-      orient: "vertical",
-      data: props.data.map((item) => item.name),
-    //   data: ["待办", "已办", "未处理", "忽略"],
-      top: "center",
-      itemGap: 14,
-      itemHeight: 8,
-      itemWidth: 17,
-      right: "2%",
-      textStyle: {
-        color: "#fff",
-        fontSize: 12
-      }
-    },
-    animation: true,
-    tooltip: {
-      formatter: (params) => {
-        if ( params.seriesName !== "mouseoutSeries" &&  params.seriesName !== "pie2d" ) {
-          return `${ params.seriesName }<br/><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${params.color };"></span>${option.series[params.seriesIndex].pieData.value + "人"}`;
-        }
-      },
-      textStyle: {
-        fontSize: 14
-      }
-    },
-    title: {
-      x: "center",
-      top: "20",
-      textStyle: {
-        color: "#fff",
-        fontSize: 22
-      }
-    },
-    backgroundColor: "rgba(0, 29, 75, 0.65)",
-    labelLine: {
-      show: true,
-      lineStyle: {
-        color: "#7BC0CB"
-      },
-      normal: {
-        show: false,
-        length: 20,
-        length2: 20
-      }
-    },
-    label: {
-      show: true,
-      position: "outside",
-      formatter: "{b} \n{d}%",
-      textStyle: {
-        color: "#fff",
-        fontSize: "14px"
-      }
-    },
-    xAxis3D: {
-      min: -1,
-      max: 1
-    },
-    yAxis3D: {
-      min: -1,
-      max: 1
-    },
-    zAxis3D: {
-      min: -1,
-      max: 1
-    },
-    grid3D: {
-      show: false,
-      boxHeight: 0.01,
-      bottom: "50%",
-      left: "-12%",
-      // environment: "rgba(255,255,255,0)",// 环境颜色
-      viewControl: {
-        distance: 180, //圆环的大小 ,值越大换越小
-        alpha: 25, //倾斜的角度
-        beta: 0, //旋转的角度
-        autoRotate: false // 取消自动旋转
-      }
-    },
-    series: series
-  };
-  // 使用刚指定的配置项和数据显示图表。
-  myChart.setOption(option);
-};
-
-function getParametricEquation( startRatio, endRatio, isSelected, isHovered, k, height ) {
-  // 计算
-  let midRatio = (startRatio + endRatio) / 2;
-  let startRadian = startRatio * Math.PI * 2;
-  let endRadian = endRatio * Math.PI * 2;
-  let midRadian = midRatio * Math.PI * 2;
-  // 如果只有一个扇形，则不实现选中效果。
-  if (startRatio === 0 && endRatio === 1) {
-    isSelected = false;
-  }
-
-  // 通过扇形内径/外径的值，换算出辅助参数 k（默认值 1/3）
-  k = typeof k !== "undefined" ? k : 1 / 3;
-
-  // 计算选中效果分别在 x 轴、y 轴方向上的位移（未选中，则位移均为 0）
-  let offsetX = isSelected ? Math.cos(midRadian) * 0.1 : 0;
-  let offsetY = isSelected ? Math.sin(midRadian) * 0.1 : 0;
-
-  // 计算高亮效果的放大比例（未高亮，则比例为 1）
-  let hoverRate = isHovered ? 1.05 : 1;
-
-  // 返回曲面参数方程
-  return {
-    u: {
-      min: -Math.PI,
-      max: Math.PI * 3,
-      step: Math.PI / 32
-    },
-
-    v: {
-      min: 0,
-      max: Math.PI * 2,
-      step: Math.PI / 20
-    },
-
-    x: function (u, v) {
-      if (u < startRadian) {
-        return (offsetX + Math.cos(startRadian) * (1 + Math.cos(v) * k) * hoverRate);
-      }
-      if (u > endRadian) {
-        return (offsetX + Math.cos(endRadian) * (1 + Math.cos(v) * k) * hoverRate);
-      }
-      return offsetX + Math.cos(u) * (1 + Math.cos(v) * k) * hoverRate;
-    },
-
-    y: function (u, v) {
-      if (u < startRadian) {
-        return (offsetY + Math.sin(startRadian) * (1 + Math.cos(v) * k) * hoverRate);
-      }
-      if (u > endRadian) {
-        return ( offsetY + Math.sin(endRadian) * (1 + Math.cos(v) * k) * hoverRate);
-      }
-      return offsetY + Math.sin(u) * (1 + Math.cos(v) * k) * hoverRate;
-    },
-
-    z: function (u, v) {
-      if (u < -Math.PI * 0.5) {
-        return Math.sin(u);
-      }
-      if (u > Math.PI * 2.5) {
-        return Math.sin(u);
-      }
-      return Math.sin(v) > 0 ? 1 * height : -1;
-    }
-  };
-}
-// 生成模拟 3D 饼图的配置项
-function getPie3D(pieData, internalDiameterRatio) {
-  let series = [];
-  let sumValue = 0;
-  let startValue = 0;
-  let endValue = 0;
-  let legendData = [];
-  let k = typeof internalDiameterRatio !== "undefined" ? (1 - internalDiameterRatio) / (1 + internalDiameterRatio) : 1 / 3;
-
-  // 为每一个饼图数据，生成一个 series-surface 配置
-  for (let i = 0; i < pieData.length; i++) {
-    sumValue += pieData[i].value;
-
-    let seriesItem = {
-      name: typeof pieData[i].name === "undefined" ? `series${i}` : pieData[i].name, type: "surface",
-      parametric: true,
-      wireframe: { show: false },
-      pieData: pieData[i],
-      pieStatus: {
-        selected: false,
-        hovered: false,
-        k: k
-      }
-    };
-
-    if (typeof pieData[i].itemStyle != "undefined") {
-      let itemStyle = {};
-      typeof pieData[i].itemStyle.color != "undefined" ? (itemStyle.color = pieData[i].itemStyle.color) : null;
-      typeof pieData[i].itemStyle.opacity != "undefined" ? (itemStyle.opacity = pieData[i].itemStyle.opacity) : null;
-      seriesItem.itemStyle = itemStyle;
-    }
-    series.push(seriesItem);
-  }
-
-  // 使用上一次遍历时，计算出的数据和 sumValue，调用 getParametricEquation 函数，
-  // 向每个 series-surface 传入不同的参数方程 series-surface.parametricEquation，也就是实现每一个扇形。
-  for (let i = 0; i < series.length; i++) {
-    endValue = startValue + series[i].pieData.value;
-    console.log(series[i]);
-    series[i].pieData.startRatio = startValue / sumValue;
-    series[i].pieData.endRatio = endValue / sumValue;
-    series[i].parametricEquation = getParametricEquation(
-      series[i].pieData.startRatio,
-      series[i].pieData.endRatio,
-      false,
-      false,
-      k,
-      series[i].pieData.value
-    );
-    startValue = endValue;
-    legendData.push(series[i].name);
-  }
-  return series;
-}
-</script>
-   
-  <style lang='scss' scoped>
-
-</style>
-  

src/views/home/index.vue

@@ -46,7 +46,6 @@ import ZdryWarning from './model/zdryWarning.vue'
 import Zdgk from './model/zdgk.vue'
 import Fjqk from './model/fjqk.vue'
 import Yszs from './model/yszs.vue'
-import { ref } from 'vue';
 </script>
 
 <style lang="scss" scoped>

src/views/home/model/qbfkCount.vue

@@ -4,7 +4,6 @@
   </div> 
   <div class="comom-cnt">
     <pieEcharts echartsId='qbfk' :data="countData"></pieEcharts>
-    <!-- <div id="qbfk" class="qbfkBox" style="width: 100%; height: 100%"></div> -->
   </div>
 </template>