diff --git a/base-manager-ui/admin/package.json b/base-manager-ui/admin/package.json
index d39a93ef404c9bced5e942540f05f784b5ae3ce0..bff85505a8fec3757f6d4a6ba67a92d7ae60edef 100644
--- a/base-manager-ui/admin/package.json
+++ b/base-manager-ui/admin/package.json
@@ -25,6 +25,7 @@
     "china-division": "^2.5.0",
     "clipboard": "^2.0.6",
     "core-js": "^3.6.5",
+    "crypto-js": "^4.1.1",
     "date-fns": "^2.14.0",
     "echarts": "^5.2.2",
     "element-china-area-data": "^5.0.2",
diff --git a/base-manager-ui/admin/src/assets/css/common.less b/base-manager-ui/admin/src/assets/css/common.less
index b6caca3de287722943dbb5190d734edac43c39a3..8522bcc91ba7bd0b3ca472571aa47f37e5e0f6d9 100644
--- a/base-manager-ui/admin/src/assets/css/common.less
+++ b/base-manager-ui/admin/src/assets/css/common.less
@@ -31,16 +31,17 @@
   border-bottom: 1px solid rgb(224, 224, 224) !important;
 }
 
-.ant-tabs-tab{
+.ant-tabs-tab {
   font-weight: bold;
   color: rgba(0, 0, 0, 0.65);
-  i{
-    color:#1890ff
+  i {
+    color: #1890ff;
   }
 }
-.ant-spin-nested-loading,.ant-spin-container{
-  width:100%;
-  height:100%;
+.ant-spin-nested-loading,
+.ant-spin-container {
+  width: 100%;
+  height: 100%;
 }
 /* 婧㈠嚭琛ㄦ牸婊氬姩鏉� */
 /* 琛ㄦ牸 */
@@ -56,10 +57,9 @@
   tr:only-child > th:last-child {
     border-right-color: #f0f0f0 !important;
   }
-
 }
-.ant-table-placeholder{
-  width:calc(100% - 6px)
+.ant-table-placeholder {
+  width: calc(100% - 6px);
 }
 .ant-table-header {
   background: #fff;
@@ -118,4 +118,11 @@
 //   align-items: center;
 //   justify-content:space-between;
 //   margin-bottom: 20px;
-// }
\ No newline at end of file
+// }
+
+// 缁熶竴璁剧疆琛ㄦ牸涓虹┖鏃剁殑灞曠ず
+.ant-table-tbody {
+  td:empty::after {
+    content: "--";
+  }
+}
diff --git a/base-manager-ui/admin/src/store/index.js b/base-manager-ui/admin/src/store/index.js
index 2fbe9a08acdcf84c03975625c9983f4f0ef5ecad..0bf614776941ae565987f18f566eed038129566f 100644
--- a/base-manager-ui/admin/src/store/index.js
+++ b/base-manager-ui/admin/src/store/index.js
@@ -2,8 +2,9 @@ import Vue from "vue";
 import Vuex from "vuex";
 import modules from "./modules";
 import createPersistedState from "vuex-persistedstate";
-import SecureLS from "secure-ls";
-var ls = new SecureLS({ isCompression: false });
+// import SecureLS from "secure-ls";
+// var ls = new SecureLS({ isCompression: false });
+import { SessionCrypto } from "@/utils/util";
 Vue.use(Vuex);
 const store = new Vuex.Store({
   modules,
@@ -15,9 +16,9 @@ const store = new Vuex.Store({
     createPersistedState({
       key: "info",
       storage: {
-        getItem: (key) => ls.get(key),
-        setItem: (key, value) => ls.set(key, value),
-        removeItem: (key) => ls.remove(key),
+        getItem: (key) => SessionCrypto.getItem(key),
+        setItem: (key, value) => SessionCrypto.setItem(key, value),
+        removeItem: (key) => SessionCrypto.remove(key),
       },
     }),
   ],
diff --git a/base-manager-ui/admin/src/utils/util.js b/base-manager-ui/admin/src/utils/util.js
index 9d2725964f6dcd3beb7d7d2b6b0466514df339aa..fbe211a8a6685fe02e09b79c1f6d1a3e29b4565c 100644
--- a/base-manager-ui/admin/src/utils/util.js
+++ b/base-manager-ui/admin/src/utils/util.js
@@ -1,5 +1,5 @@
 import enquireJs from "enquire.js";
-
+import CryptoJS from "crypto-js";
 export function isDef(v) {
   return v !== undefined && v !== null;
 }
@@ -62,3 +62,52 @@ export const extractTree = (arrs, childs, attrArr) => {
   };
   return getObj(arrs);
 };
+
+/**
+ * 鍔犲瘑瀛樺偍涓存椂鏁版嵁骞惰В鏋愬璞�
+ */
+const aseKey = "**_FXxx_1234_KEY";
+const KEY = "KEY_EXTRA";
+export class SessionCrypto {
+  // 鍔犲瘑
+  static setItem(key = KEY, value = "") {
+    if (typeof key === "string") {
+      const stringify = JSON.stringify(value);
+      const encrypt = CryptoJS.AES.encrypt(
+        stringify,
+        CryptoJS.enc.Utf8.parse(aseKey),
+        {
+          mode: CryptoJS.mode.ECB,
+          padding: CryptoJS.pad.Pkcs7,
+        }
+      ).toString();
+      window.sessionStorage.setItem(key, encrypt);
+      return encrypt;
+    }
+  }
+  // 瑙ｅ瘑
+  static getItem(key = KEY) {
+    const ssStr = window.sessionStorage.getItem(key) || "";
+    try {
+      if (ssStr) {
+        const decrypt = CryptoJS.AES.decrypt(
+          ssStr,
+          CryptoJS.enc.Utf8.parse(aseKey),
+          {
+            mode: CryptoJS.mode.ECB,
+            padding: CryptoJS.pad.Pkcs7,
+          }
+        ).toString(CryptoJS.enc.Utf8);
+        const parseStr = JSON.parse(decrypt);
+        return parseStr;
+      }
+      return "";
+    } catch (e) {
+      return "";
+    }
+  }
+  // 鍒犻櫎
+  static remove(key) {
+    window.sessionStorage.removeItem(key);
+  }
+}
diff --git a/base-manager-ui/admin/yarn.lock b/base-manager-ui/admin/yarn.lock
index f6c99d4147c5e92a6382bf48b73ef92ffdd08a74..0afc4971a9b0650778eda26e3f010bafe202aede 100644
--- a/base-manager-ui/admin/yarn.lock
+++ b/base-manager-ui/admin/yarn.lock
@@ -3676,6 +3676,11 @@ crypto-js@^3.1.6:
   resolved "https://registry.npmmirror.com/crypto-js/-/crypto-js-3.3.0.tgz#846dd1cce2f68aacfa156c8578f926a609b7976b"
   integrity sha512-DIT51nX0dCfKltpRiXV+/TVZq+Qq2NgF4644+K7Ttnla7zEzqc+kjJyiB96BHNyUTBxyjzRcZYpUdZa+QAqi6Q==
 
+crypto-js@^4.1.1:
+  version "4.1.1"
+  resolved "https://registry.npmmirror.com/crypto-js/-/crypto-js-4.1.1.tgz#9e485bcf03521041bd85844786b83fb7619736cf"
+  integrity sha512-o2JlM7ydqd3Qk9CA0L4NL6mTzU2sdx96a+oOfPu8Mkl/PK51vSyoi8/rQ8NknZtk44vq15lmhAj9CIAGwgeWKw==
+
 crypto-random-string@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npm.taobao.org/crypto-random-string/download/crypto-random-string-2.0.0.tgz?cache=0&sync_timestamp=1583560482221&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcrypto-random-string%2Fdownload%2Fcrypto-random-string-2.0.0.tgz"
diff --git a/portal-manager-ui/admin/src/assets/css/common.less b/portal-manager-ui/admin/src/assets/css/common.less
index cd184c1cba2fc14698c256ac76ba7d9491984c8d..fb8dbf4c1b3ad5e2970eee185248a02cbf056f9b 100644
--- a/portal-manager-ui/admin/src/assets/css/common.less
+++ b/portal-manager-ui/admin/src/assets/css/common.less
@@ -776,4 +776,11 @@ img {
 //       }
 //     }
 //   }
-// }
\ No newline at end of file
+// }
+
+// 缁熶竴璁剧疆琛ㄦ牸涓虹┖鏃剁殑灞曠ず
+.ant-table-tbody {
+  td:empty::after {
+    content: "--";
+  }
+}
\ No newline at end of file
diff --git a/portal-manager-ui/admin/src/store/index.js b/portal-manager-ui/admin/src/store/index.js
index 2efa2d399048c56be8aaa24044afd6a375bc8712..0316b4506c794f81941e34f86093f4ef63f42147 100644
--- a/portal-manager-ui/admin/src/store/index.js
+++ b/portal-manager-ui/admin/src/store/index.js
@@ -2,9 +2,10 @@ import Vue from "vue";
 import Vuex from "vuex";
 import modules from "./modules";
 import createPersistedState from "vuex-persistedstate";
-import SecureLS from "secure-ls";
-var ls = new SecureLS({ isCompression: false });
+// import SecureLS from "secure-ls";
+// var ls = new SecureLS({ isCompression: false });
 import VuexReset from "@ianwalter/vuex-reset";
+import { SessionCrypto } from "@/utils";
 // import persistedState from 'vuex-persistedstate'
 Vue.use(Vuex);
 const store = new Vuex.Store({
@@ -16,9 +17,9 @@ const store = new Vuex.Store({
     createPersistedState({
       key: "info",
       storage: {
-        getItem: (key) => ls.get(key),
-        setItem: (key, value) => ls.set(key, value),
-        removeItem: (key) => ls.remove(key),
+        getItem: (key) => SessionCrypto.getItem(key),
+        setItem: (key, value) => SessionCrypto.setItem(key, value),
+        removeItem: (key) => SessionCrypto.remove(key),
       },
     }),
   ],
diff --git a/portal-manager-ui/admin/src/utils/index.js b/portal-manager-ui/admin/src/utils/index.js
index c4246a7097d155666172a69cddee477f8208d86d..d8bc3ef1e3b88e8aeab6a7fd54492e3eb97d41b1 100644
--- a/portal-manager-ui/admin/src/utils/index.js
+++ b/portal-manager-ui/admin/src/utils/index.js
@@ -16,3 +16,66 @@ export let encrypt = (str, keyStr, ivStr) => {
 
   return encrypted.toString();
 };
+// 瑙ｅ瘑
+export const decrypt = (word, keyStr, ivStr) => {
+  keyStr = keyStr ? keyStr : "0000000671595991";
+  ivStr = ivStr ? ivStr : "tdrdadq59tbss5n7";
+  let key = CryptoJS.enc.Utf8.parse(keyStr);
+  let iv = CryptoJS.enc.Utf8.parse(ivStr);
+
+  let decrypt = CryptoJS.AES.decrypt(word, key, {
+    iv,
+    mode: CryptoJS.mode.CBC,
+    padding: CryptoJS.pad.Pkcs7,
+  });
+  return decrypt.toString(CryptoJS.enc.Utf8);
+};
+
+/**
+ * 鍔犲瘑瀛樺偍涓存椂鏁版嵁骞惰В鏋愬璞�
+ */
+const aseKey = "**_FXxx_1234_KEY";
+const KEY = "KEY_EXTRA";
+export class SessionCrypto {
+  // 鍔犲瘑
+  static setItem(key = KEY, value = "") {
+    if (typeof key === "string") {
+      const stringify = JSON.stringify(value);
+      const encrypt = CryptoJS.AES.encrypt(
+        stringify,
+        CryptoJS.enc.Utf8.parse(aseKey),
+        {
+          mode: CryptoJS.mode.ECB,
+          padding: CryptoJS.pad.Pkcs7,
+        }
+      ).toString();
+      window.sessionStorage.setItem(key, encrypt);
+      return encrypt;
+    }
+  }
+  // 瑙ｅ瘑
+  static getItem(key = KEY) {
+    const ssStr = window.sessionStorage.getItem(key) || "";
+    try {
+      if (ssStr) {
+        const decrypt = CryptoJS.AES.decrypt(
+          ssStr,
+          CryptoJS.enc.Utf8.parse(aseKey),
+          {
+            mode: CryptoJS.mode.ECB,
+            padding: CryptoJS.pad.Pkcs7,
+          }
+        ).toString(CryptoJS.enc.Utf8);
+        const parseStr = JSON.parse(decrypt);
+        return parseStr;
+      }
+      return "";
+    } catch (e) {
+      return "";
+    }
+  }
+  // 鍒犻櫎
+  static remove(key) {
+    window.sessionStorage.removeItem(key);
+  }
+}
diff --git a/portal-manager-ui/admin/src/views/dataActuary/behaviour/pathanalyse/pathAnalyse.vue b/portal-manager-ui/admin/src/views/dataActuary/behaviour/pathanalyse/pathAnalyse.vue
index 42db08e199ec562a318bd08149cd63ae5e0d4d2b..12a7795b0de5c1d1b83f106c33602c1a24564b2a 100644
--- a/portal-manager-ui/admin/src/views/dataActuary/behaviour/pathanalyse/pathAnalyse.vue
+++ b/portal-manager-ui/admin/src/views/dataActuary/behaviour/pathanalyse/pathAnalyse.vue
@@ -80,23 +80,30 @@ export default {
       this.queryform.dateTimeStart = this.time ? this.time[0] : null;
       this.queryform.dateTimeStart = this.time ? this.time[1] : null;
       getWayAccessAnalyse(this.queryform).then((res) => {
-        let data = res.data.data.map((item, i) =>
-          item.code != "/sceneSignIn"
-            ? {
-                name: item.name,
-              }
-            : ""
-        );
+        let newobj = {};
+        let data = res.data.data.reduce((preVal, curVal) => {
+          newobj[curVal.name]
+            ? ""
+            : (newobj[curVal.name] = preVal.push(curVal));
+          return preVal;
+        }, []);
+        // let data = res.data.data.map((item, i) =>
+        //   item.code != "/sceneSignIn"
+        //     ? {
+        //         name: item.name,
+        //       }
+        //     : ""
+        // );
         let links = res.data.links.map((item) => ({
           source: item.sourceName,
           target: item.targetName,
           value: item.value,
-            lineStyle: {
-              color: "source",
-            },
+          lineStyle: {
+            color: "source",
+          },
         }));
         data = data.filter((v) => v);
-        links = links.filter((v) => v.target != "棣栭〉");
+        links = links.filter((v) => v.target != "棣栭〉" && v.target != v.source);
         this.init(data, links);
       });
     },
diff --git a/portal-manager-ui/admin/src/views/dataActuary/behaviour/product/product.vue b/portal-manager-ui/admin/src/views/dataActuary/behaviour/product/product.vue
index 3b1035d6fa544dca6b104213f413c338cd73dae8..d45fa50ebb8578e26427822af63ebd5e7c3017b7 100644
--- a/portal-manager-ui/admin/src/views/dataActuary/behaviour/product/product.vue
+++ b/portal-manager-ui/admin/src/views/dataActuary/behaviour/product/product.vue
@@ -217,12 +217,14 @@ export default {
   display: flex;
 
   .img-dv {
-    width: 60%;
+    flex: 1;
     margin: 100px;
+    height: 600px;
     position: relative;
 
     img {
       width: 100%;
+      height: 100%;
     }
 
     #queuing {
@@ -236,7 +238,7 @@ export default {
   }
 
   .list-dv {
-    width: 40%;
+    width: 55%;
     min-height: 100%;
     border-left: solid 1px #efefef;
     box-sizing: border-box;
diff --git a/portal-manager-ui/admin/src/views/dataActuary/behaviour/usinghabit/usinghabit.vue b/portal-manager-ui/admin/src/views/dataActuary/behaviour/usinghabit/usinghabit.vue
index 836b3187ee05023d3b600cbf6fdc734c66be6e1e..ba14df45fc76462c41249b30daf884ab9b0f5dd6 100644
--- a/portal-manager-ui/admin/src/views/dataActuary/behaviour/usinghabit/usinghabit.vue
+++ b/portal-manager-ui/admin/src/views/dataActuary/behaviour/usinghabit/usinghabit.vue
@@ -1,231 +1,289 @@
 <template>
-	<!-- 浣跨敤涔犳儻鍒嗘瀽 -->
-	<div class="page">
-		<a-form-model :model="queryform" :label-col="labelCol" :wrapper-col="wrapperCol" layout="inline">
-			<a-form-model-item>
-				<a-select v-model="queryform.productId" style="width: 200px" placeholder="閫夋嫨浜у搧">
-					<a-select-option :value="item.id" v-for="(item,index) in product" :key="index">
-						{{item.title}}
-					</a-select-option>
-				</a-select>
-			</a-form-model-item>
-			<a-form-model-item>
-				<a-range-picker valueFormat="yyyy-MM-DD" v-model="time" style="width: 300px" :allowClear="false"/>
-			</a-form-model-item>
-			<a-form-model-item>
-				<a-button type="primary" class="addclass"  @click="getData">
-					寮€濮嬪垎鏋�
-				</a-button>
-			</a-form-model-item>
-		</a-form-model>
-		<div class="charts-box">
-			<!-- <div id="canal"></div> -->
-			<div id="type"></div>
-			<!-- <div id="way"></div> -->
-		</div>
-	</div>
+  <!-- 浣跨敤涔犳儻鍒嗘瀽 -->
+  <div class="page">
+    <a-form-model
+      :model="queryform"
+      :label-col="labelCol"
+      :wrapper-col="wrapperCol"
+      layout="inline"
+    >
+      <a-form-model-item>
+        <a-select
+          v-model="queryform.productId"
+          style="width: 200px"
+          placeholder="閫夋嫨浜у搧"
+        >
+          <a-select-option
+            :value="item.id"
+            v-for="(item, index) in product"
+            :key="index"
+          >
+            {{ item.title }}
+          </a-select-option>
+        </a-select>
+      </a-form-model-item>
+      <a-form-model-item>
+        <a-range-picker
+          valueFormat="yyyy-MM-DD"
+          v-model="time"
+          style="width: 300px"
+          :allowClear="false"
+        />
+      </a-form-model-item>
+      <a-form-model-item>
+        <a-button type="primary" class="addclass" @click="getData">
+          寮€濮嬪垎鏋�
+        </a-button>
+      </a-form-model-item>
+    </a-form-model>
+    <div class="charts-box">
+      <!-- <div id="canal"></div> -->
+      <div id="type"></div>
+      <!-- <div id="way"></div> -->
+    </div>
+  </div>
 </template>
 
 <script>
-	import * as echarts from 'echarts'
-	import moment from 'moment';
-	import {getUsageCensus} from '@/api/dataActuary.js'
-	import product from "../mixins/product"
-	export default {
-		mixins:[product],
-		data() {
-			return {
-				queryform: {
-					productId: 1,
-					dateTimeStart: moment().format('yyyy-MM-DD'),
-					dateTimeEnd: moment().format('yyyy-MM-DD'),
-					pageCode: '/'
-				},
-				time: [moment().format('yyyy-MM-DD'), moment().format('yyyy-MM-DD')],
-				product: [{
-					title: '鎺掗槦鏈�',
-					id: 1
-				}],
-				labelCol: {
-					span: 1
-				},
-				wrapperCol: {
-					span: 14
-				},
-			}
-		},
-		mounted() {
-			this.getData()
-		},
-		methods: {
-			getData() {
-				this.queryform.dateTimeStart = this.time ? this.time[0] : null
-				this.queryform.dateTimeEnd = this.time ? this.time[1] : null
-				getUsageCensus(this.queryform).then(res=>{
-					let data = res.data.map(({businessName,propValue})=>({name:businessName,value:propValue * 100}))
-					this.initType(data)
-				})
-			},
-			initWay(){
-				let chartDom = document.getElementById('way')
-				let myChart = echarts.init(chartDom);
-				myChart.setOption({
-					title: {
-						text: '鍙栧彿鏂瑰紡鍒嗘瀽',
-						left: 'center'
-					},
-					tooltip: {
-						trigger: 'item',
-					},
-					legend: {
-						bottom: 0,
-						left: 'center',
-						itemWidth: 10,
-						itemHeight: 10
-					},
-					color: ['#6395F9', '#64DAAB', '#647798', '#F6C02D', '#7567FA', '#75CBED'],
-					series: [{
-						name: 'Access From',
-						type: 'pie',
-						radius: '65%',
-						label: {
-							normal: {
-								formatter: '{d}%' //鑷畾涔夋樉绀烘牸寮�(b:name, c:value, d:鐧惧垎姣�)
-							}
-						},
-						labelLine: {
-							normal: {
-								length: 1
-							}
-						},
-						data: [{
-								value: 1048,
-								name: 'Search Engine'
-							},
-							{
-								value: 735,
-								name: 'Direct'
-							},
-							{
-								value: 580,
-								name: 'Email'
-							},
-							{
-								value: 484,
-								name: 'Union Ads'
-							},
-							{
-								value: 300,
-								name: 'Video Ads'
-							}
-						],
-					}]
-				})
-			},
-			initType(data) {
-				console.log(data)
-				let chartDom = document.getElementById('type')
-				let myChart = echarts.init(chartDom);
-				myChart.setOption({
-					title: {
-						text: this.queryform.productId==1?'鍙栧彿绫诲瀷鍒嗘瀽':'鍔熻兘浣跨敤鍒嗗竷',
-						left: 'center'
-					},
-					tooltip: {
-						trigger: 'item',
-					},
-					legend: {
-						bottom: 0,
-						left: 'center',
-						itemWidth: 10,
-						itemHeight: 10
-					},
-					color: ['#6395F9', '#64DAAB', '#647798', '#F6C02D', '#7567FA', '#75CBED'],
-					series: [{
-						type: 'pie',
-						radius: '65%',
-						label: {
-							normal: {
-								formatter: '{d}%' //鑷畾涔夋樉绀烘牸寮�(b:name, c:value, d:鐧惧垎姣�)
-							}
-						},
-						labelLine: {
-							normal: {
-								length: 1
-							}
-						},
-						data: data
-					}]
-				})
-			},
-			initCanal() {
-				let chartDom = document.getElementById('canal')
-				let myChart = echarts.init(chartDom);
-				myChart.setOption({
-					title: {
-						text: '鍙栧彿娓犻亾鍒嗘瀽',
-						left: 'center'
-					},
-					tooltip: {
-						trigger: 'item',
-					},
-					legend: {
-						bottom: 0,
-						left: 'center',
-						itemWidth: 10,
-						itemHeight: 10
-					},
-					color: ['#6395F9', '#64DAAB', '#647798', '#F6C02D', '#7567FA', '#75CBED'],
-					series: [{
-						name: 'Access From',
-						type: 'pie',
-						radius: '65%',
-						label: {
-							normal: {
-								formatter: '{d}%' //鑷畾涔夋樉绀烘牸寮�(b:name, c:value, d:鐧惧垎姣�)
-							}
-						},
-						labelLine: {
-							normal: {
-								length: 1
-							}
-						},
-						data: [{
-								value: 1048,
-								name: '缁堢鍙栧彿'
-							},
-							{
-								value: 735,
-								name: '鍦ㄧ嚎鍙栧彿'
-							}
-						]
-					}]
-				})
-			}
-		}
-	};
+import * as echarts from "echarts";
+import moment from "moment";
+import { getUsageCensus } from "@/api/dataActuary.js";
+import product from "../mixins/product";
+export default {
+  mixins: [product],
+  data() {
+    return {
+      queryform: {
+        productId: 1,
+        dateTimeStart: moment().format("yyyy-MM-DD"),
+        dateTimeEnd: moment().format("yyyy-MM-DD"),
+        pageCode: "/",
+      },
+      time: [moment().format("yyyy-MM-DD"), moment().format("yyyy-MM-DD")],
+      product: [
+        {
+          title: "鎺掗槦鏈�",
+          id: 1,
+        },
+      ],
+      labelCol: {
+        span: 1,
+      },
+      wrapperCol: {
+        span: 14,
+      },
+    };
+  },
+  mounted() {
+    this.getData();
+  },
+  methods: {
+    getData() {
+      this.queryform.dateTimeStart = this.time ? this.time[0] : null;
+      this.queryform.dateTimeEnd = this.time ? this.time[1] : null;
+      this.queryform.productId == 1
+        ? (this.queryform.businessCodeList = ["iDCardSignIn"])
+        : "";
+      console.log(this.queryform);
+      getUsageCensus(this.queryform).then((res) => {
+        let data = res.data.map(({ businessName, propValue }) => ({
+          name: businessName,
+          value: propValue * 100,
+        }));
+        this.initType(data);
+      });
+    },
+    initWay() {
+      let chartDom = document.getElementById("way");
+      let myChart = echarts.init(chartDom);
+      myChart.setOption({
+        title: {
+          text: "鍙栧彿鏂瑰紡鍒嗘瀽",
+          left: "center",
+        },
+        tooltip: {
+          trigger: "item",
+        },
+        legend: {
+          bottom: 0,
+          left: "center",
+          itemWidth: 10,
+          itemHeight: 10,
+        },
+        color: [
+          "#6395F9",
+          "#64DAAB",
+          "#647798",
+          "#F6C02D",
+          "#7567FA",
+          "#75CBED",
+        ],
+        series: [
+          {
+            name: "Access From",
+            type: "pie",
+            radius: "65%",
+            label: {
+              normal: {
+                formatter: "{d}%", //鑷畾涔夋樉绀烘牸寮�(b:name, c:value, d:鐧惧垎姣�)
+              },
+            },
+            labelLine: {
+              normal: {
+                length: 1,
+              },
+            },
+            data: [
+              {
+                value: 1048,
+                name: "Search Engine",
+              },
+              {
+                value: 735,
+                name: "Direct",
+              },
+              {
+                value: 580,
+                name: "Email",
+              },
+              {
+                value: 484,
+                name: "Union Ads",
+              },
+              {
+                value: 300,
+                name: "Video Ads",
+              },
+            ],
+          },
+        ],
+      });
+    },
+    initType(data) {
+      console.log(data);
+      let chartDom = document.getElementById("type");
+      let myChart = echarts.init(chartDom);
+      myChart.setOption({
+        title: {
+          text: this.queryform.productId == 1 ? "鍙栧彿绫诲瀷鍒嗘瀽" : "鍔熻兘浣跨敤鍒嗗竷",
+          left: "center",
+        },
+        tooltip: {
+          trigger: "item",
+        },
+        legend: {
+          bottom: 0,
+          left: "center",
+          itemWidth: 10,
+          itemHeight: 10,
+        },
+        color: [
+          "#6395F9",
+          "#64DAAB",
+          "#647798",
+          "#F6C02D",
+          "#7567FA",
+          "#75CBED",
+        ],
+        series: [
+          {
+            type: "pie",
+            radius: "65%",
+            label: {
+              normal: {
+                formatter: "{d}%", //鑷畾涔夋樉绀烘牸寮�(b:name, c:value, d:鐧惧垎姣�)
+              },
+            },
+            labelLine: {
+              normal: {
+                length: 1,
+              },
+            },
+            data: data,
+          },
+        ],
+      });
+    },
+    initCanal() {
+      let chartDom = document.getElementById("canal");
+      let myChart = echarts.init(chartDom);
+      myChart.setOption({
+        title: {
+          text: "鍙栧彿娓犻亾鍒嗘瀽",
+          left: "center",
+        },
+        tooltip: {
+          trigger: "item",
+        },
+        legend: {
+          bottom: 0,
+          left: "center",
+          itemWidth: 10,
+          itemHeight: 10,
+        },
+        color: [
+          "#6395F9",
+          "#64DAAB",
+          "#647798",
+          "#F6C02D",
+          "#7567FA",
+          "#75CBED",
+        ],
+        series: [
+          {
+            name: "Access From",
+            type: "pie",
+            radius: "65%",
+            label: {
+              normal: {
+                formatter: "{d}%", //鑷畾涔夋樉绀烘牸寮�(b:name, c:value, d:鐧惧垎姣�)
+              },
+            },
+            labelLine: {
+              normal: {
+                length: 1,
+              },
+            },
+            data: [
+              {
+                value: 1048,
+                name: "缁堢鍙栧彿",
+              },
+              {
+                value: 735,
+                name: "鍦ㄧ嚎鍙栧彿",
+              },
+            ],
+          },
+        ],
+      });
+    },
+  },
+};
 </script>
 
 <style lang="less" scoped>
-	.page {
-		height: calc(100% - 50px);
-		display: flex;
-		flex-direction: column;
+.page {
+  height: calc(100% - 50px);
+  display: flex;
+  flex-direction: column;
 
-		/deep/.ant-form {
-			padding: 15px;
-		}
+  /deep/.ant-form {
+    padding: 15px;
+  }
 
-		.charts-box {
-			flex: 1;
-			display: flex;
-			justify-content: center;
-			padding: 50px 0;
+  .charts-box {
+    flex: 1;
+    display: flex;
+    justify-content: center;
+    padding: 50px 0;
 
-			#canal,#type,#way {
-				width: 30%;
-				height: 100%;
-			}
-		}
-	}
-</style>
\ No newline at end of file
+    #canal,
+    #type,
+    #way {
+      width: 30%;
+      height: 100%;
+    }
+  }
+}
+</style>
diff --git a/portal-manager-ui/admin/src/views/dataActuary/portrayal/portrayalBase/index.vue b/portal-manager-ui/admin/src/views/dataActuary/portrayal/portrayalBase/index.vue
index d0cf361b87c3cf4c67ee0b1dca290da5554442b7..95db86af86b96d7acf3de02adf7fcfd315b89ab3 100644
--- a/portal-manager-ui/admin/src/views/dataActuary/portrayal/portrayalBase/index.vue
+++ b/portal-manager-ui/admin/src/views/dataActuary/portrayal/portrayalBase/index.vue
@@ -1,575 +1,723 @@
 <template>
-	<div>
-		<a-card :bordered="false" class="mb_15">
-			<template slot="title">
-				<div class="head">
-					<div class="head_title">鏁翠綋鎯呭喌</div>
-					<div class="head_desc">鏇存柊鏃堕棿锛歿{ nowDate }}</div>
-				</div>
-			</template>
-			<a-row type="flex" align="middle">
-				<a-col :span="4">
-					<div class="f_40 f_center warning">{{ massCount }}</div>
-					<div class="f_center">缇や紬娉ㄥ唽鎬婚噺</div>
-					<!-- <div class="f_center primary" @click="toTable">鐐瑰嚮鏌ョ湅鎶ヨ〃</div> -->
-				</a-col>
-				<a-col :span="20">
-					<lineChart :id="`one_line`" :title="`杩�30鏃ユ敞鍐屾儏鍐靛垎鏋恅" :datas="oneLineData" :height="200" :width="1420" />
-				</a-col>
-			</a-row>
-		</a-card>
-		<a-card :bordered="false" class="mb_15">
-			<template slot="title">
-				<div class="head">
-					<div class="head_title">娉ㄥ唽鐢ㄦ埛鐞嗚В</div>
-					<div class="head_desc"></div>
-				</div>
-			</template>
-			<a-row>
-				<a-col :span="8">
-					<map-chart :id="`one_map`" :datas="oneMapData" :height="400" :width="550" />
-				</a-col>
-				<a-col :span="8">
-					<a-table :rowKey="(record, index) => { return index }" :dataSource="provinces"
-						:columns="provincesColumns" :scroll="{ y: 300 }" :pagination="false">
-					</a-table>
-				</a-col>
-				<a-col :span="8">
-					<pieChart :id="`one_pie`" :height="400" :width="550" :datas="onePieData" />
-				</a-col>
-				<a-col :span="12">
-					<doublePieChart :id="`two_pie`" :height="300" :width="800" :datas="twoPieData" />
-				</a-col>
-				<a-col :span="12">
-					<barChart :id="`one_bar`" :height="300" :width="800" :datas="oneBarData" />
-				</a-col>
-				<a-col :span="12">
-					<barChart :id="`two_bar`" :height="300" :width="800" :datas="twoBarData" />
-				</a-col>
-				<a-col :span="12">
-					<pieChart :id="`three_pie`" :height="300" :width="800" :datas="threePieData" />
-				</a-col>
-				<a-col :span="12">
-				</a-col>
-				<a-col :span="12">
-				</a-col>
-			</a-row>
-		</a-card>
-		<a-card :bordered="false" class="mb_15">
-			<template slot="title">
-				<div class="head">
-					<div class="head_title">鍔炰欢鐢ㄦ埛鐞嗚В</div>
-					<div class="head_desc"></div>
-				</div>
-			</template>
-			<a-row type="flex" align="middle">
-				<a-row>
-					<a-col :span="8">
-						<map-chart :id="`two_map`" :datas="oneMapData2" :height="400" :width="550" />
-					</a-col>
-					<a-col :span="8">
-						<a-table :rowKey="(record, index) => { return index }" :dataSource="provinces2"
-							:columns="provincesColumns2" :pagination="false" :scroll="{ y: 300 }">
-						</a-table>
-					</a-col>
-					<a-col :span="8">
-						<pieChart :id="`four_pie`" :height="400" :width="550" :datas="onePieData2" />
-					</a-col>
-					<a-col :span="12">
-						<doublePieChart :id="`five_pie`" :height="300" :width="800" :datas="twoPieData2" />
-					</a-col>
-					<a-col :span="12">
-						<barChart :id="`six_bar`" :height="300" :width="800" :datas="oneBarData2" />
-					</a-col>
-					<a-col :span="12">
-						<barChart :id="`three_bar`" :height="300" :width="800" :datas="twoBarData2" />
-					</a-col>
-					<a-col :span="12">
-						<pieChart :id="`six_pie`" :height="300" :width="800" :datas="threePieData2" />
-					</a-col>
-					<a-col :span="12">
-					</a-col>
-					<a-col :span="12">
-					</a-col>
-				</a-row>
-			</a-row>
-		</a-card>
-	</div>
+  <div>
+    <a-card :bordered="false" class="mb_15">
+      <template slot="title">
+        <div class="head">
+          <div class="head_title">鏁翠綋鎯呭喌</div>
+          <div class="head_desc">鏇存柊鏃堕棿锛歿{ nowDate }}</div>
+        </div>
+      </template>
+      <a-row type="flex" align="middle">
+        <a-col :span="4">
+          <div class="f_40 f_center warning">{{ massCount }}</div>
+          <div class="f_center">缇や紬娉ㄥ唽鎬婚噺</div>
+          <!-- <div class="f_center primary" @click="toTable">鐐瑰嚮鏌ョ湅鎶ヨ〃</div> -->
+        </a-col>
+        <a-col :span="20">
+          <lineChart
+            :id="`one_line`"
+            :title="`杩�30鏃ユ敞鍐屾儏鍐靛垎鏋恅"
+            :datas="oneLineData"
+            :height="200"
+            :width="1420"
+          />
+        </a-col>
+      </a-row>
+    </a-card>
+    <a-card :bordered="false" class="mb_15">
+      <template slot="title">
+        <div class="head">
+          <div class="head_title">娉ㄥ唽鐢ㄦ埛鐞嗚В</div>
+          <div class="head_desc"></div>
+        </div>
+      </template>
+      <a-row>
+        <a-col :span="8">
+          <map-chart
+            :id="`one_map`"
+            :datas="oneMapData"
+            :height="400"
+            :width="550"
+          />
+        </a-col>
+        <a-col :span="8">
+          <a-table
+            :rowKey="
+              (record, index) => {
+                return index;
+              }
+            "
+            :dataSource="provinces"
+            :columns="provincesColumns"
+            :scroll="{ y: 300 }"
+            :pagination="false"
+          >
+          </a-table>
+        </a-col>
+        <a-col :span="8">
+          <pieChart
+            :id="`one_pie`"
+            :height="400"
+            :width="550"
+            :datas="onePieData"
+          />
+        </a-col>
+        <a-col :span="12">
+          <doublePieChart
+            :id="`two_pie`"
+            :height="300"
+            :width="800"
+            :datas="twoPieData"
+          />
+        </a-col>
+        <a-col :span="12">
+          <barChart
+            :id="`one_bar`"
+            :height="300"
+            :width="800"
+            :datas="oneBarData"
+          />
+        </a-col>
+        <a-col :span="12">
+          <barChart
+            :id="`two_bar`"
+            :height="300"
+            :width="800"
+            :datas="twoBarData"
+          />
+        </a-col>
+        <a-col :span="12">
+          <pieChart
+            :id="`three_pie`"
+            :height="300"
+            :width="800"
+            :datas="threePieData"
+          />
+        </a-col>
+        <a-col :span="12"> </a-col>
+        <a-col :span="12"> </a-col>
+      </a-row>
+    </a-card>
+    <a-card :bordered="false" class="mb_15">
+      <template slot="title">
+        <div class="head">
+          <div class="head_title">鍔炰欢鐢ㄦ埛鐞嗚В</div>
+          <div class="head_desc"></div>
+        </div>
+      </template>
+      <a-row type="flex" align="middle">
+        <a-row>
+          <a-col :span="8">
+            <map-chart
+              :id="`two_map`"
+              :datas="oneMapData2"
+              :height="400"
+              :width="550"
+            />
+          </a-col>
+          <a-col :span="8">
+            <a-table
+              :rowKey="
+                (record, index) => {
+                  return index;
+                }
+              "
+              :dataSource="provinces2"
+              :columns="provincesColumns2"
+              :pagination="false"
+              :scroll="{ y: 300 }"
+            >
+            </a-table>
+          </a-col>
+          <a-col :span="8">
+            <pieChart
+              :id="`four_pie`"
+              :height="400"
+              :width="550"
+              :datas="onePieData2"
+            />
+          </a-col>
+          <a-col :span="12">
+            <doublePieChart
+              :id="`five_pie`"
+              :height="300"
+              :width="800"
+              :datas="twoPieData2"
+            />
+          </a-col>
+          <a-col :span="12">
+            <barChart
+              :id="`six_bar`"
+              :height="300"
+              :width="800"
+              :datas="oneBarData2"
+            />
+          </a-col>
+          <a-col :span="12">
+            <barChart
+              :id="`three_bar`"
+              :height="300"
+              :width="800"
+              :datas="twoBarData2"
+            />
+          </a-col>
+          <a-col :span="12">
+            <pieChart
+              :id="`six_pie`"
+              :height="300"
+              :width="800"
+              :datas="threePieData2"
+            />
+          </a-col>
+          <a-col :span="12"> </a-col>
+          <a-col :span="12"> </a-col>
+        </a-row>
+      </a-row>
+    </a-card>
+  </div>
 </template>
 
-<script >
-import barChart from '../../business/Component/bar/index.vue'
-import doublePieChart from "../../business/Component/doublePie/index.vue"
-import pieChart from "../../business/Component/pie/index.vue"
-import lineChart from "../../business/Component/line/index.vue"
-import mapChart from "../../business/Component/map/index.vue"
-import moment from "moment"
+<script>
+import barChart from "../../business/Component/bar/index.vue";
+import doublePieChart from "../../business/Component/doublePie/index.vue";
+import pieChart from "../../business/Component/pie/index.vue";
+import lineChart from "../../business/Component/line/index.vue";
+import mapChart from "../../business/Component/map/index.vue";
+import moment from "moment";
 import {
-	peopleQs, registerProvince, registerBwd, registerSex, registerAge, registerNation, provinceCase, bwdStatistic,
-	provinceStatistic, genderRateType, ageRate, TopNationStatistic,
-} from "@/api/userPortrait.js"
+  peopleQs,
+  registerProvince,
+  registerBwd,
+  registerSex,
+  registerAge,
+  registerNation,
+  provinceCase,
+  bwdStatistic,
+  provinceStatistic,
+  genderRateType,
+  ageRate,
+  TopNationStatistic,
+} from "@/api/userPortrait.js";
 export default {
-	components: {
-		mapChart, pieChart, lineChart, doublePieChart, barChart
-	},
-	data() {
-		return {
-			options: [
-				{
-					value: '0',
-					label: '浠婂ぉ',
-				},
-				{
-					value: '1',
-					label: '杩�7鏃�',
-				},
-				{
-					value: '2',
-					label: '杩�30鏃�',
-				},
-				{
-					value: '3',
-					label: '杩�3涓湀',
-				},
-				{
-					value: '4',
-					label: '鏈勾搴�',
-				},
-			],
-			oneLineData: {},
-			oneMapData: {},
-			oneMapData2: {},
-			onePieData: {},
-			onePieData2: {},
-			twoPieData: {},
-			twoPieData2: {},
-			oneBarData: {},
-			oneBarData2: {},
-			twoBarData: {},
-			twoBarData2: {},
-			threePieData: {},
-			threePieData2: {},
-			provinces: [
-				{
-					ranking: 1,
-					province: '鍥涘窛鐪�',
-					people: '999',
-					percent: '2'
-				},
-				{
-					ranking: 2,
-					province: '鍥涘窛鐪�',
-					people: '999',
-					percent: '2'
-				},
-			],
-			provinces2: [
-				{
-					ranking: 1,
-					province: '鍥涘窛鐪�',
-					people: '999',
-					percent: '2'
-				},
-				{
-					ranking: 2,
-					province: '鍥涘窛鐪�',
-					people: '999',
-					percent: '2'
-				},
-			],
-			provincesColumns: [
-				{
-					key: 'ranking',
-					title: '搴忓彿',
-					dataIndex: 'id',
+  components: {
+    mapChart,
+    pieChart,
+    lineChart,
+    doublePieChart,
+    barChart,
+  },
+  data() {
+    return {
+      options: [
+        {
+          value: "0",
+          label: "浠婂ぉ",
+        },
+        {
+          value: "1",
+          label: "杩�7鏃�",
+        },
+        {
+          value: "2",
+          label: "杩�30鏃�",
+        },
+        {
+          value: "3",
+          label: "杩�3涓湀",
+        },
+        {
+          value: "4",
+          label: "鏈勾搴�",
+        },
+      ],
+      oneLineData: {},
+      oneMapData: {},
+      oneMapData2: {},
+      onePieData: {},
+      onePieData2: {},
+      twoPieData: {},
+      twoPieData2: {},
+      oneBarData: {},
+      oneBarData2: {},
+      twoBarData: {},
+      twoBarData2: {},
+      threePieData: {},
+      threePieData2: {},
+      provinces: [
+        {
+          ranking: 1,
+          province: "鍥涘窛鐪�",
+          people: "999",
+          percent: "2",
+        },
+        {
+          ranking: 2,
+          province: "鍥涘窛鐪�",
+          people: "999",
+          percent: "2",
+        },
+      ],
+      provinces2: [
+        {
+          ranking: 1,
+          province: "鍥涘窛鐪�",
+          people: "999",
+          percent: "2",
+        },
+        {
+          ranking: 2,
+          province: "鍥涘窛鐪�",
+          people: "999",
+          percent: "2",
+        },
+      ],
+      provincesColumns: [
+        {
+          key: "ranking",
+          title: "搴忓彿",
+          dataIndex: "id",
+        },
+        {
+          key: "province",
+          title: "鐪佷唤",
+          dataIndex: "province",
+        },
+        {
+          key: "value",
+          title: "娉ㄥ唽浜烘暟",
+          dataIndex: "value",
+        },
+        {
+          key: "zb_lv",
+          title: "娉ㄥ唽鍗犳瘮",
+          dataIndex: "zb_lv",
+          customRender(text, record, index) {
+            return parseFloat((text * 100).toFixed(2)) + "%";
+          },
+        },
+      ],
+      provincesColumns2: [
+        {
+          key: "ranking",
+          title: "搴忓彿",
+          dataIndex: "id",
+        },
+        {
+          key: "province",
+          title: "鐪佷唤",
+          dataIndex: "province",
+        },
+        {
+          key: "value",
+          title: "鍔炰欢浜烘暟",
+          dataIndex: "value",
+        },
+        {
+          key: "nums_val",
+          title: "鍔炰欢鍗犳瘮",
+          dataIndex: "nums_val",
+          customRender(text, record, index) {
+            return parseFloat((text * 100).toFixed(2)) + "%";
+          },
+        },
+      ],
+      takeNumber: "0",
+      nowDate: "",
 
-				},
-				{
-					key: 'province',
-					title: '鐪佷唤',
-					dataIndex: 'province',
-				},
-				{
-					key: 'value',
-					title: '娉ㄥ唽浜烘暟',
-					dataIndex: 'value',
-				},
-				{
-					key: 'zb_lv',
-					title: '娉ㄥ唽鍗犳瘮',
-					dataIndex: 'zb_lv',
-					customRender(text, record, index) {
-						return parseFloat((text * 100).toFixed(2)) + "%"
-					}
-				},
-			],
-			provincesColumns2: [
-				{
-					key: 'ranking',
-					title: '搴忓彿',
-					dataIndex: 'id',
+      massCount: "0", //缇や紬鎬婚噺
+      timeArr: [], //缇や紬娉ㄥ唽鏃堕棿
 
-				},
-				{
-					key: 'province',
-					title: '鐪佷唤',
-					dataIndex: 'province',
-				},
-				{
-					key: 'value',
-					title: '鍔炰欢浜烘暟',
-					dataIndex: 'value',
-				},
-				{
-					key: 'nums_val',
-					title: '鍔炰欢鍗犳瘮',
-					dataIndex: 'nums_val',
-					customRender(text, record, index) {
-						return parseFloat((text * 100).toFixed(2)) + "%"
-					}
-				},
-			],
-			takeNumber: '0',
-			nowDate: '',
+      doTotal: 0,
+    };
+  },
+  created() {},
+  mounted() {
+    this.getPeopleQs();
+    this.getRegisterProvince();
+    this.getRegisterBwd();
+    this.getRegisterSex();
+    this.getRegisterAge();
+    this.getRegisterNation();
 
-			massCount: '0',//缇や紬鎬婚噺
-			timeArr: [],//缇や紬娉ㄥ唽鏃堕棿
+    this.getProvinceCase();
+    this.getProvinceStatistic();
+    this.getBwdStatistic();
+    this.getGenderRateType();
+    this.getAgeRate();
+    this.getTopNationStatistic();
+    this.nowDate = moment(new Date()).format("YYYY-MM-DD h:mm:ss");
+  },
+  methods: {
+    toTable() {
+      this.$router.push({ path: "register" });
+    },
+    //鏁翠綋鎯呭喌
+    async getPeopleQs() {
+      let res = await peopleQs({ siteid: localStorage.getItem("siteId") });
+      if (res.code == 1) {
+        this.massCount = res.data.count;
+        let time = res.data.list?.map((i) => {
+          //寰幆鑾峰彇鏃堕棿
+          return moment(i.datetime).format("MM-DD");
+        });
+        let take = [];
+        let app = [];
+        let Applets = [];
+        res.data.list?.forEach((i) => {
+          i.row.forEach((j) => {
+            if (j.register_type == "take") {
+              //寰幆鑾峰彇鎺掑彿鏈烘敞鍐屾儏鍐�
+              return take.push(j.count);
+            }
+            if (j.register_type == "app") {
+              //寰幆鑾峰彇鑷姪缁堢娉ㄥ唽鎯呭喌
+              return app.push(j.count);
+            }
+            if (j.register_type == "Applets") {
+              //寰幆鑾峰彇寰畼缃戞敞鍐屾儏鍐�
+              return Applets.push(j.count);
+            }
+          });
+        });
+        this.oneLineData = {
+          title: "杩�30鏃ユ敞鍐屾儏鍐靛垎鏋愶細",
+          legend: [
+            "鑷姪鏈嶅姟绯荤粺娉ㄥ唽浜烘暟",
+            "寰畼缃戞敞鍐屼汉鏁�",
+            "鎺掗槦绯荤粺娉ㄥ唽浜烘暟",
+          ],
+          xData: time,
+          dataList: [
+            { name: "鑷姪鏈嶅姟绯荤粺娉ㄥ唽浜烘暟", data: app },
+            { name: "寰畼缃戞敞鍐屼汉鏁�", data: Applets },
+            { name: "鎺掗槦绯荤粺娉ㄥ唽浜烘暟", data: take },
+          ],
+        };
 
-			doTotal: 0,
-		}
-	},
-	created() {
-
-	},
-	mounted() {
-		this.getPeopleQs()
-		this.getRegisterProvince()
-		this.getRegisterBwd()
-		this.getRegisterSex()
-		this.getRegisterAge()
-		this.getRegisterNation()
-
-		this.getProvinceCase()
-		this.getProvinceStatistic()
-		this.getBwdStatistic()
-		this.getGenderRateType()
-		this.getAgeRate()
-		this.getTopNationStatistic()
-		this.nowDate = moment(new Date()).format('YYYY-MM-DD h:mm:ss')
-	},
-	methods: {
-		toTable() {
-			this.$router.push({ path: 'register' })
-		},
-		//鏁翠綋鎯呭喌
-		async getPeopleQs() {
-			let res = await peopleQs({ siteid: localStorage.getItem('siteId') })
-			if (res.code == 1) {
-				this.massCount = res.data.count
-				let time = res.data.list?.map(i => { //寰幆鑾峰彇鏃堕棿
-					return moment(i.datetime).format('MM-DD')
-				})
-				let take = []
-				let app = []
-				let Applets = []
-				res.data.list?.forEach(i => {
-					i.row.forEach(j => {
-						if (j.register_type == 'take') {//寰幆鑾峰彇鎺掑彿鏈烘敞鍐屾儏鍐�
-							return take.push(j.count)
-						}
-						if (j.register_type == 'app') {//寰幆鑾峰彇鑷姪缁堢娉ㄥ唽鎯呭喌
-							return app.push(j.count)
-						}
-						if (j.register_type == 'Applets') {//寰幆鑾峰彇寰畼缃戞敞鍐屾儏鍐�
-							return Applets.push(j.count)
-						}
-					})
-				})
-				this.oneLineData = {
-					title: '杩�30鏃ユ敞鍐屾儏鍐靛垎鏋愶細',
-					legend: ['鑷姪鏈嶅姟绯荤粺娉ㄥ唽浜烘暟', '寰畼缃戞敞鍐屼汉鏁�', '鎺掗槦绯荤粺娉ㄥ唽浜烘暟'],
-					xData: time,
-					dataList: [
-						{ name: '鑷姪鏈嶅姟绯荤粺娉ㄥ唽浜烘暟', data: app },
-						{ name: '寰畼缃戞敞鍐屼汉鏁�', data: Applets },
-						{ name: '鎺掗槦绯荤粺娉ㄥ唽浜烘暟', data: take },
-					]
-				}
-			}
-		},
-		//鍖哄煙娉ㄥ唽鎯呭喌
-		async getRegisterProvince() {
-			let res = await registerProvince({ siteid: localStorage.getItem('siteId') })
-			let arr2 = res.data.sort(function (a, b) {
-				return b.count - a.count;
-			})
-			let arr = arr2.map((i, j) => {
-				i.id = j + 1
-				i.name = i.province
-				i.value = i.count
-				return i
-			})
-			// console.log(arr)
-			this.oneMapData = {
-				title: "娉ㄥ唽鐢ㄦ埛鍦板煙鍒嗘瀽",
-				data: arr
-			}
-			this.provinces = arr
-			this.onePieData = {
-				title: '',
-				type: 'scroll',
-				legend: arr.forEach(i => { return i.province }),
-				data: arr
-			}
-		},
-		//娉ㄥ唽鍒嗗竷鎯呭喌
-		async getRegisterBwd() {
-			let res = await registerBwd({ siteid: localStorage.getItem('siteId') })
-			this.twoPieData = {
-				title: '鏈湴浜轰笌澶栧湴浜烘敞鍐屽垎甯�',
-				pieName: '鍒嗗竷璇︽儏',
-				firstName: '瀹滃甯傛湰鍦颁汉娉ㄥ唽鍗犳瘮',
-				firstVal: res.data.bd_lv,
-				firstTotal: 1,
-				secondName: '澶栧湴浜烘敞鍐屽崰姣�',
-				secondVal: res.data.wd_lv,
-				secondTotal: 1,
-			}
-
-		},
-		//娉ㄥ唽鎬у埆鍒嗗竷鎯呭喌
-		async getRegisterSex() {
-			let res = await registerSex({ siteid: localStorage.getItem('siteId') })
-			// console.log(res)
-			if (res.data ? res.data.length > 0 : '') {
-				let man = res.data[0].row
-				let woman = res.data[1].row
-				this.oneBarData = {
-					title: '鎬у埆鍒嗗竷',
-					xData: ['鐢�', '濂�'],
-					data: [
-						{ name: '鑷姪鏈嶅姟绯荤粺娉ㄥ唽浜烘暟', type: 'bar', data: [man[1].count || 0, woman[1].count || 0] },
-						{ name: '寰畼缃戞敞鍐屼汉鏁�', type: 'bar', data: [man[2].count || 0, woman[2].count || 0] },
-						{ name: '鎺掗槦绯荤粺娉ㄥ唽浜烘暟', type: 'bar', data: [man[0].count || 0, woman[0].count || 0] },
-					]
-				}
-			}
-		},
-		//娉ㄥ唽骞撮緞鍒嗗竷鎯呭喌
-		async getRegisterAge() {
-			let res = await registerAge({ siteid: localStorage.getItem('siteId') })
-			// console.log(res)
-			let age_area = res.data.map(i => {
-				return i.age_area
-			})
-			let total = 0
-			let count = res.data.map(i => {
-				total += i.nums
-				return i.nums
-			})
-			// console.log(total)
-			let zb = count.map(i => {
-				return parseFloat((i / total * 10000).toFixed(2))
-			})
-			// console.log(zb)
-			this.twoBarData = {
-				title: '骞撮緞鍒嗗竷',
-				xData: age_area,
-				data: [
-					{ name: '鍔炵悊娆℃暟', type: 'bar', data: count },
-					{ name: '鍗犳瘮', type: 'line', data: zb },
-				]
-			}
-		},
-		//娉ㄥ唽姘戞棌鍒嗗竷鎯呭喌
-		async getRegisterNation() {
-			let res = await registerNation({ siteid: localStorage.getItem('siteId') })
-			// console.log(res)
-			res.data.forEach(i => {
-				i.name = i.idcard_Nation
-				i.value = i.count
-			})
-			// console.log(res.data)
-			this.threePieData = {
-				title: '姘戞棌鍒嗗竷',
-				type: '',
-				legend: res.data,
-				data: res.data
-			}
-		},
-		//鍔炰欢鐢ㄦ埛鍦板煙鍒嗘瀽
-		async getProvinceCase() {
-			let res = await provinceCase({ siteid: localStorage.getItem('siteId'), selected: 2 })
-			// console.log(res)
-			let arr2 = res.data.sort(function (a, b) {
-				return b.nums - a.nums;
-			})
-			let arr = arr2.map((i, j) => {
-				i.id = j + 1
-				i.province = i.name
-				i.value = i.nums
-				this.doTotal += i.nums
-				return i
-			})
-			arr.forEach(i => {
-				i.nums_val = i.nums / this.doTotal
-			})
-			// console.log(arr)
-			this.oneMapData2 = {
-				title: "鍔炰欢鐢ㄦ埛鍦板煙鍒嗘瀽",
-				data: arr
-			}
-			this.provinces2 = arr
-		},
-		//鍔炰欢鐢ㄦ埛鍦板煙鍒嗘瀽
-		async getProvinceStatistic() {
-			let res = await provinceStatistic({ siteid: localStorage.getItem('siteId'), selected: 2, province: '鍥涘窛鐪�' })
-			// console.log(res)
-			res.data.forEach(i => {
-				i.value = i.count
-			})
-			this.onePieData2 = {
-				title: '',
-				type: 'scroll',
-				legend: res.data,
-				data: res.data
-			}
-		},
-		//鏈鍦板垎鏋�
-		async getBwdStatistic() {
-			let res = await bwdStatistic({ siteid: localStorage.getItem('siteId'), selected: 2 })
-			// console.log(res)
-			this.twoPieData2 = {
-				title: '鏈湴浜轰笌澶栧湴浜哄姙浠跺垎甯�',
-				pieName: '鍒嗗竷璇︽儏',
-				firstName: '瀹滃甯傛湰鍦颁汉鍔炰欢鍗犳瘮',
-				firstVal: res.data.bd_lv,
-				firstTotal: 1,
-				secondName: '澶栧湴浜哄姙浠跺崰姣�',
-				secondVal: res.data.wd_lv,
-				secondTotal: 1,
-			}
-		},
-		//鎬у埆鍔炰欢鍒嗘瀽
-		async getGenderRateType() {
-			let res = await genderRateType({ siteid: localStorage.getItem('siteId'), selected: 2 })
-			if (res.data ? res.data.length > 0 : '') {
-				let man = res.data[0].row
-				let woman = res.data[1].row
-				this.oneBarData2 = {
-					title: '鎬у埆鍒嗗竷',
-					xData: ['鐢�', '濂�'],
-					data: [
-						{ name: '鑷姪鏈嶅姟绯荤粺娉ㄥ唽浜烘暟', type: 'bar', data: [man[1].nums || 0, woman[1].nums || 0] },
-						{ name: '寰畼缃戞敞鍐屼汉鏁�', type: 'bar', data: [man[2].nums || 0, woman[2].nums || 0] },
-						{ name: '鎺掗槦绯荤粺娉ㄥ唽浜烘暟', type: 'bar', data: [man[0].nums || 0, woman[0].nums || 0] },
-					]
-				}
-			}
-		},
-		//鍔炰欢骞撮緞鍒嗘瀽
-		async getAgeRate() {
-			let res = await ageRate({ siteid: localStorage.getItem('siteId'), selected: 2 })
-			let age_area = res.data.list.map(i => {
-				return i.age_area
-			})
-			let total = 0
-			let count = res.data.list.map(i => {
-				total += i.nums
-				return i.nums
-			})
-			// console.log(total)
-			let zb = count.map(i => {
-				return parseFloat((i / total * 10000).toFixed(2))
-			})
-			// console.log(zb)
-			this.twoBarData2 = {
-				title: '骞撮緞鍒嗗竷',
-				xData: age_area,
-				data: [
-					{ name: '鍔炵悊娆℃暟', type: 'bar', data: count },
-					{ name: '鍗犳瘮', type: 'line', data: zb },
-				]
-			}
-		},
-		async getTopNationStatistic() {
-			let res = await TopNationStatistic({ siteid: localStorage.getItem('siteId'), selected: 2 })
-			// console.log(res)
-			res.data.forEach(i => {
-				i.name = i.idcard_Nation
-				i.value = i.count
-			})
-			// console.log(res.data)
-			this.threePieData2 = {
-				title: '姘戞棌鍒嗗竷',
-				type: '',
-				legend: res.data,
-				data: res.data
-			}
-		},
-	}
-}
+        this.$forceUpdate(this.oneLineData);
+      }
+    },
+    //鍖哄煙娉ㄥ唽鎯呭喌
+    async getRegisterProvince() {
+      let res = await registerProvince({
+        siteid: localStorage.getItem("siteId"),
+      });
+      let arr2 = res.data.sort(function (a, b) {
+        return b.count - a.count;
+      });
+      let arr = arr2.map((i, j) => {
+        i.id = j + 1;
+        i.name = i.province;
+        i.value = i.count;
+        return i;
+      });
+      // console.log(arr)
+      this.oneMapData = {
+        title: "娉ㄥ唽鐢ㄦ埛鍦板煙鍒嗘瀽",
+        data: arr,
+      };
+      this.provinces = arr;
+      this.onePieData = {
+        title: "",
+        type: "scroll",
+        legend: arr.forEach((i) => {
+          return i.province;
+        }),
+        data: arr,
+      };
+    },
+    //娉ㄥ唽鍒嗗竷鎯呭喌
+    async getRegisterBwd() {
+      let res = await registerBwd({ siteid: localStorage.getItem("siteId") });
+      this.twoPieData = {
+        title: "鏈湴浜轰笌澶栧湴浜烘敞鍐屽垎甯�",
+        pieName: "鍒嗗竷璇︽儏",
+        firstName: "瀹滃甯傛湰鍦颁汉娉ㄥ唽鍗犳瘮",
+        firstVal: res.data.bd_lv,
+        firstTotal: 1,
+        secondName: "澶栧湴浜烘敞鍐屽崰姣�",
+        secondVal: res.data.wd_lv,
+        secondTotal: 1,
+      };
+    },
+    //娉ㄥ唽鎬у埆鍒嗗竷鎯呭喌
+    async getRegisterSex() {
+      let res = await registerSex({ siteid: localStorage.getItem("siteId") });
+      // console.log(res)
+      if (res.data ? res.data.length > 0 : "") {
+        let man = res.data[0].row;
+        let woman = res.data[1].row;
+        this.oneBarData = {
+          title: "鎬у埆鍒嗗竷",
+          xData: ["鐢�", "濂�"],
+          data: [
+            {
+              name: "鑷姪鏈嶅姟绯荤粺娉ㄥ唽浜烘暟",
+              type: "bar",
+              data: [man[1].count || 0, woman[1].count || 0],
+            },
+            {
+              name: "寰畼缃戞敞鍐屼汉鏁�",
+              type: "bar",
+              data: [man[2].count || 0, woman[2].count || 0],
+            },
+            {
+              name: "鎺掗槦绯荤粺娉ㄥ唽浜烘暟",
+              type: "bar",
+              data: [man[0].count || 0, woman[0].count || 0],
+            },
+          ],
+        };
+      }
+    },
+    //娉ㄥ唽骞撮緞鍒嗗竷鎯呭喌
+    async getRegisterAge() {
+      let res = await registerAge({ siteid: localStorage.getItem("siteId") });
+      // console.log(res)
+      let age_area = res.data.map((i) => {
+        return i.age_area;
+      });
+      let total = 0;
+      let count = res.data.map((i) => {
+        total += i.nums;
+        return i.nums;
+      });
+      // console.log(total)
+      let zb = count.map((i) => {
+        return parseFloat(((i / total) * 10000).toFixed(2));
+      });
+      // console.log(zb)
+      this.twoBarData = {
+        title: "骞撮緞鍒嗗竷",
+        xData: age_area,
+        data: [
+          { name: "鍔炵悊娆℃暟", type: "bar", data: count },
+          { name: "鍗犳瘮", type: "line", data: zb },
+        ],
+      };
+    },
+    //娉ㄥ唽姘戞棌鍒嗗竷鎯呭喌
+    async getRegisterNation() {
+      let res = await registerNation({
+        siteid: localStorage.getItem("siteId"),
+      });
+      // console.log(res)
+      res.data.forEach((i) => {
+        i.name = i.idcard_Nation;
+        i.value = i.count;
+      });
+      // console.log(res.data)
+      this.threePieData = {
+        title: "姘戞棌鍒嗗竷",
+        type: "",
+        legend: res.data,
+        data: res.data,
+      };
+    },
+    //鍔炰欢鐢ㄦ埛鍦板煙鍒嗘瀽
+    async getProvinceCase() {
+      let res = await provinceCase({
+        siteid: localStorage.getItem("siteId"),
+        selected: 2,
+      });
+      // console.log(res)
+      let arr2 = res.data.sort(function (a, b) {
+        return b.nums - a.nums;
+      });
+      let arr = arr2.map((i, j) => {
+        i.id = j + 1;
+        i.province = i.name;
+        i.value = i.nums;
+        this.doTotal += i.nums;
+        return i;
+      });
+      arr.forEach((i) => {
+        i.nums_val = i.nums / this.doTotal;
+      });
+      // console.log(arr)
+      this.oneMapData2 = {
+        title: "鍔炰欢鐢ㄦ埛鍦板煙鍒嗘瀽",
+        data: arr,
+      };
+      this.provinces2 = arr;
+    },
+    //鍔炰欢鐢ㄦ埛鍦板煙鍒嗘瀽
+    async getProvinceStatistic() {
+      let res = await provinceStatistic({
+        siteid: localStorage.getItem("siteId"),
+        selected: 2,
+        province: "鍥涘窛鐪�",
+      });
+      // console.log(res)
+      res.data.forEach((i) => {
+        i.value = i.count;
+      });
+      this.onePieData2 = {
+        title: "",
+        type: "scroll",
+        legend: res.data,
+        data: res.data,
+      };
+    },
+    //鏈鍦板垎鏋�
+    async getBwdStatistic() {
+      let res = await bwdStatistic({
+        siteid: localStorage.getItem("siteId"),
+        selected: 2,
+      });
+      // console.log(res)
+      this.twoPieData2 = {
+        title: "鏈湴浜轰笌澶栧湴浜哄姙浠跺垎甯�",
+        pieName: "鍒嗗竷璇︽儏",
+        firstName: "瀹滃甯傛湰鍦颁汉鍔炰欢鍗犳瘮",
+        firstVal: res.data.bd_lv,
+        firstTotal: 1,
+        secondName: "澶栧湴浜哄姙浠跺崰姣�",
+        secondVal: res.data.wd_lv,
+        secondTotal: 1,
+      };
+    },
+    //鎬у埆鍔炰欢鍒嗘瀽
+    async getGenderRateType() {
+      let res = await genderRateType({
+        siteid: localStorage.getItem("siteId"),
+        selected: 2,
+      });
+      if (res.data ? res.data.length > 0 : "") {
+        let man = res.data[0].row;
+        let woman = res.data[1].row;
+        this.oneBarData2 = {
+          title: "鎬у埆鍒嗗竷",
+          xData: ["鐢�", "濂�"],
+          data: [
+            {
+              name: "鑷姪鏈嶅姟绯荤粺娉ㄥ唽浜烘暟",
+              type: "bar",
+              data: [man[1].nums || 0, woman[1].nums || 0],
+            },
+            {
+              name: "寰畼缃戞敞鍐屼汉鏁�",
+              type: "bar",
+              data: [man[2].nums || 0, woman[2].nums || 0],
+            },
+            {
+              name: "鎺掗槦绯荤粺娉ㄥ唽浜烘暟",
+              type: "bar",
+              data: [man[0].nums || 0, woman[0].nums || 0],
+            },
+          ],
+        };
+      }
+    },
+    //鍔炰欢骞撮緞鍒嗘瀽
+    async getAgeRate() {
+      let res = await ageRate({
+        siteid: localStorage.getItem("siteId"),
+        selected: 2,
+      });
+      let age_area = res.data.list.map((i) => {
+        return i.age_area;
+      });
+      let total = 0;
+      let count = res.data.list.map((i) => {
+        total += i.nums;
+        return i.nums;
+      });
+      // console.log(total)
+      let zb = count.map((i) => {
+        return parseFloat(((i / total) * 10000).toFixed(2));
+      });
+      // console.log(zb)
+      this.twoBarData2 = {
+        title: "骞撮緞鍒嗗竷",
+        xData: age_area,
+        data: [
+          { name: "鍔炵悊娆℃暟", type: "bar", data: count },
+          { name: "鍗犳瘮", type: "line", data: zb },
+        ],
+      };
+    },
+    async getTopNationStatistic() {
+      let res = await TopNationStatistic({
+        siteid: localStorage.getItem("siteId"),
+        selected: 2,
+      });
+      // console.log(res)
+      res.data.forEach((i) => {
+        i.name = i.idcard_Nation;
+        i.value = i.count;
+      });
+      // console.log(res.data)
+      this.threePieData2 = {
+        title: "姘戞棌鍒嗗竷",
+        type: "",
+        legend: res.data,
+        data: res.data,
+      };
+    },
+  },
+};
 </script>
 
 <style scoped lang="less">
 /deep/.ant-col {
-	margin-bottom: 20px;
+  margin-bottom: 20px;
 }
 
 .head {
-	display: flex;
-	justify-content: flex-start;
-	align-items: center;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
 
-	.head_title {
-		font-weight: 700;
-		font-style: normal;
-		font-size: 16px;
-		color: #333;
-		margin-right: 1.25rem;
-	}
+  .head_title {
+    font-weight: 700;
+    font-style: normal;
+    font-size: 16px;
+    color: #333;
+    margin-right: 1.25rem;
+  }
 
-	.head_desc {
-		font-weight: 400;
-		font-style: normal;
-		font-size: 14px;
-		color: #888888;
-	}
+  .head_desc {
+    font-weight: 400;
+    font-style: normal;
+    font-size: 14px;
+    color: #888888;
+  }
 }
 
 /deep/ .ant-table {
-	width: 100% !important;
+  width: 100% !important;
 }
 
 .f_20 {
-	font-size: 1.25rem;
+  font-size: 1.25rem;
 }
 
 .f_40 {
-	font-size: 2.5rem;
+  font-size: 2.5rem;
 }
 
 .f_center {
-	text-align: center;
+  text-align: center;
 }
 
 .warning {
-	color: #FD6805
+  color: #fd6805;
 }
 
 .primary {
-	color: #0595FD
+  color: #0595fd;
 }
 
 .success {
-	color: #04CA8F
+  color: #04ca8f;
 }
 
 .h_200 {
-	height: 12.5rem;
+  height: 12.5rem;
 }
 
 .mb_15 {
-	margin-bottom: .9375rem;
+  margin-bottom: 0.9375rem;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/portal-manager-ui/admin/src/views/dataAdmin/components/queueCall/callRecord.vue b/portal-manager-ui/admin/src/views/dataAdmin/components/queueCall/callRecord.vue
index e4b76177415dcc15f8fefadcb856eb825c8c0769..fddc0f10f95605a4f02596d4ea83f6bcb561fca5 100644
--- a/portal-manager-ui/admin/src/views/dataAdmin/components/queueCall/callRecord.vue
+++ b/portal-manager-ui/admin/src/views/dataAdmin/components/queueCall/callRecord.vue
@@ -361,6 +361,7 @@ export default {
         this.$emit("update", { total, time: this.searchForm.time });
       }
       this.loading = false;
+      this.$forceUpdate();
     },
 
     // 缈婚〉
diff --git a/portal-manager-ui/admin/src/views/dataAdmin/components/queueCall/queueRecord.vue b/portal-manager-ui/admin/src/views/dataAdmin/components/queueCall/queueRecord.vue
index 90b9d49a07152ccd486cdfb4ac3122a14f894876..7a3d1244dec95745b2adbad36eb8b4cdc43c56b0 100644
--- a/portal-manager-ui/admin/src/views/dataAdmin/components/queueCall/queueRecord.vue
+++ b/portal-manager-ui/admin/src/views/dataAdmin/components/queueCall/queueRecord.vue
@@ -354,6 +354,7 @@ export default {
         this.$emit("update", { total, time: this.searchForm.time });
       }
       this.loading = false;
+      this.$forceUpdate();
     },
 
     // 缈婚〉