fix: 图表重复点击tab坍缩问题

fix：优化LinkBlock右侧蜂窝图数据去重

See merge request cyber-narrator/cn-ui!17

.eslintrc.js

@@ -1,8 +1,7 @@
 module.exports = {
   env: {
     browser: true,
-    es2021: true,
-    jest: true
+    es2021: true
   },
   extends: [
     'plugin:vue/vue3-essential',

.gitlab-ci.yml

@@ -2,7 +2,6 @@
 stages:
   - gen_git-log
   - build_project
-  - test
   - build_image
 
 cache:
@@ -11,7 +10,7 @@ cache:
       - package.json
   paths:
     - node_modules
-#    - dist/
+    - dist/
 
 before_script:
   - export CNUI_TAG=$(date +%Y%m%d%H%M%S)
@@ -42,38 +41,21 @@ build_project:
     - cnpm install --save-dev --unsafe-perm
     - echo "npm run build"
     - cnpm run build
-  artifacts:
-    name: "$CI_JOB_NAME-$CI_COMMIT_REF_NAME"
-    when: on_success
-    paths:
-      - dist/
   only:
     - dev
     - tags
   tags:
     - galaxy
 
-test:
-  stage: test
-  script:
-    - cnpm run test
-  when: on_success
-  only:
-    - dev
-  tags:
-    - galaxy
-
 build_image:
-  dependencies:
-    - build_project
   stage: build_image
   script:
     - echo "docker build"
-    - sudo docker build --no-cache -t cn-ui-$CI_COMMIT_REF_NAME:$CNUI_TAG .
+    - sudo docker build -t cn-ui:$CNUI_TAG .
     - echo "docker tag"
-    - sudo docker tag cn-ui-$CI_COMMIT_REF_NAME:$CNUI_TAG 192.168.40.153:9080/cyber-narrator/cn-ui-$CI_COMMIT_REF_NAME:$CNUI_TAG
+    - sudo docker tag cn-ui:$CNUI_TAG 192.168.40.153:9080/cyber-narrator/cn-ui:$CNUI_TAG
     - echo "docker push"
-    - sudo docker push 192.168.40.153:9080/cyber-narrator/cn-ui-$CI_COMMIT_REF_NAME:$CNUI_TAG
+    - sudo docker push 192.168.40.153:9080/cyber-narrator/cn-ui:$CNUI_TAG
   when: on_success
   only:
     - dev
@@ -82,8 +64,6 @@ build_image:
 
 
 build_release_image:
-  dependencies:
-    - build_project
   stage: build_image
   script:
     - echo 'tag名称是'
@@ -91,7 +71,7 @@ build_release_image:
     - echo '提交的版本是'
     - echo $CI_COMMIT_REF_NAME
     - echo "docker build"
-    - sudo docker build --no-cache -t cn-ui:$CI_COMMIT_TAG .
+    - sudo docker build -t cn-ui:$CI_COMMIT_TAG .
     - echo "docker tag"
     - sudo docker tag cn-ui:$CI_COMMIT_TAG 192.168.40.153:9080/cyber-narrator/cn-ui:$CI_COMMIT_TAG
     - echo "docker push"

babel.config.js

@@ -12,9 +12,8 @@ module.exports = {
   ],
   plugins: [
     '@vue/babel-plugin-jsx',
-    ['@babel/plugin-proposal-class-properties', { loose: true }],
+    ['@babel/proposal-class-properties', { loose: true }],
     ['@babel/plugin-proposal-private-methods', { loose: true }],
-    ['@babel/plugin-proposal-private-property-in-object', { loose: true }],
     '@babel/transform-runtime',
     'lodash'
   ],

jest.config.js

@@ -1,34 +0,0 @@
-module.exports = {
-  roots: [
-    '<rootDir>/test'
-  ],
-  testMatch: [
-    '<rootDir>/test/**/__tests__/**/*.{vue,js,jsx,ts,tsx}',
-    '<rootDir>/test/**/*.{spec,test}.{vue,js,jsx,ts,tsx}'
-  ],
-  setupFilesAfterEnv: ['<rootDir>/test/init.js'],
-  verbose: true,
-  testEnvironment: 'jsdom',
-  transform: {
-    '^.+\\.(vue)$': '<rootDir>/node_modules/vue-jest',
-    '^.+\\.(js|jsx|mjs|cjs|ts|tsx)$': '<rootDir>/node_modules/babel-jest'
-  },
-  transformIgnorePatterns: [
-    '<rootDir>/node_modules/',
-    '[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs|cjs|ts|tsx)$',
-    '^.+\\.module\\.(css|sass|scss|less)$'
-  ],
-  moduleFileExtensions: [
-    'vue',
-    'js',
-    'jsx',
-    'ts',
-    'tsx',
-    'json',
-    'node'
-  ],
-  moduleNameMapper: {
-    '@/(.*)$': '<rootDir>/src/$1'
-  },
-  resetMocks: true
-}

package.json

@@ -6,7 +6,6 @@
     "serve": "vue-cli-service serve",
     "build": "cross-env NODE_ENV=production vue-cli-service build",
     "lint": "vue-cli-service lint",
-    "test": "jest",
     "analyz": "cross-env NODE_ENV=production npm_config_report=true npm run build"
   },
   "dependencies": {
@@ -49,23 +48,17 @@
     "@rollup/plugin-commonjs": "^15.1.0",
     "@rollup/plugin-node-resolve": "^9.0.0",
     "@rollup/plugin-typescript": "^6.0.0",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/user-event": "^14.4.3",
-    "@testing-library/vue": "^6.4.2",
-    "@types/jest": "^26.0.24",
+    "@types/jest": "^26.0.10",
     "@types/lodash": "^4.14.161",
     "@typescript-eslint/eslint-plugin": "^3.10.1",
     "@typescript-eslint/parser": "^3.10.1",
     "@vue/babel-plugin-jsx": "^1.0.0",
-    "@vue/babel-preset-app": "^5.0.8",
     "@vue/cli-plugin-babel": "~4.5.0",
     "@vue/cli-plugin-eslint": "~4.5.0",
     "@vue/cli-service": "~4.5.0",
     "@vue/compiler-sfc": "^3.0.0",
     "@vue/component-compiler-utils": "^3.2.0",
-    "@vue/test-utils": "^2.2.7",
     "babel-eslint": "^10.1.0",
-    "babel-jest": "^26.0.0",
     "compression-webpack-plugin": "^8.0.1",
     "cross-env": "^7.0.3",
     "eslint": "^7.22.0",
@@ -74,10 +67,7 @@
     "eslint-plugin-node": "^11.1.0",
     "eslint-plugin-promise": "^4.3.1",
     "eslint-plugin-vue": "^7.7.0",
-    "jest": "^26.0.0",
-    "ts-jest": "^26.4.4",
     "uglifyjs-webpack-plugin": "^2.2.0",
-    "vue-jest": "^5.0.0-alpha.10",
     "vue3-ace-editor": "^2.0.2"
   },
   "browserslist": [

public/images/logo-title.svg

@@ -1,57 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="278px" height="134px" viewBox="0 0 278 134" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>编组</title>
-    <defs>
-        <filter x="-17.8%" y="-24.0%" width="135.5%" height="147.9%" filterUnits="objectBoundingBox" id="filter-1">
-            <feOffset dx="0" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
-            <feGaussianBlur stdDeviation="2.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
-            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.5 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
-            <feMerge>
-                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
-                <feMergeNode in="SourceGraphic"></feMergeNode>
-            </feMerge>
-        </filter>
-        <filter x="-4.6%" y="-33.1%" width="109.2%" height="166.2%" filterUnits="objectBoundingBox" id="filter-2">
-            <feOffset dx="0" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
-            <feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
-            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.5 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
-            <feMerge>
-                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
-                <feMergeNode in="SourceGraphic"></feMergeNode>
-            </feMerge>
-        </filter>
-    </defs>
-    <g id="🪁login" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="登录定" transform="translate(-821.000000, -321.000000)">
-            <g id="编组-29备份-2" transform="translate(-92.000000, 0.483548)">
-                <g id="编组-3" transform="translate(845.000000, 261.000000)">
-                    <g id="编组" transform="translate(77.000000, 70.000000)">
-                        <g id="编组-2" filter="url(#filter-1)" transform="translate(92.000000, 0.000000)">
-                            <g id="编组-6" transform="translate(35.050168, 0.000000)" fill="#07C8EA">
-                                <path d="M27.0984325,0.0122014594 L31.8461546,0.0441807494 C33.4287159,0.0529564615 35.0111814,0.057058831 36.5933025,0.0481199837 C39.7135537,0.0288820298 40.9989786,1.482222 40.9483988,4.6197574 C40.8553785,10.3255597 40.893168,16.0325764 40.9093577,21.7387835 L40.9152603,25.1623944 L40.9214617,37.9840697 L40.9100279,44.3951016 C40.8908425,49.6015915 40.4443448,50.033571 35.0933494,50.052809 C30.3405147,50.0699729 25.5830136,50.1620025 20.8322952,50.0868551 L20.7215855,50.0942095 L20.7215855,50.0942095 L20.5477593,50.0992315 C18.9139006,50.0992315 17.5893964,48.7747273 17.5893964,47.1408687 C17.5893964,45.50701 18.9139006,44.1825058 20.5477593,44.1825058 L20.474,44.184 L20.4742959,44.1750333 C21.1471703,44.1739628 21.8199738,44.181749 22.4925791,44.1939776 L23.5363069,44.2159125 C27.0892892,44.2985782 30.6348941,44.4415229 34.1543247,43.9933811 L34.9660278,43.8791747 L34.9660278,6.26547692 C33.1063476,6.26547692 31.2448143,6.23793166 29.3832537,6.20623276 L26.5911206,6.15849312 C21.9382921,6.0834815 17.2909993,6.05560833 12.6777715,6.44036741 C8.6401071,6.77790605 5.98379485,10.2529801 5.89658827,14.448603 C5.6888441,24.353954 5.80079615,34.2622872 5.81918245,44.6967563 L0.447293679,44.6970037 L0.446704038,54.9559323 C0.117345075,53.9801448 0.113539117,52.6941057 0.104327596,51.8104584 C-0.0299705283,39.8654379 -0.0177616079,27.9186685 0.0467712572,15.9718991 C0.0973510704,7.02275274 6.25064696,0.487095115 15.2364124,0.139063039 C19.1868702,-0.0134803334 23.1421729,-0.0121848483 27.0984325,0.0122014594 Z" id="形状结合"></path>
-                            </g>
-                            <g id="编组-6" fill="#427497">
-                                <path d="M25.7134192,0.139063039 C34.6991847,0.487095115 40.8524806,7.02275274 40.9030604,15.9718991 L40.904,16.078 L40.902,16.078 L40.9025818,16.0941369 C40.9025818,17.6439559 39.6910759,18.9108125 38.1634453,18.9993255 L37.9924532,19.0042656 C36.3852335,19.0042656 35.0823245,17.7013566 35.0823245,16.0941369 C35.0823245,16.0780245 35.0824554,16.0619426 35.0827163,16.0458923 L35.0846058,16.0783793 C35.0750677,15.535054 35.0646363,14.991824 35.0532433,14.448603 C34.9660368,10.2529801 32.3097245,6.77790605 28.2720601,6.44036741 C23.6588323,6.05560833 19.0115395,6.0834815 14.358711,6.15849312 L11.566578,6.20623276 C9.70501736,6.23793166 7.84348402,6.26547692 5.98380382,6.26547692 L5.98380382,43.8791747 C9.76950351,44.4638711 13.587236,44.3049371 17.4135248,44.2159125 L18.4572525,44.1939776 C24.024744,44.0927552 29.6058224,44.2959137 35.128241,47.3070283 C35.128241,46.4331109 35.1291226,45.5631201 35.1306492,44.6967563 C35.1675419,43.1280395 36.4488408,41.8672653 38.0246093,41.8672653 C39.6211734,41.8672653 40.9154443,43.1615363 40.9154443,44.7581003 C40.9154443,44.8307331 40.9127656,44.9027403 40.9075017,44.9740284 L40.9088955,44.6972456 C40.8930463,47.0683764 40.8721613,49.4394518 40.845504,51.8104584 C40.8298068,53.3162655 40.8298068,55.990576 39.2077646,56.3068929 C37.5857223,56.6232099 35.9043795,55.3887179 34.756741,54.3638596 C31.4359146,51.4029636 27.806377,49.8569316 23.2908206,50.0090864 C17.486351,50.2067126 11.6679283,50.0737959 5.85648222,50.052809 C0.505486811,50.033571 0.0589891496,49.6015915 0.0398037033,44.3951016 C0.0171299939,37.9836163 0.0345713088,31.5738798 0.0345713088,25.1623944 C0.0363154403,18.3154317 0.113057226,11.4667201 0.00143281049,4.6197574 C-0.0491470027,1.482222 1.2362779,0.0288820298 4.35652914,0.0481199837 C5.93865019,0.057058831 7.52111576,0.0529564615 9.10367704,0.0441807494 L13.8513991,0.0122014594 C17.8076588,-0.0121848483 21.7629614,-0.0134803334 25.7134192,0.139063039 Z" id="形状结合"></path>
-                            </g>
-                        </g>
-                        <g id="编组备份-3" filter="url(#filter-2)" transform="translate(0.000000, 78.000000)" fill="#FFFFFF">
-                            <path d="M115.414634,3.4395964 C118.349928,2.7814294 120.475231,3.29905032 122.160731,5.90343768 C124.483413,9.49250456 127.148437,12.8399007 129.656213,16.2987054 C130.134509,16.9585864 130.56694,17.6544608 131.390854,18.88681 L131.390854,3.34275672 L136.97561,3.34275672 L136.97561,29.405484 C133.211489,30.4201581 132.565299,30.0088038 130.615261,26.8070956 C127.699624,22.0182451 124.570227,17.3716547 121.53174,12.6650751 C121.328628,12.749917 121.124697,12.8347588 120.921585,12.9196007 L120.921585,29.5546 L115.414634,29.5546 L115.414634,3.4395964 Z" id="Fill-3"></path>
-                            <path d="M52.5622826,19.5533129 C52.5622826,20.896183 52.5088273,22.2433081 52.5906808,23.5802213 C52.6199142,24.0550766 52.8596279,24.7231077 53.2146047,24.9324524 C54.4716401,25.6745201 57.2421295,24.9758532 58.2268768,23.7963741 C59.7353193,21.9905626 60.0802732,17.5781534 58.8733522,15.5408713 C57.9153325,13.9248317 56.2523707,13.4984832 53.9153706,13.9903583 C51.9625807,14.4022399 52.6833924,15.8736103 52.5756465,17.0105397 C52.4954635,17.8504718 52.5597769,18.7048708 52.5622826,19.5533129 M52.5330493,0 L52.5330493,9.65368764 C53.208758,9.5405053 53.6698102,9.49284958 54.1166633,9.38477321 C59.6952278,8.0333931 63.9023291,10.7650872 65.0299024,16.4812208 C66.1015147,21.9071651 64.1203266,26.9127179 59.9833855,28.7985229 C55.9491788,30.6358212 51.8139081,29.8256739 47.7396098,28.8470296 C47.3829626,28.7610791 46.9837181,27.8930642 46.9812124,27.3867221 C46.934439,19.0265469 46.9645076,10.6663717 46.9268751,2.30619654 C46.9219104,1.14373732 47.3194844,0.630587319 48.4453872,0.535275875 C49.7375027,0.424646521 51.0204305,0.203387813 52.5330493,0" id="Fill-5"></path>
-                            <path d="M19.5137739,23.4304503 C19.9932034,24.8985873 20.4620513,26.3353612 20.9268293,27.7602679 C14.4720316,31.407724 6.23789114,30.2659338 2.48710831,25.2529068 C-1.22541783,20.2898914 -0.709359604,11.0682613 3.55178365,6.23408942 C7.21547147,2.07888852 15.6189181,1.27107406 20.5540301,4.64219483 C20.064019,6.07049216 19.569938,7.51150431 19.047368,9.03558657 C14.6893621,7.55219171 10.4103114,6.14678104 7.12023675,10.7351332 C5.254613,13.3374317 5.32949842,19.2684681 7.28465909,21.8139737 C10.743226,26.3184081 15.1354187,24.6230997 19.5137739,23.4304503" id="Fill-7"></path>
-                            <path d="M80.9573503,17.4186957 C80.6994597,14.8122308 79.7157449,13.6997668 77.8026508,13.6278585 C75.6024709,13.5441065 74.4971096,14.6464187 74.0851334,17.4186957 L80.9573503,17.4186957 Z M85.2271429,28.6702323 C81.6093756,29.9578141 78.1497488,30.3511949 74.691744,29.2725702 C70.8371715,28.0704323 68.9305652,25.1475708 68.5664366,21.0217254 C68.1731129,16.5684856 69.1925106,12.666825 73.0543819,10.2946966 C76.3404597,8.27534184 79.851989,8.46568738 82.955597,10.8132824 C86.3227725,13.3596828 86.3714311,17.194511 86.1832845,21.2679056 L74.1800176,21.2679056 C74.761488,24.9149262 77.0054606,25.5857885 84.4437394,24.4377934 C84.6910873,25.7719041 84.9400571,27.1178586 85.2271429,28.6702323 L85.2271429,28.6702323 Z" id="Fill-9"></path>
-                            <path d="M25.3874943,30.8228052 C27.273054,31.3110201 28.457617,31.5073987 28.9411833,31.4119412 C30.9031674,31.0255922 31.8121184,29.009122 31.0620691,27.1434634 C28.7485252,21.3855088 26.4909674,15.603831 24.097561,9.54171142 L30.054319,9.54171142 C31.3765794,13.67717 34.2426251,22.3985378 34.3454245,22.3888832 C34.4546317,22.3786269 37.0270604,13.7593538 38.2422885,9.54425319 L43.7560976,9.54425319 C42.7483475,12.6968943 41.8846793,15.858008 40.7279074,18.901353 C39.1117199,23.1562747 37.3588605,27.3612083 35.512142,31.5153065 C33.6983565,35.5956933 30.1210084,37.5842041 24.3206821,35.2889865 C24.4266166,34.7659469 24.7822207,33.2772198 25.3874943,30.8228052 Z" id="Fill-11"></path>
-                            <path d="M234.415104,8.91275606 C240.021771,8.71254074 243.950192,12.7288259 244.138705,18.8507945 C244.331212,25.1524435 240.866885,29.6752563 235.685171,29.8865947 C229.702277,30.1295911 225.972753,26.2467828 225.762672,19.5583931 C225.578153,13.6708647 229.297293,9.09500335 234.415104,8.91275606 Z M234.692852,13.9760256 C237.392359,13.8724659 239.283821,15.9498548 239.374586,19.1163903 C239.467275,22.3758639 237.799265,24.7152498 235.304366,24.8245628 C232.423713,24.9502506 230.628017,22.9419015 230.526867,19.4823895 C230.438024,16.4371162 232.228721,14.0702914 234.692852,13.9760256 Z" id="Fill-13"></path>
-                            <path d="M200.239759,20.786111 C197.664552,20.8988821 196.292264,21.6284773 196.296349,23.2098363 C196.300526,24.7732545 197.562105,25.5643612 200.031561,25.6164751 C201.586435,25.6497938 202.385352,25.9804068 202.385352,23.3029579 C202.385352,21.2268237 202.1218,20.7040956 200.239759,20.786111 Z M195.974185,29.5438157 C192.681025,28.9030706 190.853512,26.6655885 190.878298,23.384119 C190.903083,20.2008971 192.687635,18.0659342 195.933702,17.440567 C197.008564,17.2338199 198.11069,17.1509501 199.203728,17.0885843 C200.211669,17.0304901 201.224567,17.0757694 202.23664,17.0757694 C201.947476,13.5226239 201.356756,13.3218571 193.403934,14.1138181 C193.270093,13.4534235 193.099073,12.7810682 193.005715,12.0967524 C192.91153,11.4090193 192.89418,10.7101799 192.829738,9.82851455 C196.569035,8.87423144 200.225714,8.3291709 203.912962,9.87806551 C205.883404,10.7050539 207.160681,12.3351096 207.250734,14.3684075 C207.461411,19.1663072 207.318481,23.9804391 207.318481,28.9141768 C203.589098,29.7411652 199.816754,30.2930604 195.974185,29.5438157 Z" id="Fill-17"></path>
-                            <path d="M149.508052,20.786111 C146.932844,20.8988821 145.560557,21.6284773 145.564642,23.2098363 C145.568819,24.7732545 146.830398,25.5643612 149.299854,25.6164751 C150.854727,25.6497938 151.653645,25.9804068 151.653645,23.3029579 C151.653645,21.2268237 151.390093,20.7040956 149.508052,20.786111 Z M145.242477,29.5438157 C141.949318,28.9030706 140.121805,26.6655885 140.14659,23.384119 C140.171376,20.2008971 141.955928,18.0659342 145.201994,17.440567 C146.276856,17.2338199 147.378982,17.1509501 148.47202,17.0885843 C149.479962,17.0304901 150.49286,17.0757694 151.504932,17.0757694 C151.215769,13.5226239 150.625049,13.3218571 142.672227,14.1138181 C142.538385,13.4534235 142.367366,12.7810682 142.274007,12.0967524 C142.179823,11.4090193 142.162473,10.7101799 142.098031,9.82851455 C145.837328,8.87423144 149.494007,8.3291709 153.181254,9.87806551 C155.151697,10.7050539 156.428973,12.3351096 156.519027,14.3684075 C156.729703,19.1663072 156.586774,23.9804391 156.586774,28.9141768 C152.857391,29.7411652 149.085047,30.2930604 145.242477,29.5438157 Z" id="Fill-17备份"></path>
-                            <path d="M214.368819,9.69369425 L221.009306,9.69369425 L221.009306,14.1842677 L214.659803,14.1842677 C214.659803,17.2278693 214.46217,20.0881822 214.726242,22.9064564 C214.912101,24.8906828 216.670619,25.2673495 218.414,25.1378703 C219.297043,25.07229 220.169154,24.8646188 221.178346,24.6998271 C221.447464,26.0938303 221.682942,27.3104301 221.95122,28.6918217 C218.65957,30.1530867 215.340167,30.4170898 212.263812,28.7515166 C210.96784,28.0503112 209.500306,26.2636666 209.442277,24.9133837 C209.153817,18.2393203 209.311082,11.5459192 209.311082,4.69193022 C210.769366,4.43885727 212.402576,4.157198 214.368819,3.81668457 L214.368819,9.69369425 Z" id="Fill-19"></path>
-                            <path d="M247.317073,29.2612484 L247.317073,19.8647936 L247.317073,13.6517012 C247.317073,10.1104359 247.31206,10.0838292 250.648221,9.42209492 C253.724541,8.8118575 256.802532,8.55179851 260,9.73279246 C259.7176,11.2193343 259.458594,12.5882916 259.207944,13.908327 L252.803818,13.908327 L252.803818,29.2612484 L247.317073,29.2612484 Z" id="Fill-25"></path>
-                            <path d="M175.02439,29.2612484 L175.02439,19.8647936 L175.02439,13.6517012 C175.02439,10.1104359 175.019377,10.0838292 178.355538,9.42209492 C181.431858,8.8118575 184.509849,8.55179851 187.707317,9.73279246 C187.424917,11.2193343 187.165912,12.5882916 186.915261,13.908327 L180.511135,13.908327 L180.511135,29.2612484 L175.02439,29.2612484 Z" id="Fill-25备份"></path>
-                            <path d="M159.804878,29.2612484 L159.804878,19.8647936 L159.804878,13.6517012 C159.804878,10.1104359 159.799865,10.0838292 163.136026,9.42209492 C166.212346,8.8118575 169.290337,8.55179851 172.487805,9.73279246 C172.205405,11.2193343 171.946399,12.5882916 171.695749,13.908327 L165.291623,13.908327 L165.291623,29.2612484 L159.804878,29.2612484 Z" id="Fill-25备份-2"></path>
-                            <path d="M89.4146341,29.2612484 L89.4146341,19.8647936 L89.4146341,13.6517012 C89.4146341,10.1104359 89.4096212,10.0838292 92.7457824,9.42209492 C95.8221023,8.8118575 98.9000932,8.55179851 102.097561,9.73279246 C101.815161,11.2193343 101.556155,12.5882916 101.305505,13.908327 L94.9013786,13.908327 L94.9013786,29.2612484 L89.4146341,29.2612484 Z" id="Fill-25备份-3"></path>
-                        </g>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>

public/images/logo.svg

@@ -1,33 +1,16 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg width="96px" height="77px" viewBox="0 0 96 77" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>编组 2</title>
-    <defs>
-        <filter x="-17.8%" y="-24.0%" width="135.5%" height="147.9%" filterUnits="objectBoundingBox" id="filter-1">
-            <feOffset dx="0" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
-            <feGaussianBlur stdDeviation="2.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
-            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.5 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
-            <feMerge>
-                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
-                <feMergeNode in="SourceGraphic"></feMergeNode>
-            </feMerge>
-        </filter>
-    </defs>
-    <g id="🪁login" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="登录定" transform="translate(-912.000000, -321.000000)">
-            <g id="编组-29备份-2" transform="translate(-92.000000, 0.483548)">
-                <g id="编组-3" transform="translate(845.000000, 261.000000)">
-                    <g id="logo" transform="translate(77.000000, 70.000000)">
-                        <g id="编组-2" filter="url(#filter-1)" transform="translate(92.000000, 0.000000)">
-                            <g id="编组-6" transform="translate(35.050168, 0.000000)" fill="#07C8EA">
-                                <path d="M27.0984325,0.0122014594 L31.8461546,0.0441807494 C33.4287159,0.0529564615 35.0111814,0.057058831 36.5933025,0.0481199837 C39.7135537,0.0288820298 40.9989786,1.482222 40.9483988,4.6197574 C40.8553785,10.3255597 40.893168,16.0325764 40.9093577,21.7387835 L40.9152603,25.1623944 L40.9214617,37.9840697 L40.9100279,44.3951016 C40.8908425,49.6015915 40.4443448,50.033571 35.0933494,50.052809 C30.3405147,50.0699729 25.5830136,50.1620025 20.8322952,50.0868551 L20.7215855,50.0942095 L20.7215855,50.0942095 L20.5477593,50.0992315 C18.9139006,50.0992315 17.5893964,48.7747273 17.5893964,47.1408687 C17.5893964,45.50701 18.9139006,44.1825058 20.5477593,44.1825058 L20.474,44.184 L20.4742959,44.1750333 C21.1471703,44.1739628 21.8199738,44.181749 22.4925791,44.1939776 L23.5363069,44.2159125 C27.0892892,44.2985782 30.6348941,44.4415229 34.1543247,43.9933811 L34.9660278,43.8791747 L34.9660278,6.26547692 C33.1063476,6.26547692 31.2448143,6.23793166 29.3832537,6.20623276 L26.5911206,6.15849312 C21.9382921,6.0834815 17.2909993,6.05560833 12.6777715,6.44036741 C8.6401071,6.77790605 5.98379485,10.2529801 5.89658827,14.448603 C5.6888441,24.353954 5.80079615,34.2622872 5.81918245,44.6967563 L0.447293679,44.6970037 L0.446704038,54.9559323 C0.117345075,53.9801448 0.113539117,52.6941057 0.104327596,51.8104584 C-0.0299705283,39.8654379 -0.0177616079,27.9186685 0.0467712572,15.9718991 C0.0973510704,7.02275274 6.25064696,0.487095115 15.2364124,0.139063039 C19.1868702,-0.0134803334 23.1421729,-0.0121848483 27.0984325,0.0122014594 Z" id="形状结合"></path>
-                            </g>
-                            <g id="编组-6" fill="#427497">
-                                <path d="M25.7134192,0.139063039 C34.6991847,0.487095115 40.8524806,7.02275274 40.9030604,15.9718991 L40.904,16.078 L40.902,16.078 L40.9025818,16.0941369 C40.9025818,17.6439559 39.6910759,18.9108125 38.1634453,18.9993255 L37.9924532,19.0042656 C36.3852335,19.0042656 35.0823245,17.7013566 35.0823245,16.0941369 C35.0823245,16.0780245 35.0824554,16.0619426 35.0827163,16.0458923 L35.0846058,16.0783793 C35.0750677,15.535054 35.0646363,14.991824 35.0532433,14.448603 C34.9660368,10.2529801 32.3097245,6.77790605 28.2720601,6.44036741 C23.6588323,6.05560833 19.0115395,6.0834815 14.358711,6.15849312 L11.566578,6.20623276 C9.70501736,6.23793166 7.84348402,6.26547692 5.98380382,6.26547692 L5.98380382,43.8791747 C9.76950351,44.4638711 13.587236,44.3049371 17.4135248,44.2159125 L18.4572525,44.1939776 C24.024744,44.0927552 29.6058224,44.2959137 35.128241,47.3070283 C35.128241,46.4331109 35.1291226,45.5631201 35.1306492,44.6967563 C35.1675419,43.1280395 36.4488408,41.8672653 38.0246093,41.8672653 C39.6211734,41.8672653 40.9154443,43.1615363 40.9154443,44.7581003 C40.9154443,44.8307331 40.9127656,44.9027403 40.9075017,44.9740284 L40.9088955,44.6972456 C40.8930463,47.0683764 40.8721613,49.4394518 40.845504,51.8104584 C40.8298068,53.3162655 40.8298068,55.990576 39.2077646,56.3068929 C37.5857223,56.6232099 35.9043795,55.3887179 34.756741,54.3638596 C31.4359146,51.4029636 27.806377,49.8569316 23.2908206,50.0090864 C17.486351,50.2067126 11.6679283,50.0737959 5.85648222,50.052809 C0.505486811,50.033571 0.0589891496,49.6015915 0.0398037033,44.3951016 C0.0171299939,37.9836163 0.0345713088,31.5738798 0.0345713088,25.1623944 C0.0363154403,18.3154317 0.113057226,11.4667201 0.00143281049,4.6197574 C-0.0491470027,1.482222 1.2362779,0.0288820298 4.35652914,0.0481199837 C5.93865019,0.057058831 7.52111576,0.0529564615 9.10367704,0.0441807494 L13.8513991,0.0122014594 C17.8076588,-0.0121848483 21.7629614,-0.0134803334 25.7134192,0.139063039 Z" id="形状结合"></path>
-                            </g>
-                        </g>
-                    </g>
+<svg width="36px" height="27px" viewBox="0 0 36 27" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>编组 8</title>
+    <g id="Dashboards-重构" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Network-Analytics_Network-Overview" transform="translate(-62.000000, -17.000000)">
+            <g id="编组-8" transform="translate(62.000000, 17.000000)">
+                <g id="编组-6" transform="translate(16.714286, 0.000000)" fill="#38ACD2">
+                    <path d="M17.2339653,0.0225148942 C18.7034774,0.013513634 19.3088605,0.693517934 19.2850395,2.16154166 C19.2324689,5.36517202 19.2686112,8.56962068 19.2694326,11.773251 C19.2694326,14.7731256 19.2776468,17.7721819 19.2669684,20.7720564 C19.2579328,23.2081248 19.0476504,23.410244 16.5275481,23.4192453 C14.3379832,23.4271009 12.1463155,23.468474 9.95759183,23.4373656 L9.81338222,23.4344346 C9.76856364,23.4387551 9.72312343,23.4409659 9.67716346,23.4409659 C8.90768211,23.4409659 8.28389423,22.8212427 8.28389423,22.0567754 C8.28389423,21.2923081 8.90768211,20.6725848 9.67716346,20.6725848 L9.642,20.674 L9.64253362,20.6690886 C11.7876709,20.6656961 13.9312779,20.8521924 16.054746,20.5879296 L16.4675847,20.530659 L16.4675847,2.93155856 C12.9642481,2.93155856 9.44694746,2.72534787 5.97071757,3.0133882 C4.06914096,3.1713194 2.81812533,4.79727433 2.77705456,6.76036737 C2.6828656,11.222083 2.72821584,15.6850917 2.7394565,20.3677855 L2.74,20.913 L0.21065723,20.9133136 L0.209644072,25.711202 C0.0552591026,25.2549048 0.0534654644,24.654429 0.0491340779,24.2416331 C-0.0141149065,18.6526688 -0.00836499885,13.0628862 0.0220273703,7.47310352 C0.0458484163,3.2858809 2.94380188,0.227907288 7.17573393,0.0650663065 C10.5246444,-0.0634062267 13.8809477,0.0413357112 17.2339653,0.0225148942 Z" id="形状结合"></path>
+                </g>
+                <g id="编组-6" fill="#427497">
+                    <path d="M19.2796515,7.71047301 C19.2796515,8.48046919 18.6655184,9.10467443 17.9079467,9.10467443 C17.1503751,9.10467443 16.536242,8.48046919 16.536242,7.71047301 C16.536242,7.70438876 16.5362803,7.69831361 16.5363568,7.6922478 L16.5373057,7.70225534 C16.532813,7.44217878 16.5278999,7.18214774 16.5225344,6.92212099 C16.4814291,4.91205752 15.2293621,3.24719877 13.3261873,3.08548879 C11.2386964,2.90852947 9.13640761,2.91375781 7.03121842,2.94625398 L4.92550309,2.98210165 C4.22356947,2.99325545 3.52175425,3.00170123 2.82049805,3.00170123 L2.82049805,21.021891 C4.19690236,21.2379613 5.58229019,21.2420622 6.97158301,21.2130673 L7.80558667,21.1931298 L8.53591703,21.1759185 C11.2145687,21.1207428 13.9006337,21.191491 16.557885,22.6641271 L16.559,21.413 C16.5761661,20.6622764 17.180207,20.0580137 17.9231037,20.0580137 C18.6756527,20.0580137 19.2857143,20.6780806 19.2857143,21.4429718 C19.2857143,21.4721841 19.2848245,21.5011851 19.2830709,21.5299484 L19.2826266,21.4139472 C19.2751561,22.549879 19.2653122,23.6857843 19.2527476,24.8216567 C19.2453486,25.5430675 19.2453486,26.8242918 18.4807903,26.9758347 C17.716232,27.1273777 16.923722,26.5359501 16.3827764,26.044955 C14.8174871,24.6264316 13.1066851,23.8857497 10.9782533,23.9586448 C8.24228541,24.0533248 5.49974066,23.9896462 2.76048433,23.9795917 C0.238263922,23.9703751 0.0278048523,23.7634198 0.0187616892,21.2690643 C0.00807431458,18.1974125 0.016295372,15.1265985 0.016295372,12.0549467 C0.0171174777,8.77466386 0.0532901303,5.49354316 0.000675362917,2.21326033 C-0.0231657035,0.710111565 0.582726227,0.0138369713 2.0534734,0.0230536025 C5.40930903,0.0423247405 8.76843308,-0.0649233317 12.1201582,0.0666231318 C16.355647,0.233360369 19.256036,3.36450135 19.2798771,7.65191061 Z" id="形状结合"></path>
                 </g>
             </g>
         </g>
     </g>
-</svg>
+</svg>

src/App.vue

@@ -5,9 +5,6 @@
 </template>
 <script>
 import { storageKey } from '@/utils/constants'
-import router from '@/router'
-import { post } from '@/utils/http'
-import { api } from '@/utils/api'
 const dayjs = require('dayjs')
 const utc = require('dayjs/plugin/utc')
 const timezone = require('dayjs/plugin/timezone')
@@ -29,37 +26,7 @@ export default {
     } else {
       window.$dayJs.tz.setDefault()
     }
-  },
-  mounted () {
-    this.loginAlready()
-  },
-  methods: {
-    /**
-     * 已经登录判断
-     * 如果已经登录，新打开页面按url打开，否则进入首页
-     */
-    loginAlready () {
-      // 登录判断在router/index.js下操作更合适，但该文件内引入post等方法会导致路由报错，
-      // 目前不知道其原因，后续解决该问题后，将登录操作移入router
-      const url = window.location.href
-      const currentPath = url.match(/#(\S*)/)[1]
-
-      if (currentPath === '/' || currentPath === '/login') {
-        if (localStorage.getItem(storageKey.token) !== null) {
-          // 刚进入会请求失败，故采用延时，请求成功清除延时器，避免内存泄漏
-          const timer = setTimeout(() => {
-            post(api.permissions, { token: localStorage.getItem(storageKey.token) }).then(res => {
-              if (res.code === 200) {
-                router.push({
-                  path: '/panel/networkOverview'
-                })
-                clearTimeout(timer)
-              }
-            })
-          }, 10)
-        }
-      }
-    }
   }
+
 }
 </script>

src/Login.vue

@@ -2,12 +2,12 @@
   <div class="logins">
     <div class="inside">
       <div class="title">
-        <img src="../public/images/logo-title.svg" />
+        <img src="../public/images/cion.png" />
       </div>
       <el-form class="login__box">
         <el-form-item>
           <el-input
-              prefix-icon="cn-icon cn-icon-user2"
+              prefix-icon="el-icon-user"
               class="login--input login__input"
             v-model="username"
           ></el-input>
@@ -136,99 +136,58 @@ export default {
 }
 </script>
 
-<style scoped>
-.logins {
+<style>
+ .logins{
   background-color: #000C18;
   background-size: auto;
   background-repeat: round;
   background-image: url('../public/images/bg.png');
   display: flex;
-  height: 100%;
+   height: 100%;
   justify-content: center;
   align-items: center;
+   margin: auto;
 }
 
-:deep .el-input__inner {
-  background-color: #0B325C !important;
-  border: none;
-  border-radius: 0px;
-  border-bottom: 1px solid #295688;
-  font-size: 14px;
-  line-height: 14px;
-}
-:deep .el-input__inner:hover {
-  border-color: #295688;
-}
-:deep .el-input__inner:focus {
-  border-color: #295688;
-}
-.el-button--primary:hover, .el-button--primary:focus, .el-button--primary:active {
-  background: #21B4ED;
-  border-color: #21B4ED;
-  color: #FFFFFF;
-}
-:deep .el-loading-mask {
-  background-color: transparent;
-}
-:deep input {
-  -webkit-text-fill-color: rgba(231,234,237, .8) !important;
-  transition: background-color 500000000000000000s ease-in-out 0s !important;
-  caret-color: #fff ;
-}
 .inside {
-  width: 414px;
-  height: 524px;
-  background: #0B325C;
-  border: 1px solid rgba(103,179,245,0.65);
-  box-shadow: 0 2px 4px 0 rgba(0,0,0,0.38);
-  border-radius: 4px;
-}
-.inside {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
+  opacity: 0.78;
+  background: #051a37;
+  border-radius: 6px;
+  width: 368px;
+  height: 400px;
+  /* margin-top:340px; */
 }
 .inside > div {
   display: block;
 }
 
 .title {
-  margin-top: 65px;
+  margin-top: 70px;
   text-align: center;
+
 }
 .title > img {
-  height: 135px;
+  height: 43px;
+  width: 248px;
 }
-.login__box {
-  display: flex;
-  justify-content: center;
-  flex-direction: column;
-  align-items: center;
-}
-:deep .el-form-item {
-  width: 334px;
-  margin-bottom: 25px;
-}
-:deep .el-input__prefix {
-  color: #6DBBFF;
-}
-:deep .el-input__prefix i {
-  width: 17px;
-  font-size: 17px;
-}
-.login__box .el-form-item:nth-of-type(3) {
-  margin-top: 25px;
-  margin-bottom: 65px;
+.login--input{
+  width: 300px;
+  height: 40px;
 }
+ .login__input:first-of-type{
+   margin-top: 45.57px;
+ }
+ .login__box{
+   width: 300px;
+   height: 250px;
+   margin: auto;
+ }
 .login--button {
-  background: #21B4ED;
+  background: #0091ff;
+  color: #fff;
   border-radius: 4px;
   border: 0;
   font-weight: 400;
-  font-size: 16px;
-  color: #FFFFFF;
-  line-height: 22px;
-  width: 334px;
-  height: 52px;
+  text-align: center;
 }
 </style>

src/Test.vue

@@ -1,121 +0,0 @@
-<template>
-  <span test-id="count">{{count}}</span>
-  <span test-id="id">{{obj.id}}</span>
-  <span test-id="title">{{obj.title}}</span>
-  <button test-id="button" @click="click">click</button>
-  <span test-id="tab">{{lineTab}}</span>
-  <el-table
-      :data="tableData"
-      class="test-table"
-      height="100%"
-      empty-text=" "
-  >
-    <template v-for="(item, index) in tableTitles" :key="index">
-      <el-table-column>
-        <template #default="scope" :column="item">
-          <span :test-id="`${item.prop}${scope.$index}`">{{scope.row[item.prop]}}</span>
-        </template>
-      </el-table-column>
-    </template>
-  </el-table>
-</template>
-
-<script>
-/* vue-jest的测试示例 */
-import { useRoute, useRouter } from 'vue-router'
-import axios from 'axios'
-import { ref } from 'vue'
-import indexedDBUtils from '@/indexedDB'
-export default {
-  name: 'Test',
-  data () {
-    return {
-      count: 0,
-      obj: { id: 1, title: 'title' },
-      differentParamData0: null,
-      differentParamData1: null,
-      indexedDBValue: null,
-      tableData: [
-        {
-          name: 'a',
-          age: 10
-        },
-        {
-          name: 'b',
-          age: 11
-        }
-      ],
-      tableTitles: [
-        { label: 'Name', prop: 'name' },
-        { label: 'Age', prop: 'age' }
-      ],
-      mergeRequestData0: null,
-      mergeRequestData1: null,
-      mergeRequestChildData0: null,
-      mergeRequestChildData1: null
-    }
-  },
-  methods: {
-    click () {
-      this.count++
-    },
-    async getObj () {
-      axios.get('/api/getObjId').then(response => {
-        this.obj.id = response.data
-      })
-      axios.get('/api/getObjTitle').then(response => {
-        this.obj.title = response.data
-      })
-    },
-    async getCount () {
-      axios.get('/api/getCount').then(response => {
-        this.count = response.data
-      })
-    },
-    async differentRequestParam () {
-      axios.get('/api/differentParam', { params: { name: 0 } }).then(response => {
-        this.differentParamData0 = response.data
-      })
-      axios.get('/api/differentParam', { params: { name: 1 } }).then(response => {
-        this.differentParamData1 = response.data
-      })
-    },
-    /**
-     * 同一url，不同入参的axios请求内包含多个不同url请求的demo
-     * @returns {Promise<void>}
-     */
-    async mergeRequest () {
-      axios.get('/api/differentParam', { params: { name: 0 } }).then(response => {
-        this.mergeRequestData0 = response.data
-      })
-      axios.get('/api/differentParam', { params: { name: 1 } }).then(response => {
-        this.mergeRequestData1 = response.data
-        axios.get('/api/getChildId').then(response1 => {
-          this.mergeRequestChildData0 = response1.data
-        })
-        axios.get('/api/getChildTitle').then(response2 => {
-          this.mergeRequestChildData1 = response2.data
-        })
-      })
-    },
-    async setIndexedDBValue () {
-      await indexedDBUtils.selectTable('test').put({ id: 1, name: 'test' })
-    },
-    async getIndexedDBValue () {
-      this.indexedDBValue = await indexedDBUtils.selectTable('test').get(1)
-    }
-  },
-  setup () {
-    const { query } = useRoute()
-    const { currentRoute } = useRouter()
-    const localstorageValue = localStorage.getItem('key')
-    const lineTab = ref(query.lineTab || '')
-    const path = currentRoute.value.path
-    return {
-      lineTab,
-      path,
-      localstorageValue
-    }
-  }
-}
-</script>

src/assets/css/common/table-common.scss

@@ -14,8 +14,9 @@
     z-index: 0;
   }
   .main-container {
-    padding: 0;
+    padding: 10px;
     height: 100%;
+    background-color: #f6f6f6;
     &>div {
       background-color: white;
     }
@@ -35,7 +36,7 @@
     align-items : center;
     position: relative;
     justify-content: space-between;
-    padding: 12px 20px;
+    padding: 14px 20px;
 
     &.top-tools--sub {
       align-items: center;
@@ -49,12 +50,6 @@
      .top-tool-btn {
        border-left: none;
      }
-     .top-tool-btn--search:hover {
-       border-left: none !important;
-     }
-     .top-tool-btn--search:focus {
-       border-left: none !important;
-     }
     }
 
     .top-tool-right {
@@ -79,28 +74,17 @@
     }
     .top-tool-btn {
       cursor: pointer;
-      height: 28px;
-      width: 72px;
+      height: 33px;
+      width: 36px;
       border: 1px solid $--border-color-primary;
       outline: none;
       border-radius: $--button-border-radius;
       background-color: $--button-gray-background-color;
       transition: background-color linear .1s;
-      font-size:12px;
-      font-weight: 500;
-      font-family: NotoSansHans-Medium !important;
+
       i {
         font-size: 14px;
-        color: #575757;
-        margin-right:4px;
-      }
-    }
-
-    .top-tool-btn:disabled {
-      cursor: not-allowed;
-      opacity: 0.66;
-      i {
-
+        color: $--button-gray-color;
       }
     }
 
@@ -110,14 +94,13 @@
       color: #666;
     }
     .top-tool-btn:hover:not(.cn-btn-disabled) {
-      border: 1px solid $--border-color-primary;
       background-color: $--button-gray-hover-background-color;
     }
     .top-tool-btn:focus:not(.cn-btn-disabled), .top-tool-btn.is-focus {
-      background-color: $--button-gray-active-background-color;
-      border: 1px solid $--border-color-primary;
+      background-color: $--button-gray-hover-background-color;
+      border: 1px solid $--color-primary !important;
       i {
-        color: #575757;
+        color: $--button-gray-active-color;
       }
     }
     .top-tool-btn--delete.top-tool-btn:focus:not(.cn-btn-disabled) {
@@ -128,56 +111,6 @@
         color: #F0745A;
       }
     }
-    .top-tool-btn--create {
-      background-color: #38ACD2 !important;
-      border-color: #2E88A6 !important;
-      color:#FFFFFF;
-      i {
-        color: #FFFFFF;
-      }
-    }
-    .top-tool-btn--create:hover {
-      background-color: #57B8D9 !important;
-      border-color: #2E88A6 !important;
-      color:#FFFFFF;
-      i {
-        color: #FFFFFF;
-      }
-    }
-    .top-tool-btn--create:focus {
-      background-color: #31A5CD !important;
-      border-color: #2E88A6 !important;
-      color:#FFFFFF !important;
-      i {
-        color: #FFFFFF !important;
-      }
-    }
-    .top-tool-btn--create:disabled {
-      opacity: 0.66;
-      background-color: #38ACD2 !important;
-      border-color: #2E88A6 !important;
-      color:#FFFFFF;
-      i {
-        color: #FFFFFF;
-      }
-    }
-
-    .btn-customize {
-      color:$blue;
-      font-size: 12px;
-      .icon-gear{
-        color:#2C72C6;
-        width:12px;
-        height:12px;
-        margin-right:2px;
-        font-size:12px;
-      }
-    }
-
-    .btn-customize:hover {
-      cursor:pointer;
-    }
-
     .top-tool-btn--dropdown {
       position: relative;
       width: auto;
@@ -197,7 +130,6 @@
       width: calc(100% - 40px);
       border: 1px solid $--right-box-border-color;
       border-bottom: none;
-      border-radius:4px;
 
       .caret-wrapper {
         height: 23px;
@@ -220,8 +152,7 @@
       th {
         border-color: $--right-box-border-color;
         padding: 8px 0;
-        background: #FFF;
-        border-right:0px;
+        background: #F9F9F9;
       }
       .el-table__header th:first-of-type {
         border-left: none;
@@ -313,7 +244,7 @@
       border-right: none !important;
     }
     /* 最后一列用box-shadow模拟边框 */
-    /*.el-table:not(.no-operation):not(.chart-table).el-table--border .el-table__body-wrapper td:nth-last-child(2) {
+    .el-table:not(.no-operation):not(.chart-table).el-table--border .el-table__body-wrapper td:nth-last-child(2) {
       box-shadow: 1px 0 $--right-box-border-color;
     }
     .el-table:not(.no-operation):not(.chart-table).el-table--border .el-table__header-wrapper th:nth-last-child(3) {
@@ -332,7 +263,7 @@
       th:last-of-type {
         border-right: none !important;
       }
-    }*/
+    }
     .el-table--border:not(.chart-table)::after, .el-table--group:not(.chart-table)::after {
       width: 0;
     }

src/assets/css/components/components/advancedSearch/codemirror.scss

@@ -2,6 +2,7 @@
 
 .CodeMirror {
   /* Set height, width, borders, and global font properties here */
+  font-family: monospace;
   height: 40px;
   color: black;
   direction: ltr;

src/assets/css/components/components/common/TimeRange/date-time-range.scss

@@ -199,8 +199,4 @@
       text-align: right;
     }
   }
-
-  .el-input__inner {
-    visibility: hidden !important;
-  }
 }

src/assets/css/components/components/common/chart-tab.scss

@@ -1,64 +0,0 @@
-.chart-tabs {
-  position: relative;
-
-  .chart-tabs__active-bar {
-    position: absolute;
-    height: 3px;
-    top: 0;
-    background-color: #046EC9;
-    border-radius: 5px 5px 0 0;
-    transition: all linear .2s;
-  }
-  .el-tabs.el-tabs--border-card {
-    position: absolute;
-    top: 3px;
-    width: 100%;
-    border: none;
-    box-shadow: none;
-
-    &>.el-tabs__header {
-      background-color: white;
-      border-color: #E2E5EC;
-
-      .el-tabs__nav-wrap {
-        padding-left: 27px;
-      }
-      .el-tabs__item:first-child {
-        margin-left: 0;
-      }
-    }
-    .el-tabs__content {
-      display: none;
-    }
-  }
-  .el-tabs__nav {
-    z-index: 1;
-  }
-
-  .el-tabs__item.is-top {
-    height: 35px;
-    line-height: 35px;
-
-    .chart-tabs__label {
-      color: #353636;
-      font-size: 14px;
-      font-weight: bold;
-      box-sizing: border-box;
-
-      i {
-        padding-right: 7px;
-        font-size: 16px;
-        font-weight: normal;
-      }
-    }
-    &.is-active {
-      .chart-tabs__label {
-        color: #353636;
-
-        i {
-          color: #046EC9;
-        }
-      }
-    }
-  }
-}

src/assets/css/components/components/layout/layout.scss

@@ -144,6 +144,7 @@
                 text-align: -webkit-match-parent;
                 box-sizing: border-box;
                 cursor: pointer;
+                font-family: Helvetica;
                 font-size: 12px;
                 font-weight: 400;
               }

src/assets/css/components/components/table/common.scss

@@ -11,9 +11,7 @@
   z-index: 999999;
   box-shadow: 0 0 10px #CCC;
   box-sizing: border-box;
-  .pop-title {
-    margin: 10px 0;
-  }
+
   .el-button--mini{
     padding: 5px 7px;
   }
@@ -25,6 +23,7 @@
   top: 33px;
 }
 .custom-labels {
+  margin-top: 12px;
   width: 100%;
   height: 300px;
 }
@@ -42,7 +41,8 @@
   font-size: 14px;
 }
 .custom-label:hover{
-  background-color: rgba(220, 223, 230, .5)
+  color: #cccccc;
+  background-color: #DCDFE6;
 }
 .custom-title{
   padding: 2px 0 2px 2px;
@@ -57,14 +57,6 @@
   display: flex;
   justify-content: space-between;
   align-items: center;
-  .custom-bottom-btns-right {
-    .el-button:nth-of-type(1) {
-      margin-right: 3px;
-    }
-    .el-button .top-tool-btn-save {
-      color: #fff;
-    }
-  }
 }
 .unshow {
   display: none;
@@ -78,28 +70,12 @@
   border-radius: 2px;
   background-color: #F9F9F9;
   transition: background-color linear .1s;
-  padding-left:10px;
-}
-
-
-.list-page .top-tools .top-tool-btn--search{
-  width:28px !important;
-  height:28px !important;
-  padding:unset !important;
-  i {
-    font-size: 14px;
-    color: #575757;
-    margin-right:unset !important;
-  }
 }
 
 .list-page {
-  .el-input--small{
-    width: 214px !important;
-    line-height: 27px;
-  }
   .el-input--small .el-input__inner {
-    height: 28px;
-    border-radius: 2px 0px 0px 2px;
+    height: 32.4px;
+    line-height: 32px;
+    border-radius: 0px;
   }
 }

src/assets/css/components/index.scss

@@ -6,9 +6,9 @@
 @import './components/common/pagination';
 // @import './components/entities/entities';
 @import './components/layout/layout';
-@import 'components/rightBox/administration/chart-box';
+@import 'components/rightBox/settings/chart-box';
 @import 'components/setting/galaxy-proxy-debug';
-@import 'components/table/administration/galaxy-proxy-table';
+@import 'components/table/settings/galaxy-proxy-table';
 @import './components/table/common';
 @import './views/charts/chart';
 @import 'views/entityExplorer/entity-explorer';
@@ -42,8 +42,8 @@
 @import './views/chartHeader';
 @import './views/charts/chartMap';
 @import 'views/charts/chartRelationShipList';
-@import 'views/report/report';
-@import 'components/rightBox/report/reportBox';
+@import './views/report/builtinReport';
+@import './components/rightBox/report/builtinReportBox';
 
 @import './views/charts2/panel';
 @import './views/charts2/networkOverviewLine';
@@ -73,8 +73,3 @@
 @import './views/charts2/dnsEventChartByPie';
 //@import '../chart';
 @import './components/common/chart-error';
-@import './components/common/chart-tab';
-
-@import 'views/administration/AdministrationTabs';
-
-@import 'views/setting/knowledgeBase';

src/assets/css/components/views/administration/AdministrationTabs.scss

@@ -1,17 +0,0 @@
-.administration {
-  .administration-tabs {
-    height: 18px;
-  }
-  .administration-container {
-    height: calc(100% - 26px);
-    flex-direction: column;
-    .list-page {
-      .main-container {
-        padding: 0px;
-        .cn-pagination {
-          height: 34px;
-        }
-      }
-    }
-  }
-}

src/assets/css/components/views/chartHeader.scss

@@ -68,6 +68,7 @@
             display: flex;
             justify-content: space-around;
             align-items: center;
+            font-family: Roboto-Regular;
             font-size: 12px;
             font-weight: 400;
         }

src/assets/css/components/views/charts/chartAlarmInfo.scss

@@ -50,6 +50,7 @@
                     .text-box__title {
                         font-size: 16px;
                         line-height: 19px;
+                        font-family: Roboto-Regular;
                         color: #333333;
                         font-weight: 400;
                         div {
@@ -85,6 +86,7 @@
                             }
 
                             .time-box__start-time {
+                                font-family: PingFangSC-Regular;
                                 font-size: 12px;
                                 color: #999999;
                                 line-height: 14px;
@@ -107,6 +109,7 @@
                             }
 
                             .time-box__start-time {
+                                font-family: PingFangSC-Regular;
                                 font-size: 12px;
                                 color: #999999;
                                 font-weight: 400;
@@ -115,6 +118,7 @@
 
                         .text__type {
                             width: auto;
+                            font-family: Roboto-Regular;
                             line-height: 16px;
                             font-size: 12px;
                             border: 1px solid;
@@ -134,6 +138,7 @@
                             width: 5px;
                             height: 5px;
                             border-radius: 50%;
+                            font-family: Roboto-Black;
                             font-size: 12px;
                             color: #666666;
                             line-height: 17px;

src/assets/css/components/views/charts/chartSingleValue.scss

@@ -306,6 +306,7 @@
         display: flex;
         align-items: center;
         margin: 16px 0 27px 0;
+        font-family: PingFangSC-Medium;
         font-size: 16px;
         color: #333333;
         line-height: 22px;
@@ -323,6 +324,7 @@
 
         .content__data__doh {
           .content__data__doh__count {
+            font-family: Roboto-Medium;
             font-size: 30px;
             color: #333333;
             font-weight: 500;
@@ -330,11 +332,13 @@
 
           .content__data__doh__percent {
             margin-top: 10px;
+            font-family: Roboto-Black;
             font-size: 14px;
             color: #666666;
             font-weight: 400;
 
             span {
+              font-family: Roboto-Medium;
               font-size: 14px;
               color: #FC8157;
               font-weight: 500;

src/assets/css/components/views/charts2/dnsActiveMaliciousDomain.scss

@@ -7,6 +7,7 @@
   flex-direction: column;
 
   .dns-mailcious-domain-title {
+    font-family: NotoSansHans-Medium;
     font-size: 14px;
     color: #353636;
     margin-bottom: 12px;

src/assets/css/components/views/charts2/networkOverviewDdosDetection.scss

@@ -39,9 +39,6 @@
           font-weight: 400;
           margin-bottom: 12px;
         }
-        .ddos-detection-type-value-number.ddos-event {
-          color: #E48F3E;
-        }
         .ddos-detection-type-value-number {
           font-size: 18px;
           color: #E26154;

src/assets/css/components/views/charts2/networkOverviewLine.scss

@@ -98,11 +98,11 @@
         //top: 0;
         //left: 0;
         display: flex;
-        .line-value-tabs.mousemove-cursor {
+        .line-value-mpackets.mousemove-cursor {
           border-top: 4px solid #D3D0D8;
           z-index: 0;
         }
-        .line-value-tabs {
+        .line-value-mpackets {
           cursor: pointer;
           padding: 16px 0 0 20px;
           border-top: 4px solid transparent;
@@ -122,10 +122,10 @@
               }
             }
           }
-          .line-value-tabs-name {
+          .line-value-mpackets-name {
             position: relative;
             display: flex;
-            .tabs-name {
+            .mpackets-name {
               flex: 1;
               padding-left: 19px;
             }

src/assets/css/components/views/charts2/npmAppCategoryScore.scss

@@ -130,10 +130,6 @@
     .data-score.data-score-green {
       background: #749F4D;
     }
-    .data-score-no-data {
-      width: 34px;
-      text-align: center;
-    }
   }
   .data-total-value {
     display: flex;

src/assets/css/components/views/charts2/npmRecentEvents.scss

@@ -86,9 +86,6 @@
       color: #046ECA;
       font-weight: 400
     }
-    .click-active {
-      cursor: pointer;
-    }
     .data-recent-table-eventType {
       font-size: 12px;
       color: #046ECA;

src/assets/css/components/views/detections/detection-list/row.scss

@@ -116,6 +116,7 @@
           margin-right: 12px;
         }
         .detection-event-severity-block {
+          font-family: NotoSansHans-Medium;
           font-size: 12px;
           color: #046EC9;
           font-weight: 500;

src/assets/css/components/views/detections/detection-overview.scss

@@ -220,6 +220,5 @@
   justify-content: center;
   align-items: center;
   padding: 0 4px;
-  //todo 此处文字显示白色，暂时取消
-  //color: white;
+  color: white;
 }

src/assets/css/components/views/entityExplorer/entity-explorer.scss

@@ -57,6 +57,7 @@
     color: #353636;
   }
   .explorer-top-tools-block {
+    font-family: NotoSansHans-Medium;
     height: 28px;
     line-height: 28px;
     background: #F5F8FA;

src/assets/css/components/views/entityExplorer/entityList/detail-overview.scss

@@ -87,7 +87,7 @@
           padding-right: 20px;
 
           &.row__label--width130 {
-            flex-basis: 140px;
+            flex-basis: 130px;
             padding-right: unset;
           }
           &.row__label--width160 {

src/assets/css/components/views/report/builtinReport.scss

@@ -1,22 +1,21 @@
-.cn-report {
+.cn-builtin {
   background: #fff;
   margin: 10px;
   height: calc(100% - 20px) !important;
   display: flex;
   flex-direction: row;
-  .cn-report-left {
+  .cn-builtin-left {
     width: 288px;
     height: 100%;
     border-right: 1px solid  #E7EAED;
     position: relative;
-    overflow: auto;
-    .cn-report-left-title {
+    .cn-builtin-left-title {
       padding: 28px 0 26px 13px;
       font-size: 16px;
       color: #333333;
       letter-spacing: 0;
     }
-    .cn-report-left-menu {
+    .cn-builtin-left-menu {
       width: 250px;
       word-break: normal;
       margin: auto;
@@ -26,13 +25,13 @@
       padding: 14px;
       cursor: pointer;
     }
-    .cn-report-left-menu.cn-active {
+    .cn-builtin-left-menu.cn-active {
       background: #F4FAFF;
       border-radius: 2px;
       color: #0091FF;
     }
   }
-  .cn-report-right {
+  .cn-builtin-right {
     flex: 1;
     .list-page .main-container {
       padding: 0;
@@ -74,7 +73,7 @@
             height: 100%;
             width: calc(100% - 32px);
             background: #fff; //盖住fixed产生的阴影
-            :deep .is-leaf {
+            ::v-deep .is-leaf {
               color: #1b2e3b;
               background: #ebeef5;
             }
@@ -140,12 +139,6 @@
                   color: #666666;
                   font-weight: 400;
                   margin-bottom: 4px;
-                  display: flex;
-                  align-items: center;
-                  justify-content: center;
-                  i {
-                    padding: 2px 3px 0 0;
-                  }
                 }
                 .expand-time {
                   font-size: 12px;

src/assets/css/components/views/setting/knowledgeBase.scss

@@ -1,365 +0,0 @@
-.knowledge-base {
-  &.list-page {
-    height: calc(100% - 52px);
-  }
-  .type-tag {
-    display: inline-block;
-    padding: 0 10px;
-    background-color: #EBF7FA;
-    color: #046ECA;
-    box-shadow: 0 2px 4px 0 rgba(51,51,51,0.02);
-    border-radius: 12px;
-  }
-
-  .top-title {
-    font-size: 24px;
-    color: #353636;
-    font-weight: 900;
-    line-height: 24px;
-    display: flex;
-    align-items: center;
-    padding-bottom: 8px;
-    padding-top: 20px;
-    margin-left:20px;
-  }
-}
-.edit-knowledge-base {
-  height: 100%;
-
-  .edit-knowledge-base__header {
-    padding: 30px 0 30px 20px;
-    font-size: 24px;
-    line-height: 24px;
-    font-weight: 900;
-    color: #353636;
-  }
-  .edit-knowledge-base__body {
-    display: flex;
-    height: calc(100% - 147px);
-    padding-left: 20px;
-    overflow: auto;
-
-    .el-steps {
-      margin-left: 10px;
-
-      .el-step {
-        transition: flex-basis ease-in-out .28s;
-      }
-      .el-step__head {
-        .el-step__line {
-          top: 26px;
-          bottom: 2px;
-          background-color: #38ACD2;
-          border-color: transparent;
-          opacity: 0.66;
-        }
-
-        &.is-finish, &.is-process {
-          .el-step__icon {
-            border-color: #38ACD2;
-            color: white;
-            background: #38ACD2;
-          }
-        }
-
-        &.is-process {
-          .el-step__line {
-            opacity: 1;
-          }
-        }
-
-        &.is-wait {
-          .el-step__icon {
-            border-color: #38ACD2;
-            color: #38ACD2;
-          }
-        }
-
-        .el-step__icon-inner {
-          font-size: 16px;
-          font-weight: normal;
-        }
-      }
-    }
-
-    .el-collapse {
-      width: 655px;
-      margin-left: 5px;
-      border: none;
-
-      .el-collapse-item.upload-collapse {
-        .el-collapse-item__wrap {
-          height: 260px;
-        }
-      }
-      .el-collapse-item {
-        min-height: 58px;
-        position: relative;
-
-        .el-collapse-item__header {
-          height: unset;
-          line-height: unset;
-          border: none;
-          font-size: 16px;
-          color: #333333;
-
-          &.focusing:focus:not(:hover) {
-            color: unset;
-          }
-          .form-sub-title {
-            padding-left: 35px;
-          }
-        }
-        [role|=tab] {
-          display: flex;
-          align-items: flex-start;
-        }
-        .el-collapse-item__arrow {
-          position: absolute;
-          color: #38ACD2;
-          font-weight: bold;
-        }
-        .el-collapse-item__wrap {
-          padding-left: 35px;
-          border: none;
-        }
-        .el-collapse-item__content {
-          position: relative;
-          padding-bottom: 20px;
-        }
-        .form-input .el-input__inner{
-          padding-right: 50px !important;
-        }
-
-        .upload-error-tip, .preview-error-tip {
-          color: $--color-danger;
-        }
-        .upload-error-tip {
-          margin-top: -11px;
-        }
-        .el-upload {
-          margin-top: 12px;
-
-          .upload-tip {
-            font-size: 12px;
-            color: #999999;
-          }
-          .el-upload-dragger {
-            width: 320px;
-            border-radius: 2px;
-            transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
-          }
-
-        }
-        .el-upload--error .el-upload-dragger {
-          border-color: $--color-danger;
-        }
-        .el-upload-list {
-          .el-upload-list__item {
-            padding: 0 5px;
-            margin-top: unset;
-            height: 36px;
-            line-height: 36px;
-            background: #F5F8FA;
-            border-radius: 2px;
-            color: #353636;
-
-            .el-icon-close {
-              top: 11px;
-            }
-            .el-icon-close-tip {
-              top: 11px;
-            }
-            .el-progress.el-progress--line {
-              top: unset;
-            }
-          }
-        }
-      }
-    }
-
-    .el-form {
-      margin-top: 20px;
-      width: 620px;
-
-      label {
-        padding-bottom: 6px;
-        font-size: 14px;
-        color: #333333;
-        line-height: unset;
-      }
-
-      .el-form-item {
-        margin-bottom: 12px;
-      }
-      .el-form-item__content {
-        line-height: unset;
-
-        .el-input__inner {
-          padding-left: 8px;
-          font-size: 14px;
-          color: #353636;
-        }
-        .el-textarea__inner {
-          padding-left: 8px;
-        }
-
-        .form-select {
-          width: 100%;
-
-          .el-input__inner {
-            background-color: #F5F8FA;
-          }
-        }
-      }
-    }
-    .skeleton-border {
-      position: relative;
-      margin-top: 12px;
-      padding: 15px;
-      border: 1px solid #DCDFE6;
-      border-radius: 2px;
-
-      .skeleton-item-row:not(:nth-of-type(6)) {
-        margin-bottom: 5px;
-      }
-      .el-skeleton__item {
-        background: #F5F8FA;
-      }
-      .skeleton-tip {
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        transform: translate(-50%, -50%);
-        font-size: 14px;
-        color: #353636;
-      }
-    }
-    .imported-tip {
-      margin-top: 8px;
-      margin-bottom: 4px;
-      font-size: 14px;
-      color: #333333;
-
-      .cn-icon {
-        font-size: 16px;
-        color: #38ACD2;
-      }
-    }
-    .imported-table-box {
-      position: relative;
-      height: 367px;
-      border: 1px solid #DEDEDE;
-      border-radius: 2px;
-      transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
-
-      &.imported-table-box--error {
-        border-color: $--color-danger;
-      }
-      .imported-table {
-        padding: 0 12px;
-        width: 100%;
-        table-layout: fixed;
-
-        th {
-          text-align: left;
-          font-size: 14px;
-          color: #353636;;
-        }
-        td {
-          font-size: 14px;
-          color: #353636;
-        }
-        .imported-data-msg, .imported-data-item, .imported-data-value {
-          white-space: nowrap;
-          overflow: hidden;
-          text-overflow: ellipsis;
-        }
-        .imported-data-msg {
-          width: 140px;
-        }
-
-        .el-icon-close {
-          color: #666;
-          font-weight: bold;
-          cursor: pointer;
-
-          &:hover {
-            color: #111;
-          }
-        }
-        .el-icon-success {
-          color: #749F4D;
-        }
-        .el-icon-error {
-          color: #E26154;
-        }
-      }
-
-      .imported-pagination.pagination {
-        position: absolute;
-        width: 100%;
-        bottom: 0;
-        margin-top: 4px;
-        padding-top: 8px;
-        height: 42px;
-        border-top: 1px solid #eee;
-
-        .btn-prev, .btn-next, .number {
-          margin: 0 2px;
-        }
-        .el-pager li, .el-pagination .btn-next, .el-pagination .btn-prev {
-          border: none;
-          font-size: 12px;
-        }
-        .el-pagination .el-pager li {
-          color: #353636;
-        }
-        .el-pagination .el-pager li.active {
-          background-color: #38ACD2;
-          color: white;
-        }
-      }
-    }
-  }
-  .edit-knowledge-base__footer {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 60px;
-    margin-top: 3px;
-    box-shadow: 0 -1px 4px 0 rgba(0,0,0,0.10);
-
-    .footer__btn {
-      margin: 0 10px;
-      height: 30px;
-      min-width: 74px;
-      padding: 0 15px;
-      color: white;
-      background-color: #38ACD2;
-      border: none;
-      border-radius: 4px;
-      outline: none;
-      font-size: 14px;
-      cursor: pointer;
-      transition: background-color linear .2s, color linear .1s;
-    }
-    .footer__btn:hover:not(.footer__btn--disabled) {
-      background-color: lighten(#38ACD2, 10%);
-    }
-    .footer__btn--light {
-      background-color: #F5F6F7;
-      border: 1px solid $--border-color-primary;
-      color: #333;
-    }
-    .footer__btn.footer__btn--light:hover:not(.footer__btn--disabled) {
-      background-color: white;
-      border-color: lighten(#38ACD2, 40%);
-      color: #38ACD2;
-    }
-    .footer__btn--disabled {
-      opacity: .6;
-      cursor: default;
-    }
-  }
-}

src/assets/css/font/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "cn-icon"; /* Project id 2614877 */
-  src: url('iconfont.woff2?t=1670817031037') format('woff2'),
-       url('iconfont.woff?t=1670817031037') format('woff'),
-       url('iconfont.ttf?t=1670817031037') format('truetype');
+  src: url('iconfont.woff2?t=1668593055875') format('woff2'),
+       url('iconfont.woff?t=1668593055875') format('woff'),
+       url('iconfont.ttf?t=1668593055875') format('truetype');
 }
 
 .cn-icon {
@@ -13,34 +13,6 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
-.cn-icon-administrations:before {
-  content: "\e7be";
-}
-
-.cn-icon-chart:before {
-  content: "\e7b8";
-}
-
-.cn-icon-user2:before {
-  content: "\e7b9";
-}
-
-.cn-icon-operation-log:before {
-  content: "\e7ba";
-}
-
-.cn-icon-role2:before {
-  content: "\e7bb";
-}
-
-.cn-icon-proxy:before {
-  content: "\e7bc";
-}
-
-.cn-icon-i18n:before {
-  content: "\e7bd";
-}
-
 .cn-icon-baocuo:before {
   content: "\e7b7";
 }

src/assets/css/themes/theme-dark.scss

@@ -31,12 +31,12 @@ $--button-primary-background-color: $--color-primary; // 普通按钮背景色
 $--button-hover-tint-percent: 20%; // 非灰色按钮在鼠标hover时背景色变浅的幅度
 $--button-active-shade-percent: 0; // 非灰色按钮在focus时背景色变深的幅度
 
-$--button-gray-color: #353636; // 灰色按钮字色
+$--button-gray-color: #666; // 灰色按钮字色
 $--button-gray-hover-color: $--button-gray-color; // 灰色按钮hover字色
 $--button-gray-active-color: $--color-primary; // 灰色按钮focus字色
 $--button-gray-background-color: #F9F9F9; // 灰色按钮背景色
-$--button-gray-hover-background-color: #EBF1F4; // 灰色按钮hover背景色
-$--button-gray-active-background-color: #E0E7EA; // 灰色按钮focus背景色
+$--button-gray-hover-background-color: #FFF; // 灰色按钮hover背景色
+$--button-gray-active-background-color: $--button-gray-hover-background-color; // 灰色按钮focus背景色
 $--button-gray-border-color: $--border-color-primary; // 灰色按钮边框色
 $--button-gray-hover-border-color: $--button-gray-border-color; // 灰色按钮hover边框色
 $--button-gray-active-border-color-tint-percent: 30%; // 灰色按钮在focus时边框色相对于主题色变浅的幅度

src/assets/css/themes/theme-light.scss

@@ -2,10 +2,10 @@
 
 /** 重写element-ui变量 **/
 
-$--color-primary: #699DC9; // 主题色
-$--color-primary-dark-10: darken(#699DC9, 10%); // 默认主题色 深10%
-$--color-primary-light-10: lighten(#699DC9, 10%); // 默认主题色 浅10%
-$--color-primary-light-20: lighten(#699DC9, 20%); // 默认主题色 浅20%
+$--color-primary: #0091ff; // 主题色
+$--color-primary-dark-10: darken(#0091ff, 10%); // 默认主题色 深10%
+$--color-primary-light-10: lighten(#0091ff, 10%); // 默认主题色 浅10%
+$--color-primary-light-20: lighten(#0091ff, 20%); // 默认主题色 浅20%
 
 /* menu相关 */
 $--menu-background-color: #00162B; // menu背景色
@@ -31,12 +31,12 @@ $--button-primary-background-color: $--color-primary; // 普通按钮背景色
 $--button-hover-tint-percent: 20%; // 非灰色按钮在鼠标hover时背景色变浅的幅度
 $--button-active-shade-percent: 0; // 非灰色按钮在focus时背景色变深的幅度
 
-$--button-gray-color: #353636; // 灰色按钮字色
+$--button-gray-color: #666; // 灰色按钮字色
 $--button-gray-hover-color: $--button-gray-color; // 灰色按钮hover字色
 $--button-gray-active-color: $--color-primary; // 灰色按钮focus字色
 $--button-gray-background-color: #F9F9F9; // 灰色按钮背景色
-$--button-gray-hover-background-color: #EBF1F4; // 灰色按钮hover背景色
-$--button-gray-active-background-color: #E0E7EA; // 灰色按钮focus背景色
+$--button-gray-hover-background-color: #FFF; // 灰色按钮hover背景色
+$--button-gray-active-background-color: $--button-gray-hover-background-color; // 灰色按钮focus背景色
 $--button-gray-border-color: $--border-color-primary; // 灰色按钮边框色
 $--button-gray-hover-border-color: $--button-gray-border-color; // 灰色按钮hover边框色
 $--button-gray-active-border-color-tint-percent: 30%; // 灰色按钮在focus时边框色相对于主题色变浅的幅度

src/components/advancedSearch/Index.vue

@@ -60,7 +60,6 @@ export default {
     // 连接符列表
     connectionList: Array
   },
-  emits: ['search'],
   methods: {
     search (parseData) {
       this.$emit('search', parseData)

src/components/advancedSearch/TagMode.vue

@@ -104,7 +104,6 @@ export default {
       metaList: []
     }
   },
-  emits: ['changeMode', 'search'],
   methods: {
     // 新增条件
     addCondition (meta) {

src/components/advancedSearch/TextMode.vue

@@ -23,7 +23,7 @@ import CodeMirror from 'codemirror'
 import { toRaw } from 'vue'
 import _ from 'lodash'
 import { columnType } from '@/components/advancedSearch/meta/meta'
-import { handleErrorTip } from '@/components/advancedSearch/meta/error'
+import {handleErrorTip} from "@/components/advancedSearch/meta/error";
 
 export default {
   name: 'TextMode',
@@ -36,7 +36,6 @@ export default {
       codeMirror: null
     }
   },
-  emits: ['changeMode', 'search'],
   methods: {
     initCodeMirror () {
       this.codeMirror = CodeMirror.fromTextArea(this.$refs.textSearch, {

src/components/advancedSearch/meta/parser.js

@@ -233,7 +233,6 @@ export default class Parser {
           break
         }
       } else if (s === ' ') {
-        // 预留
       } else if (s === '(') {
         token = new Token(types.leftBracket, s)
         token.setStart(i)

src/components/advancedSearch/meta/sql-parser.js

@@ -4,7 +4,7 @@ import { riskLevelMapping } from '@/utils/constants'
 import _ from 'lodash'
 // 补全语句，用于解析
 const sqlPrev = 'select a from b where '
-export default class SqlParser/* extends SqlParserVisitor */ {
+export default class SqlParser/* extends SqlParserVisitor*/ {
   constructor (init, columnList) {
     // super()
     this.tempMeta = null

src/components/common/ChartTabs.vue

@@ -1,258 +0,0 @@
-<template>
-  <div class="chart-tabs administration-tabs">
-    <div class="chart-tabs__active-bar" :style="{'background-color': color}"></div>
-    <el-tabs v-model="currentTab" ref="elTabs" type="border-card" @tab-click="handleClick">
-      <el-tab-pane
-          v-for="(tab,index) in tabsData"
-          :key="tab.i18n"
-          :name="JSON.stringify(index)"
-          :disabled="tab.disable">
-        <template #label>
-          <div class="chart-tabs__label">
-            <i :class="tab.icon"></i>
-            <span>{{ $t(tab.i18n || tab.name) }}</span>
-          </div>
-        </template>
-      </el-tab-pane>
-    </el-tabs>
-  </div>
-</template>
-
-<!--  start----------------调用方式----------------start  -->
-<!--
-   组件名：<chart-tabs></chart-tabs>
-   目前有两种形式，分别是default、router
-   默认default，非路由切换：<chart-tabs :data="tabsData" />
-   路由模式router，点击tab路由切换：<chart-tabs :data="tabsData" router />
-   数据格式：
-   tabsData: [
-      {
-        i18n: 'entities.securityEvents',
-        path: '/detection/securityEvent',
-        icon: 'cn-icon cn-icon-a-SecurityEvent'
-      }
-  ]
-  需要禁用，则对应对象里添加 disable: true
- -->
-<!--
-  active颜色：<chart-tabs :data="tabsData" color="red" />
--->
-<!--
-  接收回调：@click
--->
-<!--  end----------------调用方式----------------end  -->
-<script>
-import { overwriteUrl, urlParamsHandler } from '@/utils/tools'
-import { ref } from 'vue'
-import { useRoute, useRouter } from 'vue-router'
-import { useStore } from 'vuex'
-
-export default {
-  name: 'ChartTabs',
-  props: {
-    data: {
-      type: Array
-    },
-    router: {
-      type: String,
-      default: 'noRouter'
-    },
-    color: {
-      type: String
-    }
-  },
-  data () {
-    return {
-      leftOffset: 27,
-      timer: null
-    }
-  },
-  setup (props) {
-    const tabsData = ref([])
-    const router = useRouter()
-    const store = useStore()
-    const routerPath = router.currentRoute.value.path
-    const tabList = store.getters.getChartTabList
-    let currentTab = '0'
-
-    if (props.data) {
-      tabsData.value = [...props.data]
-      tabsData.value.forEach(item => {
-        if (!item.disable) {
-          item.disable = false
-        }
-      })
-
-      // 非路由跳转，获取tabIndex定位
-      // 路由跳转，根据路由名对比传入数据，获取index从而定位
-      // 路由模式为了切换有过渡，需要设置上次tab和当前tab
-      if (props.router === 'noRouter') {
-        const { query } = useRoute()
-        const tabIndexParam = query.tabIndex
-        currentTab = ref(tabIndexParam ? JSON.stringify(tabIndexParam) : '0')
-      } else if (!tabList) {
-        // 此处为刷新界面时，根据当前路由获取index
-        currentTab = tabsData.value.findIndex(item => {
-          return item.path === routerPath
-        })
-        currentTab = JSON.stringify(currentTab)
-        store.dispatch('dispatchChartTabList', [{ path: routerPath, index: currentTab }])
-      } else {
-        // 此处为切换界面，如果window里保存的路径和tabsData里的路径一致，选择window数据并使用
-        // 两个不一致的话，则默认选择tabsData里的第一条
-        let obj0 = null
-        let obj1 = null
-        obj0 = tabsData.value.find(item => { return item.path === tabList[0].path })
-
-        if (tabList[1]) {
-          obj1 = tabsData.value.find(item => { return item.path === tabList[1].path })
-        }
-
-        if (obj0 && obj1) {
-          currentTab = tabList[1].index
-          // 场景：从遮罩面板进入界面时，重置状态，默认选中第一个tab
-          if (routerPath === tabList[0].path) {
-            currentTab = tabList[0].index
-            store.dispatch('dispatchChartTabList', [{ path: tabsData.value[0].path, index: '0' }])
-          }
-        } else if (obj0) {
-          currentTab = tabList[0].index
-        } else {
-          store.dispatch('dispatchChartTabList', [{ path: tabsData.value[0].path, index: '0' }])
-          currentTab = '0'
-        }
-      }
-    }
-
-    return {
-      currentTab,
-      tabsData
-    }
-  },
-  mounted () {
-    const time = this.router === 'noRouter' ? 900 : 0
-    this.timer = setTimeout(() => {
-      this.$nextTick(() => {
-        this.init()
-      })
-    }, time)
-  },
-  watch: {
-    currentTab (n) {
-      if (this.router === 'noRouter') {
-        const { query } = this.$route
-        const newUrl = urlParamsHandler(window.location.href, query, {
-          tabIndex: n
-        })
-        overwriteUrl(newUrl)
-      }
-
-      this.$nextTick(() => {
-        this.handleActiveBar(n)
-      })
-    }
-  },
-  methods: {
-    init () {
-      // 添加禁用小手
-      this.tabsData.forEach((item, index) => {
-        if (item.disable) {
-          const tabEle = document.getElementById('tab-' + index)
-          if (tabEle) {
-            tabEle.style.cssText = 'cursor: not-allowed;'
-          }
-        }
-      })
-      const tabList = this.$store.getters.getChartTabList
-
-      if (tabList && this.router !== 'noRouter') {
-        tabList.forEach((item) => {
-          this.$nextTick(() => {
-            this.handleActiveBar(parseFloat(item.index))
-          })
-        })
-      } else {
-        this.$nextTick(() => {
-          this.handleActiveBar(this.currentTab)
-        })
-        this.$store.dispatch('dispatchChartTabList', null)
-      }
-    },
-    handleActiveBar (index) {
-      const activeDom = document.getElementsByClassName('el-tabs__item is-top is-active')
-      const tabDom = document.getElementById('tab-' + index)
-
-      if (tabDom && activeDom) {
-        this.$nextTick(() => {
-          const offsetLeft = tabDom.offsetLeft
-          const clientWidth = tabDom.clientWidth
-          const clientLeft = tabDom.clientLeft
-          const activeBar = document.querySelector('.chart-tabs .chart-tabs__active-bar')
-
-          if (this.router === 'noRouter') {
-            activeBar.style.cssText += `width: ${clientWidth + 2}px; left: ${offsetLeft + this.leftOffset + clientLeft - 1}px;`
-          } else {
-            // 数组长度为1，即代表刚刷新界面，获取active的dom添加样式，避免原模式错位问题
-            // 可添加css样式，也可添加class类名，两个操作选一即可
-            if (this.$store.getters.getChartTabList.length === 1) {
-              // 此处操作是因为初始化时给active加border，导致tab下移，故需要将整体往上移动对应高度
-              const topDom = document.getElementsByClassName('el-tabs__header is-top')
-              topDom[0].style.cssText += 'top: -3px'
-              activeDom[0].style.cssText += 'height: calc(100% - 1px);border-top: 4px #046EC9 solid;border-radius: 5px 5px 0 0;transition: all linear .2s;'
-            } else {
-              activeBar.style.cssText += `width: ${clientWidth + 2}px; left: ${offsetLeft + this.leftOffset + clientLeft - 1}px;`
-              activeDom[0].style.cssText += 'height:calc(100% + 1px)'
-            }
-          }
-        })
-      }
-    },
-    handleClick (item) {
-      this.$emit('click', item)
-      const tabList = this.$store.getters.getChartTabList
-
-      if (this.router === 'noRouter') {
-        const { query } = this.$route
-        const newUrl = urlParamsHandler(window.location.href, query, {
-          t: +new Date(),
-          tabIndex: item.index
-        })
-        overwriteUrl(newUrl)
-      } else {
-        tabList.push({
-          path: this.tabsData[item.index].path,
-          index: item.index
-        })
-
-        if (tabList.length > 2) {
-          tabList.splice(0, 1)
-        }
-        this.$store.dispatch('dispatchChartTabList', tabList)
-
-        this.$router.push({
-          path: this.tabsData[item.index].path,
-          query: {
-            t: +new Date()
-          }
-        })
-      }
-    }
-  },
-  beforeUnmount () {
-    clearTimeout(this.timer)
-    const path = this.$router.currentRoute.value.path
-    const list = this.$store.getters.getChartTabList
-    if (list && this.router !== 'noRouter') {
-      if (list[1]) {
-        // 去其他界面，清除状态
-        if (path !== list[0].path && path !== list[1].path) {
-          this.$store.dispatch('dispatchChartTabList', null)
-        }
-      } else if (path !== list[0].path) {
-        // 避免刷新页面之后又点击菜单栏进入该界面，还保留上次点击状态
-        this.$store.dispatch('dispatchChartTabList', null)
-      }
-    }
-  }
-}
-</script>

src/components/common/Error.vue

@@ -141,6 +141,7 @@ export default {
     hoverError (e) {
       // const dom = document.getElementById('error-content')
       // if (dom) {
+      //   console.log('---', dom.clientHeight)
       // }
     }
   }

src/components/common/MyDatePicker/index.d.ts

@@ -0,0 +1,4 @@
+import DatePicker from './src/date-picker';
+import type { SFCWithInstall } from 'element-plus/lib/utils/types';
+declare const _DatePicker: SFCWithInstall<typeof DatePicker>;
+export default _DatePicker;

src/components/common/MyDatePicker/src/date-picker-com/basic-date-table.vue.d.ts

@@ -0,0 +1,61 @@
+import { PropType } from 'vue';
+import dayjs from 'dayjs';
+declare const _default: import("vue").DefineComponent<{
+    date: {
+        type: PropType<dayjs.Dayjs>;
+    };
+    minDate: {
+        type: PropType<dayjs.Dayjs>;
+    };
+    maxDate: {
+        type: PropType<dayjs.Dayjs>;
+    };
+    parsedValue: {
+        type: PropType<dayjs.Dayjs | dayjs.Dayjs[]>;
+    };
+    selectionMode: {
+        type: StringConstructor;
+        default: string;
+    };
+    showWeekNumber: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabledDate: {
+        type: FunctionConstructor;
+    };
+    cellClassName: {
+        type: FunctionConstructor;
+    };
+    rangeState: {
+        type: ObjectConstructor;
+        default: () => {
+            endDate: any;
+            selecting: boolean;
+        };
+    };
+}, {
+    handleMouseMove: (event: any) => void;
+    t: (...args: any[]) => string;
+    rows: import("vue").ComputedRef<any[][]>;
+    isWeekActive: (cell: any) => any;
+    getCellClasses: (cell: any) => string;
+    WEEKS: import("vue").ComputedRef<any>;
+    handleClick: (event: any) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("changerange" | "pick" | "select")[], "changerange" | "pick" | "select", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    selectionMode: unknown;
+    showWeekNumber: boolean;
+    rangeState: Record<string, any>;
+} & {
+    date?: unknown;
+    minDate?: unknown;
+    maxDate?: unknown;
+    parsedValue?: unknown;
+    disabledDate?: unknown;
+    cellClassName?: unknown;
+}>, {
+    selectionMode: unknown;
+    showWeekNumber: boolean;
+    rangeState: Record<string, any>;
+}>;
+export default _default;

src/components/common/MyDatePicker/src/date-picker-com/basic-month-table.vue.d.ts

@@ -0,0 +1,50 @@
+import dayjs from 'dayjs';
+import { PropType } from 'vue';
+declare const _default: import("vue").DefineComponent<{
+    disabledDate: {
+        type: PropType<(_: Date) => void>;
+    };
+    selectionMode: {
+        type: StringConstructor;
+        default: string;
+    };
+    minDate: {
+        type: PropType<dayjs.Dayjs>;
+    };
+    maxDate: {
+        type: PropType<dayjs.Dayjs>;
+    };
+    date: {
+        type: PropType<dayjs.Dayjs>;
+    };
+    parsedValue: {
+        type: PropType<dayjs.Dayjs>;
+    };
+    rangeState: {
+        type: ObjectConstructor;
+        default: () => {
+            endDate: any;
+            selecting: boolean;
+        };
+    };
+}, {
+    handleMouseMove: (event: any) => void;
+    handleMonthTableClick: (event: any) => void;
+    rows: import("vue").ComputedRef<any[][]>;
+    getCellStyle: (cell: any) => any;
+    t: (...args: any[]) => string;
+    months: any;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("changerange" | "pick" | "select")[], "changerange" | "pick" | "select", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    selectionMode: unknown;
+    rangeState: Record<string, any>;
+} & {
+    disabledDate?: unknown;
+    minDate?: unknown;
+    maxDate?: unknown;
+    date?: unknown;
+    parsedValue?: unknown;
+}>, {
+    selectionMode: unknown;
+    rangeState: Record<string, any>;
+}>;
+export default _default;

src/components/common/MyDatePicker/src/date-picker-com/basic-year-table.vue.d.ts

@@ -0,0 +1,22 @@
+import { PropType } from 'vue';
+import dayjs from 'dayjs';
+declare const _default: import("vue").DefineComponent<{
+    disabledDate: {
+        type: PropType<(_: Date) => void>;
+    };
+    parsedValue: {
+        type: PropType<dayjs.Dayjs>;
+    };
+    date: {
+        type: PropType<dayjs.Dayjs>;
+    };
+}, {
+    startYear: import("vue").ComputedRef<number>;
+    getCellStyle: (year: any) => any;
+    handleYearTableClick: (event: any) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "pick"[], "pick", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{} & {
+    disabledDate?: unknown;
+    parsedValue?: unknown;
+    date?: unknown;
+}>, {}>;
+export default _default;

src/components/common/MyDatePicker/src/date-picker-com/panel-date-pick.vue.d.ts

@@ -0,0 +1,136 @@
+import dayjs, { Dayjs } from 'dayjs';
+import { PropType } from 'vue';
+declare const _default: import("vue").DefineComponent<{
+    visible: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    parsedValue: {
+        type: PropType<dayjs.Dayjs | dayjs.Dayjs[]>;
+    };
+    format: {
+        type: StringConstructor;
+        default: string;
+    };
+    type: {
+        type: StringConstructor;
+        required: true;
+    };
+}, {
+    handleTimePick: (value: any, visible: any, first: any) => void;
+    handleTimePickClose: () => void;
+    onTimePickerInputFocus: () => void;
+    timePickerVisible: import("vue").Ref<boolean>;
+    visibleTime: import("vue").ComputedRef<any>;
+    visibleDate: import("vue").ComputedRef<any>;
+    showTime: import("vue").ComputedRef<boolean>;
+    changeToNow: () => void;
+    onConfirm: () => void;
+    footerVisible: import("vue").ComputedRef<boolean>;
+    handleYearPick: (year: any) => void;
+    showMonthPicker: () => void;
+    showYearPicker: () => void;
+    handleMonthPick: (month: any) => void;
+    hasShortcuts: import("vue").ComputedRef<boolean>;
+    shortcuts: any;
+    arrowControl: any;
+    disabledDate: any;
+    cellClassName: any;
+    selectionMode: import("vue").ComputedRef<unknown>;
+    handleShortcutClick: (shortcut: any) => void;
+    prevYear_: () => void;
+    nextYear_: () => void;
+    prevMonth_: () => void;
+    nextMonth_: () => void;
+    innerDate: import("vue").Ref<{
+        clone: () => dayjs.Dayjs;
+        isValid: () => boolean;
+        year: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        month: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        date: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        day: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        hour: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        minute: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        second: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        millisecond: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        set: (unit: dayjs.UnitType, value: number) => dayjs.Dayjs;
+        get: (unit: dayjs.UnitType) => number;
+        add: (value: number, unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        subtract: (value: number, unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        startOf: (unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        endOf: (unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        format: (template?: string) => string;
+        diff: (date: dayjs.ConfigType, unit?: "M" | "week" | "month" | "year" | "day" | "date" | "hour" | "minute" | "second" | "millisecond" | "d" | "y" | "h" | "m" | "s" | "ms" | "w" | "quarter" | "Q", float?: boolean) => number;
+        valueOf: () => number;
+        unix: () => number;
+        daysInMonth: () => number;
+        toDate: () => Date;
+        toJSON: () => string;
+        toISOString: () => string;
+        toString: () => string;
+        utcOffset: () => number;
+        isBefore: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isSame: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isAfter: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        locale: {
+            (): string;
+            (preset: string | ILocale, object?: Partial<ILocale>): dayjs.Dayjs;
+        };
+        localeData: () => any;
+        week: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        weekYear: () => number;
+        dayOfYear: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        isSameOrAfter: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isSameOrBefore: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+    }>;
+    t: (...args: any[]) => string;
+    yearLabel: import("vue").ComputedRef<string>;
+    currentView: import("vue").Ref<string>;
+    month: import("vue").ComputedRef<number>;
+    handleDatePick: (value: Dayjs) => void;
+    handleVisibleTimeChange: (value: any) => void;
+    handleVisibleDateChange: (value: any) => void;
+    timeFormat: import("vue").ComputedRef<any>;
+    userInputTime: any;
+    userInputDate: any;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "set-picker-option")[], "pick" | "set-picker-option", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    visible: boolean;
+    format: unknown;
+    type: unknown;
+} & {
+    parsedValue?: unknown;
+}>, {
+    visible: boolean;
+    format: unknown;
+}>;
+export default _default;

src/components/common/MyDatePicker/src/date-picker-com/panel-date-range.vue.d.ts

@@ -0,0 +1,210 @@
+import { PropType } from 'vue';
+import dayjs from 'dayjs';
+declare const _default: import("vue").DefineComponent<{
+    unlinkPanels: BooleanConstructor;
+    parsedValue: {
+        type: PropType<dayjs.Dayjs[]>;
+    };
+    type: {
+        type: StringConstructor;
+        required: true;
+    };
+}, {
+    shortcuts: any;
+    disabledDate: any;
+    cellClassName: any;
+    minTimePickerVisible: import("vue").Ref<boolean>;
+    maxTimePickerVisible: import("vue").Ref<boolean>;
+    handleMinTimeClose: () => void;
+    handleMaxTimeClose: () => void;
+    handleShortcutClick: (shortcut: any) => void;
+    rangeState: import("vue").Ref<{
+        endDate: any;
+        selecting: boolean;
+    }>;
+    minDate: any;
+    maxDate: any;
+    handleRangePick: (val: any, close?: boolean) => void;
+    onSelect: (selecting: any) => void;
+    handleChangeRange: (val: any) => void;
+    btnDisabled: import("vue").ComputedRef<boolean>;
+    enableYearArrow: import("vue").ComputedRef<boolean>;
+    enableMonthArrow: import("vue").ComputedRef<boolean>;
+    rightPrevMonth: () => void;
+    rightPrevYear: () => void;
+    rightNextMonth: () => void;
+    rightNextYear: () => void;
+    leftPrevMonth: () => void;
+    leftPrevYear: () => void;
+    leftNextMonth: () => void;
+    leftNextYear: () => void;
+    hasShortcuts: import("vue").ComputedRef<boolean>;
+    leftLabel: import("vue").ComputedRef<string>;
+    rightLabel: import("vue").ComputedRef<string>;
+    leftDate: import("vue").Ref<{
+        clone: () => dayjs.Dayjs;
+        isValid: () => boolean;
+        year: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        month: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        date: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        day: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        hour: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        minute: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        second: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        millisecond: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        set: (unit: dayjs.UnitType, value: number) => dayjs.Dayjs;
+        get: (unit: dayjs.UnitType) => number;
+        add: (value: number, unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        subtract: (value: number, unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        startOf: (unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        endOf: (unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        format: (template?: string) => string;
+        diff: (date: dayjs.ConfigType, unit?: "M" | "millisecond" | "second" | "minute" | "hour" | "day" | "month" | "year" | "date" | "d" | "y" | "h" | "m" | "s" | "ms" | "week" | "w" | "quarter" | "Q", float?: boolean) => number;
+        valueOf: () => number;
+        unix: () => number;
+        daysInMonth: () => number;
+        toDate: () => Date;
+        toJSON: () => string;
+        toISOString: () => string;
+        toString: () => string;
+        utcOffset: () => number;
+        isBefore: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isSame: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isAfter: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        locale: {
+            (): string;
+            (preset: string | ILocale, object?: Partial<ILocale>): dayjs.Dayjs;
+        };
+        localeData: () => any;
+        week: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        weekYear: () => number;
+        dayOfYear: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        isSameOrAfter: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isSameOrBefore: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+    }>;
+    rightDate: import("vue").Ref<{
+        clone: () => dayjs.Dayjs;
+        isValid: () => boolean;
+        year: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        month: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        date: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        day: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        hour: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        minute: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        second: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        millisecond: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        set: (unit: dayjs.UnitType, value: number) => dayjs.Dayjs;
+        get: (unit: dayjs.UnitType) => number;
+        add: (value: number, unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        subtract: (value: number, unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        startOf: (unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        endOf: (unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        format: (template?: string) => string;
+        diff: (date: dayjs.ConfigType, unit?: "M" | "millisecond" | "second" | "minute" | "hour" | "day" | "month" | "year" | "date" | "d" | "y" | "h" | "m" | "s" | "ms" | "week" | "w" | "quarter" | "Q", float?: boolean) => number;
+        valueOf: () => number;
+        unix: () => number;
+        daysInMonth: () => number;
+        toDate: () => Date;
+        toJSON: () => string;
+        toISOString: () => string;
+        toString: () => string;
+        utcOffset: () => number;
+        isBefore: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isSame: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isAfter: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        locale: {
+            (): string;
+            (preset: string | ILocale, object?: Partial<ILocale>): dayjs.Dayjs;
+        };
+        localeData: () => any;
+        week: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        weekYear: () => number;
+        dayOfYear: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        isSameOrAfter: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isSameOrBefore: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+    }>;
+    showTime: import("vue").ComputedRef<boolean>;
+    t: (...args: any[]) => string;
+    minVisibleDate: import("vue").ComputedRef<any>;
+    maxVisibleDate: import("vue").ComputedRef<any>;
+    minVisibleTime: import("vue").ComputedRef<any>;
+    maxVisibleTime: import("vue").ComputedRef<any>;
+    arrowControl: any;
+    handleDateInput: (value: any, type: any) => void;
+    handleDateChange: (value: any, type: any) => void;
+    handleTimeInput: (value: any, type: any) => void;
+    handleTimeChange: (value: any, type: any) => void;
+    handleMinTimePick: (value: any, visible: any, first: any) => void;
+    handleMaxTimePick: (value: any, visible: any, first: any) => void;
+    handleClear: () => void;
+    handleConfirm: (visible?: boolean) => void;
+    timeFormat: import("vue").ComputedRef<any>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "set-picker-option")[], "pick" | "set-picker-option", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    unlinkPanels: boolean;
+    type: unknown;
+} & {
+    parsedValue?: unknown;
+}>, {
+    unlinkPanels: boolean;
+}>;
+export default _default;

src/components/common/MyDatePicker/src/date-picker-com/panel-month-range.vue.d.ts

@@ -0,0 +1,179 @@
+import dayjs from 'dayjs';
+import { PropType } from 'vue';
+declare const _default: import("vue").DefineComponent<{
+    unlinkPanels: BooleanConstructor;
+    parsedValue: {
+        type: PropType<dayjs.Dayjs[]>;
+    };
+}, {
+    shortcuts: any;
+    disabledDate: any;
+    onSelect: (selecting: any) => void;
+    handleRangePick: (val: any, close?: boolean) => void;
+    rangeState: import("vue").Ref<{
+        endDate: any;
+        selecting: boolean;
+    }>;
+    handleChangeRange: (val: any) => void;
+    minDate: any;
+    maxDate: any;
+    enableYearArrow: import("vue").ComputedRef<boolean>;
+    leftLabel: import("vue").ComputedRef<string>;
+    rightLabel: import("vue").ComputedRef<string>;
+    leftNextYear: () => void;
+    leftPrevYear: () => void;
+    rightNextYear: () => void;
+    rightPrevYear: () => void;
+    t: (...args: any[]) => string;
+    leftDate: import("vue").Ref<{
+        clone: () => dayjs.Dayjs;
+        isValid: () => boolean;
+        year: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        month: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        date: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        day: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        hour: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        minute: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        second: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        millisecond: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        set: (unit: dayjs.UnitType, value: number) => dayjs.Dayjs;
+        get: (unit: dayjs.UnitType) => number;
+        add: (value: number, unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        subtract: (value: number, unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        startOf: (unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        endOf: (unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        format: (template?: string) => string;
+        diff: (date: dayjs.ConfigType, unit?: "M" | "millisecond" | "second" | "minute" | "hour" | "day" | "month" | "year" | "date" | "d" | "y" | "h" | "m" | "s" | "ms" | "week" | "w" | "quarter" | "Q", float?: boolean) => number;
+        valueOf: () => number;
+        unix: () => number;
+        daysInMonth: () => number;
+        toDate: () => Date;
+        toJSON: () => string;
+        toISOString: () => string;
+        toString: () => string;
+        utcOffset: () => number;
+        isBefore: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isSame: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isAfter: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        locale: {
+            (): string;
+            (preset: string | ILocale, object?: Partial<ILocale>): dayjs.Dayjs;
+        };
+        localeData: () => any;
+        week: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        weekYear: () => number;
+        dayOfYear: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        isSameOrAfter: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isSameOrBefore: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+    }>;
+    rightDate: import("vue").Ref<{
+        clone: () => dayjs.Dayjs;
+        isValid: () => boolean;
+        year: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        month: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        date: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        day: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        hour: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        minute: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        second: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        millisecond: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        set: (unit: dayjs.UnitType, value: number) => dayjs.Dayjs;
+        get: (unit: dayjs.UnitType) => number;
+        add: (value: number, unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        subtract: (value: number, unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        startOf: (unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        endOf: (unit: dayjs.OpUnitType) => dayjs.Dayjs;
+        format: (template?: string) => string;
+        diff: (date: dayjs.ConfigType, unit?: "M" | "millisecond" | "second" | "minute" | "hour" | "day" | "month" | "year" | "date" | "d" | "y" | "h" | "m" | "s" | "ms" | "week" | "w" | "quarter" | "Q", float?: boolean) => number;
+        valueOf: () => number;
+        unix: () => number;
+        daysInMonth: () => number;
+        toDate: () => Date;
+        toJSON: () => string;
+        toISOString: () => string;
+        toString: () => string;
+        utcOffset: () => number;
+        isBefore: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isSame: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isAfter: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        locale: {
+            (): string;
+            (preset: string | ILocale, object?: Partial<ILocale>): dayjs.Dayjs;
+        };
+        localeData: () => any;
+        week: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        weekYear: () => number;
+        dayOfYear: {
+            (): number;
+            (value: number): dayjs.Dayjs;
+        };
+        isSameOrAfter: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+        isSameOrBefore: (date: dayjs.ConfigType, unit?: dayjs.OpUnitType) => boolean;
+    }>;
+    hasShortcuts: import("vue").ComputedRef<boolean>;
+    handleShortcutClick: (shortcut: any) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "set-picker-option")[], "pick" | "set-picker-option", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    unlinkPanels: boolean;
+} & {
+    parsedValue?: unknown;
+}>, {
+    unlinkPanels: boolean;
+}>;
+export default _default;

src/components/common/MyDatePicker/src/date-picker.d.ts

@@ -0,0 +1,154 @@
+declare const _default: import("vue").DefineComponent<{
+    type: {
+        type: StringConstructor;
+        default: string;
+    };
+    name: {
+        type: (ArrayConstructor | StringConstructor)[];
+        default: string;
+    };
+    popperClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    format: {
+        type: StringConstructor;
+    };
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    clearIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    editable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    prefixIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    size: {
+        type: import("vue").PropType<ComponentSize>;
+        validator: (val: string) => boolean;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    popperOptions: {
+        type: import("vue").PropType<import("@popperjs/core").Options>;
+        default: () => {};
+    };
+    modelValue: {
+        type: import("vue").PropType<string | Date | Date[]>;
+        default: string;
+    };
+    rangeSeparator: {
+        type: StringConstructor;
+        default: string;
+    };
+    startPlaceholder: StringConstructor;
+    endPlaceholder: StringConstructor;
+    defaultValue: {
+        type: import("vue").PropType<Date | Date[]>;
+    };
+    defaultTime: {
+        type: import("vue").PropType<Date | Date[]>;
+    };
+    isRange: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabledHours: {
+        type: FunctionConstructor;
+    };
+    disabledMinutes: {
+        type: FunctionConstructor;
+    };
+    disabledSeconds: {
+        type: FunctionConstructor;
+    };
+    disabledDate: {
+        type: FunctionConstructor;
+    };
+    cellClassName: {
+        type: FunctionConstructor;
+    };
+    shortcuts: {
+        type: ArrayConstructor;
+        default: () => any[];
+    };
+    arrowControl: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    validateEvent: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    unlinkPanels: BooleanConstructor;
+}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    type: unknown;
+    name: unknown;
+    popperClass: unknown;
+    clearable: boolean;
+    clearIcon: unknown;
+    editable: boolean;
+    prefixIcon: unknown;
+    readonly: boolean;
+    disabled: boolean;
+    placeholder: unknown;
+    popperOptions: unknown;
+    modelValue: unknown;
+    rangeSeparator: unknown;
+    isRange: boolean;
+    shortcuts: unknown;
+    arrowControl: boolean;
+    validateEvent: boolean;
+    unlinkPanels: boolean;
+} & {
+    format?: unknown;
+    size?: unknown;
+    startPlaceholder?: unknown;
+    endPlaceholder?: unknown;
+    defaultValue?: unknown;
+    defaultTime?: unknown;
+    disabledHours?: unknown;
+    disabledMinutes?: unknown;
+    disabledSeconds?: unknown;
+    disabledDate?: unknown;
+    cellClassName?: unknown;
+}>, {
+    type: unknown;
+    name: unknown;
+    popperClass: unknown;
+    clearable: boolean;
+    clearIcon: unknown;
+    editable: boolean;
+    prefixIcon: unknown;
+    readonly: boolean;
+    disabled: boolean;
+    placeholder: unknown;
+    popperOptions: unknown;
+    modelValue: unknown;
+    rangeSeparator: unknown;
+    isRange: boolean;
+    shortcuts: unknown;
+    arrowControl: boolean;
+    validateEvent: boolean;
+    unlinkPanels: boolean;
+}>;
+export default _default;

src/components/common/MytTimePicker/index.d.ts

@@ -0,0 +1,10 @@
+import TimePicker from './src/time-picker';
+import CommonPicker from './src/common/picker.vue';
+import TimePickPanel from './src/time-picker-com/panel-time-pick.vue';
+import type { SFCWithInstall } from 'element-plus/lib/utils/types';
+export * from './src/common/date-utils';
+export * from './src/common/constant';
+export * from './src/common/props';
+declare const _TimePicker: SFCWithInstall<typeof TimePicker>;
+export { CommonPicker, TimePickPanel };
+export default _TimePicker;

src/components/common/MytTimePicker/src/common/constant.d.ts

@@ -0,0 +1,12 @@
+export declare const DEFAULT_FORMATS_TIME = "HH:mm:ss";
+export declare const DEFAULT_FORMATS_DATE = "YYYY-MM-DD";
+export declare const DEFAULT_FORMATS_DATEPICKER: {
+    date: string;
+    week: string;
+    year: string;
+    month: string;
+    datetime: string;
+    monthrange: string;
+    daterange: string;
+    datetimerange: string;
+};

src/components/common/MytTimePicker/src/common/date-utils.d.ts

@@ -0,0 +1,3 @@
+export declare const rangeArr: (n: any) => number[];
+export declare const extractDateFormat: (format: any) => any;
+export declare const extractTimeFormat: (format: any) => any;

src/components/common/MytTimePicker/src/common/picker.vue.d.ts

@@ -0,0 +1,182 @@
+import type { Options } from '@popperjs/core';
+declare const _default: import("vue").DefineComponent<{
+    name: {
+        type: (ArrayConstructor | StringConstructor)[];
+        default: string;
+    };
+    popperClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    format: {
+        type: StringConstructor;
+    };
+    type: {
+        type: StringConstructor;
+        default: string;
+    };
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    clearIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    editable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    prefixIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    size: {
+        type: import("vue").PropType<ComponentSize>;
+        validator: (val: string) => boolean;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    popperOptions: {
+        type: import("vue").PropType<Options>;
+        default: () => {};
+    };
+    modelValue: {
+        type: import("vue").PropType<string | Date | Date[]>;
+        default: string;
+    };
+    rangeSeparator: {
+        type: StringConstructor;
+        default: string;
+    };
+    startPlaceholder: StringConstructor;
+    endPlaceholder: StringConstructor;
+    defaultValue: {
+        type: import("vue").PropType<Date | Date[]>;
+    };
+    defaultTime: {
+        type: import("vue").PropType<Date | Date[]>;
+    };
+    isRange: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabledHours: {
+        type: FunctionConstructor;
+    };
+    disabledMinutes: {
+        type: FunctionConstructor;
+    };
+    disabledSeconds: {
+        type: FunctionConstructor;
+    };
+    disabledDate: {
+        type: FunctionConstructor;
+    };
+    cellClassName: {
+        type: FunctionConstructor;
+    };
+    shortcuts: {
+        type: ArrayConstructor;
+        default: () => any[];
+    };
+    arrowControl: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    validateEvent: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    unlinkPanels: BooleanConstructor;
+}, {
+    elPopperOptions: Options;
+    isDatesPicker: import("vue").ComputedRef<boolean>;
+    handleEndChange: () => void;
+    handleStartChange: () => void;
+    handleStartInput: (event: any) => void;
+    handleEndInput: (event: any) => void;
+    onUserInput: (e: any) => void;
+    handleChange: () => void;
+    handleKeydown: (event: any) => void;
+    popperPaneRef: import("vue").ComputedRef<any>;
+    onClickOutside: () => void;
+    pickerSize: import("vue").ComputedRef<any>;
+    isRangeInput: import("vue").ComputedRef<boolean>;
+    onMouseLeave: () => void;
+    onMouseEnter: () => void;
+    onClearIconClick: (event: any) => void;
+    showClose: import("vue").Ref<boolean>;
+    triggerClass: import("vue").ComputedRef<unknown>;
+    onPick: (date?: any, visible?: boolean) => void;
+    handleFocus: (e: any) => void;
+    pickerVisible: import("vue").Ref<boolean>;
+    pickerActualVisible: import("vue").Ref<boolean>;
+    displayValue: import("vue").ComputedRef<any>;
+    parsedValue: import("vue").ComputedRef<any>;
+    setSelectionRange: (start: any, end: any, pos: any) => void;
+    refPopper: any;
+    pickerDisabled: import("vue").ComputedRef<boolean>;
+    onSetPickerOption: (e: any) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "focus" | "blur")[], "update:modelValue" | "change" | "focus" | "blur", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    name: unknown;
+    popperClass: unknown;
+    type: unknown;
+    clearable: boolean;
+    clearIcon: unknown;
+    editable: boolean;
+    prefixIcon: unknown;
+    readonly: boolean;
+    disabled: boolean;
+    placeholder: unknown;
+    popperOptions: unknown;
+    modelValue: unknown;
+    rangeSeparator: unknown;
+    isRange: boolean;
+    shortcuts: unknown;
+    arrowControl: boolean;
+    validateEvent: boolean;
+    unlinkPanels: boolean;
+} & {
+    format?: unknown;
+    size?: unknown;
+    startPlaceholder?: unknown;
+    endPlaceholder?: unknown;
+    defaultValue?: unknown;
+    defaultTime?: unknown;
+    disabledHours?: unknown;
+    disabledMinutes?: unknown;
+    disabledSeconds?: unknown;
+    disabledDate?: unknown;
+    cellClassName?: unknown;
+}>, {
+    name: unknown;
+    popperClass: unknown;
+    type: unknown;
+    clearable: boolean;
+    clearIcon: unknown;
+    editable: boolean;
+    prefixIcon: unknown;
+    readonly: boolean;
+    disabled: boolean;
+    placeholder: unknown;
+    popperOptions: unknown;
+    modelValue: unknown;
+    rangeSeparator: unknown;
+    isRange: boolean;
+    shortcuts: unknown;
+    arrowControl: boolean;
+    validateEvent: boolean;
+    unlinkPanels: boolean;
+}>;
+export default _default;

src/components/common/MytTimePicker/src/common/props.d.ts

@@ -0,0 +1,103 @@
+import type { PropType } from 'vue';
+import type { Options } from '@popperjs/core';
+export declare const defaultProps: {
+    name: {
+        type: (ArrayConstructor | StringConstructor)[];
+        default: string;
+    };
+    popperClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    format: {
+        type: StringConstructor;
+    };
+    type: {
+        type: StringConstructor;
+        default: string;
+    };
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    clearIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    editable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    prefixIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    size: {
+        type: PropType<ComponentSize>;
+        validator: (val: string) => boolean;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    popperOptions: {
+        type: PropType<Options>;
+        default: () => {};
+    };
+    modelValue: {
+        type: PropType<string | Date | Date[]>;
+        default: string;
+    };
+    rangeSeparator: {
+        type: StringConstructor;
+        default: string;
+    };
+    startPlaceholder: StringConstructor;
+    endPlaceholder: StringConstructor;
+    defaultValue: {
+        type: PropType<Date | Date[]>;
+    };
+    defaultTime: {
+        type: PropType<Date | Date[]>;
+    };
+    isRange: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabledHours: {
+        type: FunctionConstructor;
+    };
+    disabledMinutes: {
+        type: FunctionConstructor;
+    };
+    disabledSeconds: {
+        type: FunctionConstructor;
+    };
+    disabledDate: {
+        type: FunctionConstructor;
+    };
+    cellClassName: {
+        type: FunctionConstructor;
+    };
+    shortcuts: {
+        type: ArrayConstructor;
+        default: () => any[];
+    };
+    arrowControl: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    validateEvent: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    unlinkPanels: BooleanConstructor;
+};

src/components/common/MytTimePicker/src/time-picker-com/basic-time-spinner.vue.d.ts

@@ -0,0 +1,86 @@
+import { Ref, PropType } from 'vue';
+import { Dayjs } from 'dayjs';
+declare const _default: import("vue").DefineComponent<{
+    role: {
+        type: StringConstructor;
+        required: true;
+    };
+    spinnerDate: {
+        type: PropType<Dayjs>;
+        required: true;
+    };
+    showSeconds: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    arrowControl: BooleanConstructor;
+    amPmMode: {
+        type: StringConstructor;
+        default: string;
+    };
+    disabledHours: {
+        type: FunctionConstructor;
+    };
+    disabledMinutes: {
+        type: FunctionConstructor;
+    };
+    disabledSeconds: {
+        type: FunctionConstructor;
+    };
+}, {
+    getRefId: (item: any) => string;
+    spinnerItems: import("vue").ComputedRef<string[]>;
+    currentScrollbar: any;
+    hours: import("vue").ComputedRef<any>;
+    minutes: import("vue").ComputedRef<any>;
+    seconds: import("vue").ComputedRef<any>;
+    hoursList: import("vue").ComputedRef<any[]>;
+    minutesList: import("vue").ComputedRef<any[]>;
+    arrowHourList: import("vue").ComputedRef<any[]>;
+    arrowMinuteList: import("vue").ComputedRef<any[]>;
+    arrowSecondList: import("vue").ComputedRef<any[]>;
+    getAmPmFlag: (hour: any) => string;
+    emitSelectRange: (type: any) => void;
+    adjustCurrentSpinner: (type: any) => void;
+    typeItemHeight: (type: any) => any;
+    listHoursRef: Ref<HTMLElement>;
+    listMinutesRef: Ref<HTMLElement>;
+    listSecondsRef: Ref<HTMLElement>;
+    onIncreaseClick: () => void;
+    onDecreaseClick: () => void;
+    handleClick: (type: any, { value, disabled }: {
+        value: any;
+        disabled: any;
+    }) => void;
+    secondsList: import("vue").ComputedRef<any[]>;
+    timePartsMap: import("vue").ComputedRef<{
+        hours: import("vue").ComputedRef<any>;
+        minutes: import("vue").ComputedRef<any>;
+        seconds: import("vue").ComputedRef<any>;
+    }>;
+    arrowListMap: import("vue").ComputedRef<{
+        hours: import("vue").ComputedRef<any[]>;
+        minutes: import("vue").ComputedRef<any[]>;
+        seconds: import("vue").ComputedRef<any[]>;
+    }>;
+    listMap: import("vue").ComputedRef<{
+        hours: import("vue").ComputedRef<any[]>;
+        minutes: import("vue").ComputedRef<any[]>;
+        seconds: import("vue").ComputedRef<any[]>;
+    }>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "select-range" | "set-option")[], "change" | "select-range" | "set-option", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    role: unknown;
+    spinnerDate: unknown;
+    showSeconds: boolean;
+    arrowControl: boolean;
+    amPmMode: unknown;
+} & {
+    disabledHours?: unknown;
+    disabledMinutes?: unknown;
+    disabledSeconds?: unknown;
+}>, {
+    showSeconds: boolean;
+    arrowControl: boolean;
+    amPmMode: unknown;
+}>;
+export default _default;

src/components/common/MytTimePicker/src/time-picker-com/panel-time-pick.vue.d.ts

@@ -0,0 +1,45 @@
+import { PropType } from 'vue';
+import dayjs, { Dayjs } from 'dayjs';
+declare const _default: import("vue").DefineComponent<{
+    visible: BooleanConstructor;
+    actualVisible: {
+        type: BooleanConstructor;
+        default: any;
+    };
+    datetimeRole: {
+        type: StringConstructor;
+    };
+    parsedValue: {
+        type: PropType<string | dayjs.Dayjs>;
+    };
+    format: {
+        type: StringConstructor;
+        default: string;
+    };
+}, {
+    transitionName: import("vue").ComputedRef<"" | "el-zoom-in-top">;
+    arrowControl: any;
+    onSetOption: (e: any) => void;
+    t: (...args: any[]) => string;
+    handleConfirm: (visible: boolean, first: any) => void;
+    handleChange: (_date: Dayjs) => void;
+    setSelectionRange: (start: any, end: any) => void;
+    amPmMode: import("vue").ComputedRef<"" | "A" | "a">;
+    showSeconds: import("vue").ComputedRef<any>;
+    handleCancel: () => void;
+    disabledHours: any;
+    disabledMinutes: any;
+    disabledSeconds: any;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "select-range" | "set-picker-option")[], "pick" | "select-range" | "set-picker-option", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    visible: boolean;
+    actualVisible: boolean;
+    format: unknown;
+} & {
+    datetimeRole?: unknown;
+    parsedValue?: unknown;
+}>, {
+    visible: boolean;
+    actualVisible: boolean;
+    format: unknown;
+}>;
+export default _default;

src/components/common/MytTimePicker/src/time-picker-com/panel-time-range.vue.d.ts

@@ -0,0 +1,44 @@
+import { PropType } from 'vue';
+import dayjs from 'dayjs';
+declare const _default: import("vue").DefineComponent<{
+    visible: BooleanConstructor;
+    actualVisible: BooleanConstructor;
+    parsedValue: {
+        type: PropType<string | dayjs.Dayjs[]>;
+    };
+    format: {
+        type: StringConstructor;
+        default: string;
+    };
+}, {
+    arrowControl: any;
+    onSetOption: (e: any) => void;
+    setMaxSelectionRange: (start: any, end: any) => void;
+    setMinSelectionRange: (start: any, end: any) => void;
+    btnConfirmDisabled: import("vue").ComputedRef<boolean>;
+    handleCancel: () => void;
+    handleConfirm: (visible?: boolean) => void;
+    t: (...args: any[]) => string;
+    showSeconds: import("vue").ComputedRef<any>;
+    minDate: import("vue").ComputedRef<any>;
+    maxDate: import("vue").ComputedRef<any>;
+    amPmMode: import("vue").ComputedRef<"" | "A" | "a">;
+    handleMinChange: (date: any) => void;
+    handleMaxChange: (date: any) => void;
+    minSelectableRange: import("vue").Ref<any[]>;
+    maxSelectableRange: import("vue").Ref<any[]>;
+    disabledHours_: (role: any, compare: any) => any[];
+    disabledMinutes_: (hour: any, role: any, compare: any) => any;
+    disabledSeconds_: (hour: any, minute: any, role: any, compare: any) => any;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick" | "select-range" | "set-picker-option")[], "pick" | "select-range" | "set-picker-option", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    visible: boolean;
+    actualVisible: boolean;
+    format: unknown;
+} & {
+    parsedValue?: unknown;
+}>, {
+    visible: boolean;
+    actualVisible: boolean;
+    format: unknown;
+}>;
+export default _default;

src/components/common/MytTimePicker/src/time-picker-com/useTimePicker.d.ts

@@ -0,0 +1,155 @@
+import { Dayjs } from 'dayjs';
+export declare const getTimeLists: (disabledHours: any, disabledMinutes: any, disabledSeconds: any) => {
+    getHoursList: (role: any, compare?: any) => any[];
+    getMinutesList: (hour: any, role: any, compare?: any) => any[];
+    getSecondsList: (hour: any, minute: any, role: any, compare?: any) => any[];
+};
+export declare const getAvaliableArrs: (disabledHours: any, disabledMinutes: any, disabledSeconds: any) => {
+    getAvaliableHours: (role: any, compare?: any) => any;
+    getAvaliableMinutes: (hour: any, role: any, compare?: any) => any;
+    getAvaliableSeconds: (hour: any, minute: any, role: any, compare?: any) => any;
+};
+export declare const useOldValue: (props: {
+    parsedValue?: string | Dayjs | Dayjs[];
+    visible: boolean;
+}) => import("vue").Ref<string | {
+    clone: () => Dayjs;
+    isValid: () => boolean;
+    year: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    month: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    date: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    day: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    hour: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    minute: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    second: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    millisecond: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    set: (unit: import("dayjs").UnitType, value: number) => Dayjs;
+    get: (unit: import("dayjs").UnitType) => number;
+    add: (value: number, unit: import("dayjs").OpUnitType) => Dayjs;
+    subtract: (value: number, unit: import("dayjs").OpUnitType) => Dayjs;
+    startOf: (unit: import("dayjs").OpUnitType) => Dayjs;
+    endOf: (unit: import("dayjs").OpUnitType) => Dayjs;
+    format: (template?: string) => string;
+    diff: (date: import("dayjs").ConfigType, unit?: "year" | "month" | "date" | "day" | "hour" | "minute" | "second" | "millisecond" | "week" | "d" | "M" | "y" | "h" | "m" | "s" | "ms" | "w" | "quarter" | "Q", float?: boolean) => number;
+    valueOf: () => number;
+    unix: () => number;
+    daysInMonth: () => number;
+    toDate: () => Date;
+    toJSON: () => string;
+    toISOString: () => string;
+    toString: () => string;
+    utcOffset: () => number;
+    isBefore: (date: import("dayjs").ConfigType, unit?: import("dayjs").OpUnitType) => boolean;
+    isSame: (date: import("dayjs").ConfigType, unit?: import("dayjs").OpUnitType) => boolean;
+    isAfter: (date: import("dayjs").ConfigType, unit?: import("dayjs").OpUnitType) => boolean;
+    locale: {
+        (): string;
+        (preset: string | ILocale, object?: Partial<ILocale>): Dayjs;
+    };
+    localeData: () => any;
+    week: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    weekYear: () => number;
+    dayOfYear: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    isSameOrAfter: (date: import("dayjs").ConfigType, unit?: import("dayjs").OpUnitType) => boolean;
+    isSameOrBefore: (date: import("dayjs").ConfigType, unit?: import("dayjs").OpUnitType) => boolean;
+} | {
+    clone: () => Dayjs;
+    isValid: () => boolean;
+    year: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    month: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    date: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    day: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    hour: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    minute: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    second: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    millisecond: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    set: (unit: import("dayjs").UnitType, value: number) => Dayjs;
+    get: (unit: import("dayjs").UnitType) => number;
+    add: (value: number, unit: import("dayjs").OpUnitType) => Dayjs;
+    subtract: (value: number, unit: import("dayjs").OpUnitType) => Dayjs;
+    startOf: (unit: import("dayjs").OpUnitType) => Dayjs;
+    endOf: (unit: import("dayjs").OpUnitType) => Dayjs;
+    format: (template?: string) => string;
+    diff: (date: import("dayjs").ConfigType, unit?: "year" | "month" | "date" | "day" | "hour" | "minute" | "second" | "millisecond" | "week" | "d" | "M" | "y" | "h" | "m" | "s" | "ms" | "w" | "quarter" | "Q", float?: boolean) => number;
+    valueOf: () => number;
+    unix: () => number;
+    daysInMonth: () => number;
+    toDate: () => Date;
+    toJSON: () => string;
+    toISOString: () => string;
+    toString: () => string;
+    utcOffset: () => number;
+    isBefore: (date: import("dayjs").ConfigType, unit?: import("dayjs").OpUnitType) => boolean;
+    isSame: (date: import("dayjs").ConfigType, unit?: import("dayjs").OpUnitType) => boolean;
+    isAfter: (date: import("dayjs").ConfigType, unit?: import("dayjs").OpUnitType) => boolean;
+    locale: {
+        (): string;
+        (preset: string | ILocale, object?: Partial<ILocale>): Dayjs;
+    };
+    localeData: () => any;
+    week: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    weekYear: () => number;
+    dayOfYear: {
+        (): number;
+        (value: number): Dayjs;
+    };
+    isSameOrAfter: (date: import("dayjs").ConfigType, unit?: import("dayjs").OpUnitType) => boolean;
+    isSameOrBefore: (date: import("dayjs").ConfigType, unit?: import("dayjs").OpUnitType) => boolean;
+}[]>;

src/components/common/MytTimePicker/src/time-picker.d.ts

@@ -0,0 +1,154 @@
+declare const _default: import("vue").DefineComponent<{
+    isRange: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    name: {
+        type: (ArrayConstructor | StringConstructor)[];
+        default: string;
+    };
+    popperClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    format: {
+        type: StringConstructor;
+    };
+    type: {
+        type: StringConstructor;
+        default: string;
+    };
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    clearIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    editable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    prefixIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    size: {
+        type: import("vue").PropType<ComponentSize>;
+        validator: (val: string) => boolean;
+    };
+    readonly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    popperOptions: {
+        type: import("vue").PropType<import("@popperjs/core").Options>;
+        default: () => {};
+    };
+    modelValue: {
+        type: import("vue").PropType<string | Date | Date[]>;
+        default: string;
+    };
+    rangeSeparator: {
+        type: StringConstructor;
+        default: string;
+    };
+    startPlaceholder: StringConstructor;
+    endPlaceholder: StringConstructor;
+    defaultValue: {
+        type: import("vue").PropType<Date | Date[]>;
+    };
+    defaultTime: {
+        type: import("vue").PropType<Date | Date[]>;
+    };
+    disabledHours: {
+        type: FunctionConstructor;
+    };
+    disabledMinutes: {
+        type: FunctionConstructor;
+    };
+    disabledSeconds: {
+        type: FunctionConstructor;
+    };
+    disabledDate: {
+        type: FunctionConstructor;
+    };
+    cellClassName: {
+        type: FunctionConstructor;
+    };
+    shortcuts: {
+        type: ArrayConstructor;
+        default: () => any[];
+    };
+    arrowControl: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    validateEvent: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    unlinkPanels: BooleanConstructor;
+}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    isRange: boolean;
+    name: unknown;
+    popperClass: unknown;
+    type: unknown;
+    clearable: boolean;
+    clearIcon: unknown;
+    editable: boolean;
+    prefixIcon: unknown;
+    readonly: boolean;
+    disabled: boolean;
+    placeholder: unknown;
+    popperOptions: unknown;
+    modelValue: unknown;
+    rangeSeparator: unknown;
+    shortcuts: unknown;
+    arrowControl: boolean;
+    validateEvent: boolean;
+    unlinkPanels: boolean;
+} & {
+    format?: unknown;
+    size?: unknown;
+    startPlaceholder?: unknown;
+    endPlaceholder?: unknown;
+    defaultValue?: unknown;
+    defaultTime?: unknown;
+    disabledHours?: unknown;
+    disabledMinutes?: unknown;
+    disabledSeconds?: unknown;
+    disabledDate?: unknown;
+    cellClassName?: unknown;
+}>, {
+    isRange: boolean;
+    name: unknown;
+    popperClass: unknown;
+    type: unknown;
+    clearable: boolean;
+    clearIcon: unknown;
+    editable: boolean;
+    prefixIcon: unknown;
+    readonly: boolean;
+    disabled: boolean;
+    placeholder: unknown;
+    popperOptions: unknown;
+    modelValue: unknown;
+    rangeSeparator: unknown;
+    shortcuts: unknown;
+    arrowControl: boolean;
+    validateEvent: boolean;
+    unlinkPanels: boolean;
+}>;
+export default _default;

src/components/common/Pagination.vue

@@ -11,7 +11,6 @@
         :page-size="Number(pageObj.pageSize)"
         :layout="layout"
         :total="pageObj.total"
-        v-bind="bind"
     >
       <el-select v-model="pageSize" :placeholder="pageSize+$t('pageSize')" size="mini"
                  :popper-append-to-body="appendToBody" class="pagination-size-select" @change="size"
@@ -24,8 +23,8 @@
 </template>
 
 <script>
-import { defaultPageSize, storageKey } from '@/utils/constants'
-
+import { defaultPageSize } from '@/utils/constants'
+import { storageKey } from '@/utils/constants'
 import { urlParamsHandler, overwriteUrl } from '@/utils/tools'
 import { ref } from 'vue'
 import { useRoute } from 'vue-router'
@@ -43,23 +42,15 @@ export default {
     layout: {
       type: String,
       default: 'total, prev, pager, next, slot'
-    },
-    bind: {
-      type: Object,
-      default: () => {}
-    },
-    storePageNoOnUrl: {
-      type: Boolean,
-      default: true
     }
   },
   /**
    * 添加vue3的setup，目的是添加/获取地址栏的参数
    */
-  setup (props) {
+  setup () {
     const { query } = useRoute()
     const pageSize = ref(defaultPageSize)
-    const currentPageNo = ref(props.storePageNoOnUrl ? (query.pageNo || (props.pageObj.pageNo || 1)) : (props.pageObj.pageNo || 1))
+    const currentPageNo = ref(query.pageNo || 1)
 
     return {
       pageSize,
@@ -195,6 +186,7 @@ export default {
       }
     }
 
+    this.size(this.pageSize)
     this.currentPageNo = parseInt(this.currentPageNo)
     this.current(this.currentPageNo)
   },

src/components/common/TimeRange/DateTimeRange.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-ele-click-outside="changeDropdown" style="position: relative;z-index: 1" class="date-range-box">
+  <div v-ele-click-outside="changeDropdown" style="position: relative;z-index: 2" class="date-range-box">
     <div @click="showDropdown" class="date-range-text">
       <div class="calendar-popover-text"><i class="cn-icon cn-icon-Data"></i></div>
       <div class="calendar-popover-text" style="display: flex" v-if="isCustom">
@@ -25,7 +25,6 @@
                 class="date_style"
                 style="position: absolute;top: -53px;left: -536px;"
                 :clearable="false"
-                :default-time="defaultTime"
                 type="datetimerange"
                 @change="timeArrChange"
             />
@@ -87,7 +86,7 @@ export default {
   props: {
     startTime: {
       type: Number,
-      default: window.$dayJs.tz().valueOf() - 60 * 60 * 1000
+      default: window.$dayJs.tz().valueOf() - 1 * 60 * 60 * 1000
     },
     endTime: {
       type: Number,
@@ -128,11 +127,6 @@ export default {
       { value: 2880, name: 'last 2 days' }
     ]
     const dropdownFlag = ref(false)
-    // 默认日历选择时间，即开始时间YYYY-MM-DD 00:00:00,结束时间YYYY-MM-DD 59:59:59
-    const defaultTime = ref([
-      new Date(2023, 1, 1, 0, 0, 0),
-      new Date(2023, 1, 2, 23, 59, 59)
-    ])
 
     // computed
     const utcStr = computed(() => {
@@ -280,7 +274,6 @@ export default {
       rangeEchartsData,
       address,
       dateRangeArr,
-      defaultTime,
       dateRangeValue,
       isCustom,
       newDateValue,
@@ -300,3 +293,9 @@ export default {
   }
 }
 </script>
+
+<style scoped>
+/deep/.el-input__inner {
+  visibility: hidden !important;
+}
+</style>

src/components/common/TimeRange/TimeRefresh.vue

@@ -42,9 +42,17 @@ export default {
       unit: 2,
       dropdownShow: false,
       interLabel: ''
+      // refreshArr: [
+      //   { value: -1, label: 'off' },
+      //   { value: 30, label: '30s' },
+      //   { value: 60, label: '1m' },
+      //   { value: 300, label: '5m' },
+      //   { value: 900, label: '15m' },
+      //   { value: 1800, label: '30m' }
+      // ]
     }
   },
-  setup () {
+  setup (props, ctx) {
     const { query } = useRoute()
     const store = useStore()
     const refreshArr = [
@@ -92,12 +100,13 @@ export default {
   methods: {
     setRefresh (val) {
       this.interval = val.value
-      this.interLabel = val.value === -1 ? '' : val.label
+      this.interLabel = val.value == -1 ? '' : val.label
       this.dropdownShow = false
       const now = window.$dayJs.tz().valueOf()
       if (val && val.value !== -1) {
         // 切换轮询请求时间频率时，发现有未结束的请求，终止请求
         const cancelList = this.$store.state.panel.httpCancel
+        // console.log('timeRefresh.vue------setRefresh------查看终止数量', cancelList, cancelList.length)
         if (cancelList.length > 0) {
           cancelList.forEach((cancel, index) => {
             cancel()
@@ -110,7 +119,6 @@ export default {
         }
         this.reloadUrl(dateParam)
         this.$store.commit('setRefreshTime', val.value)
-        this.$store.commit('setRefreshFlag', true)
 
         // 设置定时器
         this.intervalTimer = setInterval(() => {

src/components/layout/Header.vue

@@ -4,7 +4,7 @@
       <div class="banner__left">
         <span @click="shrink" class="shrink-button" :class="{'shrink-button--collapse': showMenu}"><i
             class="cn-icon cn-icon-navigation"></i></span>
-        <img alt="loading..." height="26" :src="logo?logo:require('../../assets/img/logo-header.svg')" @click="jump('/panel/networkOverview', '', '', 0)" style="cursor: pointer"/>
+        <img alt="loading..." height="26" :src="logo?logo:require('../../assets/img/logo-header.svg')"/>
       </div>
       <!--个人操作-->
       <div class="personal">
@@ -42,9 +42,9 @@
     </div>
     <div class="cn-header__nav">
       <i class="cn-icon cn-icon-a-NetworkAnalytics"></i>
-      <el-breadcrumb class="header__left-breadcrumb" separator=">">
-        <el-breadcrumb-item class="header__left-breadcrumb-item" :id="`breadcrumb${item.value}`" :title="item.value"
-                            v-for="(item,index) in breadcrumb" :key="item.value">
+      <el-breadcrumb class="header__left-breadcrumb" :separator="route.indexOf('detection') === -1 ? '>' : ''">
+        <el-breadcrumb-item class="header__left-breadcrumb-item" :id="`breadcrumb${item}`" :title="item"
+                            v-for="(item,index) in breadcrumb" :key="item">
           <template v-if="index===3">
             <div class="header__left-breadcrumb-item-select">
               <el-popover placement="bottom-start"
@@ -54,7 +54,7 @@
                           :hide-after="0"
                           :show-after="0"
                           popper-class="breadcrumb__popper"
-                          @show="showBreadcrumbPopover(item.value)"
+                          @show="showBreadcrumbPopover(item)"
                           @hide="hideBreadcrumbPopover()"
                           trigger="click">
                 <template #reference>
@@ -62,13 +62,13 @@
                        :class="showBackground?'breadcrumb-button__active':''">
                     <span id="breadcrumbValue">
                       <template v-if="curTabProp === 'qtype'">
-                        <span>{{ dnsQtypeMapData.get(item.value)}}</span>
+                        <span>{{ dnsQtypeMapData.get(item)}}</span>
                       </template>
                       <template v-else-if="curTabProp === 'rcode'">
-                        <span>{{ dnsRcodeMapData.get(item.value)}}</span>
+                        <span>{{ dnsRcodeMapData.get(item)}}</span>
                       </template>
                       <template v-else>
-                        <span>{{ item.value }}</span>
+                        <span>{{ item }}</span>
                       </template>
                     </span><i class="cn-icon-xiala cn-icon"></i>
                   </div>
@@ -82,7 +82,7 @@
                   </div>
                   <ul class="select-dropdown" id="breadcrumbSelectDropdown" @scroll="scrollList()">
                     <li v-for="item in breadcrumbColumnValueListShow" title='' :key="item" :id="item"
-                        class="select-dropdown__item" @click="changeValue(item)">
+                        class="select-dropdown__item" @click="changeValue(item)" :class="selected?'':''">
                       <template v-if="curTabProp === 'qtype'">
                         <span>{{ dnsQtypeMapData.get(item) }}</span>
                       </template>
@@ -99,17 +99,39 @@
             </div>
           </template>
           <template v-else-if="index===2">
-            <span v-if="route===wholeScreenRouterMapping.dns">{{ $t(item.value) }}</span>
-            <span v-else class="route-menu" @click="jump(route,item.value,'',3)">{{ $t(item.value) }}</span>
+            <span v-if="route===wholeScreenRouterMapping.dns">{{ $t(item) }}</span>
+            <span v-else class="route-menu" @click="jump(route,item,'',3)">{{ $t(item) }}</span>
           </template>
-          <!-- index=0和index=1的点击跳转由breadcrumb里的数据控制 -->
           <template v-else-if="index===1">
-            <span v-if="item.clickable" class="route-menu" @click="jump(route,'','',2)">{{ item.value }}</span>
-            <span v-else>{{ item.value }}</span>
+            <span class="route-menu" @click="jump(route,'','',2)"
+                  v-if="route.indexOf('detection') === -1">{{ item }}</span>
+            <!--            <div class="header__left-breadcrumb-item-select" v-if="route.indexOf('detection') > -1">-->
+            <!--              <el-popover placement="bottom-start"-->
+            <!--                          v-if="route.indexOf('detection') > -1"-->
+            <!--                          ref="breadcrumbPopover"-->
+            <!--                          :show-arrow="false"-->
+            <!--                          :append-to-body="false"-->
+            <!--                          :hide-after="0"-->
+            <!--                          :show-after="0"-->
+            <!--                          popper-class="breadcrumb__popper"-->
+            <!--                          trigger="click">-->
+            <!--                <template #reference>-->
+            <!--                  <div class="breadcrumb-button"  id="breadcrumbButton2" :class="showBackground?'breadcrumb-button__active':''"  v-if="route.indexOf('detection') > -1">-->
+            <!--                    <span id="breadcrumbValue2"> {{item}}</span><i class="cn-icon-xiala cn-icon"></i>-->
+            <!--                  </div>-->
+            <!--                </template>-->
+            <!--                <el-row type="flex" justify="center" style="width: fit-content;flex-direction: column;">-->
+            <!--                  <ul class="select-dropdown" id="breadcrumbSelectDropdown2">-->
+            <!--                    <li v-for="item in detectionMenuList" title='' :key="item.name" :id="item.name" class="select-dropdown__item" @click="jump(item.path,'','',2)">-->
+            <!--                      <span>{{$t(item.i18n)}}</span>-->
+            <!--                    </li>-->
+            <!--                  </ul>-->
+            <!--                </el-row>-->
+            <!--              </el-popover>-->
+            <!--            </div>-->
           </template>
           <template v-else>
-            <span v-if="item.clickable" class="route-menu" @click="jump(item.route,'','',0)">{{ item.value }}</span>
-            <span v-else>{{ item.value }}</span>
+            <span>{{ item }}</span>
           </template>
         </el-breadcrumb-item>
       </el-breadcrumb>
@@ -206,12 +228,11 @@ import {
   getTabList,
   overwriteUrl,
   urlParamsHandler,
-  combineDrilldownTableWithUserConfig,
+  combinDrilldownTableWithUserConfig,
   getDnsMapData,
   handleSpecialValue
 } from '@/utils/tools'
 import { getNowTime, getSecond } from '@/utils/date-util'
-import _ from 'lodash'
 
 export default {
   name: 'Header',
@@ -280,8 +301,7 @@ export default {
       curPageNum: 1,
       curTabState: curTabState,
       urlChangeParams: {},
-      wholeScreenRouterMapping,
-      logo: '' // 此处logo的url未被初始化，可能后续会改动
+      wholeScreenRouterMapping
     }
   },
   computed: {
@@ -289,7 +309,7 @@ export default {
       return this.$store.getters.menuList.find(menu => menu.code === 'networkAnalytics')
     },
     otherMenu () {
-      return this.$store.getters.menuList.filter(menu => ['networkAnalytics', 'chart', 'I18N'].indexOf(menu.code) === -1)
+      return this.$store.getters.menuList.filter(menu => menu.code !== 'networkAnalytics')
 
       /* function excludeButton (menu) {
         for (let i = 0; i < menu.length; i++) {
@@ -305,28 +325,38 @@ export default {
       } */
     },
     breadcrumb () {
-      const breadcrumb = []
-      this.generateBreadcrumb(breadcrumb, this.$store.getters.menuList)
-      // 写死一级和二级菜单是否可以点击跳转
-      if (breadcrumb[0]) {
-        if (['knowledgeBase'].indexOf(breadcrumb[0].code) > -1) {
-          breadcrumb[0].clickable = true
+      const breadcrumbMap = []
+      this.curTabProp = this.$route.query.dimensionType ? this.$route.query.dimensionType : null
+      this.$store.getters.menuList.forEach(menu => {
+        if (this.$_.isEmpty(menu.children) && menu.route) {
+          breadcrumbMap.push({
+            name: this.$t(menu.i18n),
+            path: menu.route,
+            columnName: menu.columnName,
+            columnValue: menu.columnValue
+          })
+        } else if (!this.$_.isEmpty(menu.children)) {
+          menu.children.forEach(child => {
+            breadcrumbMap.push({
+              name: child.i18n ? this.$t(child.i18n) : child.name,
+              parentName: menu.i18n ? this.$t(menu.i18n) : menu.name,
+              path: child.route,
+              columnName: child.columnName,
+              columnValue: child.columnValue
+            })
+          })
         }
-        if (breadcrumb[1]) {
-          if (breadcrumb[1].route && breadcrumb[1].route.indexOf('/panel/') === 0) {
-            breadcrumb[1].clickable = true
-          }
-        }
-      }
-
+      })
+      const breadcrumb = breadcrumbMap.find(b => this.route === b.path)
       const thirdMenu = this.getUrlParam(this.curTabState.thirdMenu, '')
       const fourthMenu = this.getUrlParam(this.curTabState.fourthMenu, '')
-
-      let result = [...breadcrumb]
+      let result = []
       if (fourthMenu) {
-        result = [...result, { value: thirdMenu }, { value: fourthMenu }]
+        result = breadcrumb ? [breadcrumb.parentName, breadcrumb.name, thirdMenu, fourthMenu] : []
       } else if (thirdMenu) {
-        result = [...result, { value: thirdMenu }]
+        result = breadcrumb ? [breadcrumb.parentName, breadcrumb.name, thirdMenu] : []
+      } else {
+        result = breadcrumb ? [breadcrumb.parentName, breadcrumb.name] : []
       }
       return result
     },
@@ -348,29 +378,14 @@ export default {
       if (this.from !== n) {
         this.from = n
       }
-    },
-    async breadcrumb (n) {
-      this.curTabProp = this.$route.query.dimensionType ? this.$route.query.dimensionType : null
-      if (this.$route.params.typeName === fromRoute.dnsServiceInsights) {
-        if (this.dnsQtypeMapData.size === 0) {
-          this.dnsQtypeMapData = await getDnsMapData('dnsQtype')
-        }
-        if (this.dnsRcodeMapData.size === 0) {
-          this.dnsRcodeMapData = await getDnsMapData('dnsRcode')
-        }
-      }
     }
   },
   async mounted () {
     this.from = Object.keys(this.entityType)[0]
     // 是否需要dns的qtype和rcode的数据字典
-    if (this.$route.params.typeName === fromRoute.dnsServiceInsights) {
-      if (this.dnsQtypeMapData.size === 0) {
-        this.dnsQtypeMapData = await getDnsMapData('dnsQtype')
-      }
-      if (this.dnsRcodeMapData.size === 0) {
-        this.dnsRcodeMapData = await getDnsMapData('dnsRcode')
-      }
+    if(this.$route.params.typeName === fromRoute.dnsServiceInsights) {
+      this.dnsQtypeMapData = await getDnsMapData('dnsQtype')
+      this.dnsRcodeMapData = await getDnsMapData('dnsRcode')
     }
     this.initDropdownList()
   },
@@ -391,32 +406,6 @@ export default {
     }
   },
   methods: {
-    generateBreadcrumb (breadcrumb, menus) {
-      const menu = menus.find(m => m.route === this.route)
-      if (menu) {
-        breadcrumb.unshift({
-          code: menu.code,
-          value: menu.i18n ? this.$t(menu.i18n) : menu.name,
-          route: menu.route,
-          type: menu.type
-        })
-        return true
-      } else {
-        for (let i = 0; i < menus.length; i++) {
-          if (!_.isEmpty(menus[i].children)) {
-            if (this.generateBreadcrumb(breadcrumb, menus[i].children)) {
-              breadcrumb.unshift({
-                code: menus[i].code,
-                value: menus[i].i18n ? this.$t(menus[i].i18n) : menus[i].name,
-                route: menus[i].route,
-                type: menus[i].type
-              })
-              return true
-            }
-          }
-        }
-      }
-    },
     handleClose () {
       this.showChangePin = false
     },
@@ -446,7 +435,7 @@ export default {
       const tableType = this.$route.params ? this.$route.params.typeName : 'networkOverview'
       const curTableInCode = networkTable[tableType] ? networkTable[tableType] : networkTable.networkOverview
       if (curTableInCode && curTableInCode.tabList) {
-        curTab = curTableInCode.tabList.find(item => item.label === label)
+        curTab = curTableInCode.tabList.find(item => item.label == label)
       }
       return curTab
     },
@@ -459,7 +448,7 @@ export default {
       const tableType = this.$route.params ? this.$route.params.typeName : 'networkOverview'
       const curTableInCode = networkTable[tableType] ? networkTable[tableType] : networkTable.networkOverview
       if (curTableInCode && curTableInCode.tabList) {
-        const curTab = curTableInCode.tabList.find(item => item.label === columnName)
+        const curTab = curTableInCode.tabList.find(item => item.label == columnName)
         if (curTab) {
           type = curTab.prop
         }
@@ -471,20 +460,12 @@ export default {
         type: type,
         name: this.dropDownValue ? this.dropDownValue : ''
       }
-      // 有的界面刷新时没有drilldownList接口地址，会报404
-      if (!curTableInCode.url.drilldownList) {
-        return true
-      }
       get(curTableInCode.url.drilldownList, params).then(async response => {
         if (response.code === 200) {
           this.breadcrumbColumnValueListShow = response.data.result
-          if (this.$route.params.typeName === fromRoute.dnsServiceInsights) {
-            if (this.dnsQtypeMapData.size === 0) {
-              this.dnsQtypeMapData = await getDnsMapData('dnsQtype')
-            }
-            if (this.dnsRcodeMapData.size === 0) {
-              this.dnsRcodeMapData = await getDnsMapData('dnsRcode')
-            }
+          if(this.from === fromRoute.dnsServiceInsights) {
+            this.dnsQtypeMapData = await getDnsMapData('dnsQtype')
+            this.dnsRcodeMapData = await getDnsMapData('dnsRcode')
           }
           this.$nextTick(() => {
             this.breadcrumbColumnValueListShow.forEach(item => {
@@ -548,7 +529,7 @@ export default {
             queryCondition.push('common_l7_protocol=\'' + valueGroup[0] + '\'')
             queryCondition.push('common_server_port=' + valueGroup[1])
           }
-          // console.log(queryCondition.join(' AND '))
+          console.log(queryCondition.join(' AND '))
           this.urlChangeParams[this.curTabState.queryCondition] = queryCondition.join(' AND ')
         } else {
           searchProps.forEach(item => {
@@ -590,17 +571,17 @@ export default {
       }
       this.urlChangeParams = {}
     },
-    async handleCurDrilldownTableConfig (thirdMenu) {
+    async handleCurDrilldownTableConfig (thirdMenu, fourthMenu) {
       // const userId = localStorage.getItem(storageKey.userId)
       const tableType = this.$route.params ? this.$route.params.typeName : 'networkOverview'
-      const metric = this.getUrlParam(this.curTabState.tableMetric, 'Bits/s')
-      const drillDownTableConfigs = await combineDrilldownTableWithUserConfig()
+      const drillDownTableConfigs = await combinDrilldownTableWithUserConfig()
       const currentTableConfig = drillDownTableConfigs.find(config => config.route === tableType)
       const tables = currentTableConfig ? currentTableConfig.tables : []
       const commonTabList = currentTableConfig ? currentTableConfig.tabs : []
       if (tables && tables.length > 0) {
         const curTable = tables.find(table => table.id === tableType)
         if (curTable) {
+          const metric = this.getUrlParam(this.curTabState.tableMetric, 'Bits/s')
           const tabList = getTabList(curTable, metric)// 未下钻的tab列表
           if (tabList && tabList.length > 0) {
             combineTabList(tableType, tabList, commonTabList)
@@ -614,16 +595,15 @@ export default {
       }
     },
     jump (route, columnName, columnValue, opeType) {
-      if (route === '/panel/linkMonitor' && opeType === 3) {
-        return true
-      }
       this.showMenu = false
       const menus = this.breadcrumb
       if (opeType) {
         this.urlChangeParams[this.curTabState.tabOperationBeforeType] = this.getUrlParam(this.curTabState.tabOperationType, '', true)
         this.urlChangeParams[this.curTabState.tabOperationType] = opeType
         if (opeType === 3) {
-          this.urlChangeParams.queryCondition = ''
+          if (route !== '/panel/networkOverview') {
+            this.urlChangeParams.queryCondition = ''
+          }
         }
       } else {
         this.urlChangeParams[this.curTabState.tabOperationType] = operationType.mainMenu
@@ -688,7 +668,7 @@ export default {
             t: +new Date()
           }
         })
-      } else if (opeType !== 4) {
+      } else if (opeType != 4) {
         this.$router.push({
           query: {
             ...this.$route.query,

src/components/rightBox/report/ReportBox.vue

@@ -8,7 +8,7 @@
     </div>
     <div class="right-box__container">
       <div class="container__form">
-        <el-form ref="reportForm" :model="editObject" :rules="rules" label-position="top" label-width="120px">
+        <el-form ref="userForm" :model="editObject" :rules="rules" label-position="top" label-width="120px">
           <!--name-->
           <el-form-item :label="$t('report.name')" prop="name">
             <el-input id="account-input-name" v-model="editObject.name" maxlength="64" placeholder=" " show-word-limit size="small" type="text"></el-input>
@@ -19,6 +19,7 @@
                        v-model="editObject.config.timeConfig.type"
                        class="right-box__select"
                        collapse-tags
+                       :disabled="!!editObject.id"
                        placeholder=" "
                        popper-class="right-box-select-dropdown right-box-select-report "
                        size="small"
@@ -30,6 +31,7 @@
             </el-select>
             <template v-if="editObject.config.timeConfig.type === 'this'">
               <el-select id="reportBoxTimeUnitSelect"
+                         :disabled="!!editObject.id"
                          v-model="editObject.config.timeConfig.unit"
                          class="right-box__select"
                          collapse-tags
@@ -43,7 +45,7 @@
               </el-select>
             </template>
             <div v-else-if="editObject.config.timeConfig.type === 'last' || editObject.config.timeConfig.type === 'previous'" style="display: flex;">
-              <el-input v-model.number="editObject.config.timeConfig.offset" size="small" class="el-input-single" placeholder=" ">
+              <el-input v-model.number="editObject.config.timeConfig.offset" size="small" class="el-input-single" placeholder=" " :disabled="!!editObject.id">
                 <template #prepend><i @click="timeOffsetHandle('m')" class="cn-icon cn-icon-a-"></i></template>
                 <template #append><i @click="timeOffsetHandle('p')" class="cn-icon cn-icon-a-1"></i></template>
               </el-input>
@@ -51,6 +53,7 @@
                          v-model="editObject.config.timeConfig.unit"
                          class="right-box__select right-box__select-single"
                          collapse-tags
+                         :disabled="!!editObject.id"
                          placeholder=" "
                          popper-class="right-box-select-dropdown  el-select-last"
                          size="small"
@@ -70,8 +73,10 @@
                     v-model="editObject.config.startTime"
                     size="small"
                     :format="dateFormat"
+                    :disabled="!!editObject.id"
                     :disabled-date="startDisabledDate"
                     @change="startTimeChang"
+                    @focus="startFocus"
                     prefix-icon="cn-icon cn-icon-shijian"
                     type="datetime"
                     placeholder=" "
@@ -88,8 +93,10 @@
                     v-model="editObject.config.endTime"
                     size="small"
                     :format="dateFormat"
+                    :disabled="!!editObject.id"
                     :disabled-date="endDisabledDate"
                     @change="endTimeChange"
+                    @focus="endFocus"
                     prefix-icon="cn-icon cn-icon-shijian"
                     type="datetime"
                     placeholder=" "
@@ -98,41 +105,41 @@
             </div>
           </el-form-item >
           <el-form-item class="el-height">
-            <el-checkbox v-model="scheduleChecked" :disabled="editObject.config.timeConfig.type === 'customize'" :label="$t('report.enableTimeSchedule')" size="large" />
+            <el-checkbox v-model="scheduleChecked" :disabled="editObject.config.timeConfig.type === 'customize' || !!editObject.id" :label="$t('report.enableTimeSchedule')" size="large" />
           </el-form-item>
           <!--Enable time schedule-->
           <el-form-item prop="enableTimeSchedule" v-if="scheduleChecked">
             <div class="enable-tab">
-              <div class="enable-tabs" @click="scheduleTypeChange(type.value)" v-for="type in scheduleTypeList" :key="type.value" :class="{'active': scheduleType === type.value}">{{$t(type.name)}}</div>
+              <div class="enable-tabs" @click="editObject.id ? null : (scheduleType = type.value)" v-for="type in scheduleTypeList" :key="type.value" :class="{'active': scheduleType === type.value, 'disable': editObject.id}">{{$t(type.name)}}</div>
             </div>
             <div class="enable-tabs-daily" v-if="scheduleType === scheduleTypeList[0].value">
               <div class="enable-tabs-custom">{{$t('report.customEvery')}}</div>
-              <el-input v-model.number="editObject.config.schedulerConfig.interval" size="small" placeholder=" " style="margin-top: 0.3125rem;">
+              <el-input v-model.number="editObject.config.schedulerConfig.interval" size="small" placeholder=" " style="margin-top: 0.3125rem;" :disabled="!!editObject.id">
                 <template #append>{{$t('report.day')}}</template>
               </el-input>
             </div>
-            <div class="enable-tabs-weekly" v-else-if="scheduleType === scheduleTypeList[1].value">
+            <div class="enable-tabs-weekly" v-else-if="scheduleType === scheduleTypeList[1].value" :disabled="!!editObject.id">
               <!-- 每隔几周暂时隐藏 -->
               <!-- <div class="enable-tabs-custom">{{$t('report.customEvery')}}</div>
               <el-input v-model="editObject.config.schedulerConfig.interval" size="small" placeholder="Please input">
                 <template #append>{{$t('report.week')}}</template>
               </el-input>-->
-              <el-checkbox-group v-model="editObject.config.schedulerConfig.weekDates" style="margin-top: 0.3125rem">
+              <el-checkbox-group v-model="editObject.config.schedulerConfig.weekDates" style="margin-top: 0.3125rem" :disabled="!!editObject.id">
                 <el-checkbox v-for="(item, index) in weekdayList" :key="index" :label="item.value">{{$t(item.name)}}</el-checkbox>
               </el-checkbox-group>
             </div>
             <!-- 月 -->
             <div class="enable-tabs-per-month" v-else-if="scheduleType === scheduleTypeList[2].value">
               <div class="enable-month-tab">
-                <div class="enable-month-tabs" @click="monthScheduleType = 'daily'" :class="{'active': monthScheduleType === 'daily'}">{{$t('report.date')}}</div>
-                <div class="enable-month-tabs" @click="monthScheduleType = 'weekly'" :class="{'active': monthScheduleType === 'weekly'}">{{$t('report.week')}}</div>
-                <el-checkbox v-model="monthIsCycle" :label="$t('report.cycle')" size="large"/>
+                <div class="enable-month-tabs" @click="editObject.id ? null : (monthScheduleType = 'daily')" :class="{'active': monthScheduleType === 'daily', 'disable': editObject.id}">{{$t('report.date')}}</div>
+                <div class="enable-month-tabs" @click="editObject.id ? null : (monthScheduleType = 'weekly')" :class="{'active': monthScheduleType === 'weekly', 'disable': editObject.id}">{{$t('report.week')}}</div>
+                <el-checkbox v-model="monthIsCycle" :label="$t('report.cycle')" size="large" :disabled="!!editObject.id"/>
               </div>
               <div class="enable-month-data-tab">
                 <!-- 自定义月，循环 -->
                 <template v-if="monthIsCycle">
                   <div class="enable-tabs-custom">{{$t('report.customEvery')}}</div>
-                  <el-input v-model="editObject.config.schedulerConfig.interval" size="small" placeholder=" " style="margin-top: 0.3125rem;">
+                  <el-input v-model="editObject.config.schedulerConfig.interval" size="small" placeholder=" " style="margin-top: 0.3125rem;" :disabled="!!editObject.id">
                     <template #append>{{$t('report.month')}}</template>
                   </el-input>
                 </template>
@@ -140,8 +147,8 @@
                 <template v-else>
                   <div class="enable-month-moon-custom">{{$t('report.custom')}}</div>
                   <div class="enable-month-all">
-                    <el-checkbox v-model="monthCheckedAll" class="enable-month-all-months" :indeterminate="monthIsIndeterminate" @change="monthCheckAllChange" :label="$t('report.allMonths')"/>
-                    <el-checkbox-group v-model="editObject.config.schedulerConfig.months" @change="monthCheckChange">
+                    <el-checkbox v-model="monthCheckedAll" class="enable-month-all-months" :indeterminate="monthIsIndeterminate" @change="monthCheckAllChange" :label="$t('report.allMonths')" :disabled="!!editObject.id"/>
+                    <el-checkbox-group v-model="editObject.config.schedulerConfig.months" @change="monthCheckChange" :disabled="!!editObject.id">
                       <el-checkbox v-for="(item, index) in monthList" :key="index" :label="item.value">{{$t(item.name)}}</el-checkbox>
                     </el-checkbox-group>
                   </div>
@@ -149,8 +156,8 @@
                 <!-- 按日期 -->
                 <template v-if="monthScheduleType === 'daily'">
                   <div class="enable-month-data-tabs">
-                    <el-checkbox v-model="dateCheckedAll" :indeterminate="dateIsIndeterminate" @change="dateCheckAllChange" :label="$t('report.all')" size="large"/>
-                    <el-checkbox-group v-model="editObject.config.schedulerConfig.monthDates" @change="dateCheckChange">
+                    <el-checkbox v-model="dateCheckedAll" :indeterminate="dateIsIndeterminate" @change="dateCheckAllChange" :label="$t('report.all')" size="large" :disabled="!!editObject.id"/>
+                    <el-checkbox-group v-model="editObject.config.schedulerConfig.monthDates" @change="dateCheckChange" :disabled="!!editObject.id">
                       <el-checkbox v-for="item in dateList" :key="item" :label="item"/>
                     </el-checkbox-group>
                   </div>
@@ -163,6 +170,7 @@
                              class="right-box__select"
                              multiple
                              placeholder=" "
+                             :disabled="!!editObject.id"
                              popper-class="right-box-select-dropdown right-box-select-report"
                              size="small"
                              @change="()=>{ this.$forceUpdate() }">
@@ -171,8 +179,8 @@
                     </template>
                   </el-select>
                   <div class="enable-month-week">
-                    <el-checkbox v-model="monthWeekdayCheckedAll" class="enable-month-week-all" :label="$t('report.all')" :indeterminate="monthWeekdayIsIndeterminate" @change="monthWeekdayCheckAllChange" size="large"/>
-                    <el-checkbox-group v-model="editObject.config.schedulerConfig.weekDates" @change="monthWeekdayCheckChange">
+                    <el-checkbox v-model="monthWeekdayCheckedAll" class="enable-month-week-all" :label="$t('report.all')" :indeterminate="monthWeekdayIsIndeterminate" @change="monthWeekdayCheckAllChange" size="large" :disabled="!!editObject.id"/>
+                    <el-checkbox-group v-model="editObject.config.schedulerConfig.weekDates" @change="monthWeekdayCheckChange" :disabled="!!editObject.id">
                       <el-checkbox v-for="(item, index) in weekdayList" :key="index" :label="item.value">{{$t(item.name)}}</el-checkbox>
                     </el-checkbox-group>
                   </div>
@@ -222,7 +230,7 @@
                        :disabled="!!editObject.id"
                        popper-class="right-box-select-dropdown right-box-select-report"
                        size="small"
-            >
+                       @change="typeChange">
               <template v-for="category in categoryList" :key="category.id">
                 <el-option :label="category.name" :value="category.id"></el-option>
               </template>
@@ -233,29 +241,26 @@
 <!--            <el-input v-model="param.value" placeholder=" " v-for="(param, index) in editObject.categoryParams" :key="index" size="small" style="vertical-align: unset;" :disabled="!!editObject.id">
               <template #prepend>{{param.key}}</template>
             </el-input>-->
-            <template v-for="(param, index) in editObject.categoryParams" :key="index">
-              <el-input v-if="param.labelType === 'input'" v-model="param.value" placeholder=" " size="small" style="vertical-align: unset;" :disabled="!!editObject.id">
-                <template #prepend>{{param.key}}</template>
-              </el-input>
-              <el-select v-model="param.value"
-                         v-else
-                         class="right-box__select right-box__select--param"
-                         placeholder=" "
-                         filterable
-                         :disabled="!!editObject.id"
-                         popper-class="right-box-select-dropdown right-box-select-report "
-                         size="small"
-              >
-                <template #prefix>
-                  {{$t(param.i18n)}}
-                </template>
-                <template v-for="paramOption in paramsOptions">
-                  <template v-if="paramOption.key === param.key">
+            <el-select v-model="param.value"
+                       v-for="(param, index) in editObject.categoryParams"
+                       :key="index"
+                       class="right-box__select right-box__select--param"
+                       placeholder=" "
+                       filterable
+                       :disabled="!!editObject.id"
+                       popper-class="right-box-select-dropdown right-box-select-report "
+                       size="small"
+            >
+              <template #prefix>
+                {{$t(param.i18n)}}
+              </template>
+              <template v-for="paramOption in paramsOptions">
+                <template v-if="paramOption.key === param.key">
                     <el-option :key="p" :value="p" v-for="p in paramOption.options"></el-option>
                   </template>
                 </template>
-              </el-select>
-            </template>
+
+            </el-select>
           </el-form-item>
         </el-form>
       </div>
@@ -278,8 +283,28 @@ import { api } from '@/utils/api'
 import _ from 'lodash'
 import { get, post, put } from '@/utils/http'
 import { dateFormat, getMillisecond } from '@/utils/date-util'
-import { ref, getCurrentInstance } from 'vue'
-import i18n from '@/i18n'
+import { ref } from 'vue'
+const paramValidator = (rule, value, callback) => {
+  let validate = true
+  if (value && value.length > 0) {
+    const hasEmpty = value.some(v => {
+      return !v.value && v.value !== 0
+    })
+    validate = !hasEmpty
+  }
+  return validate
+}
+const nameValidator = (rule, value, callback) => {
+  let validate = true
+  const reg = /^[\u4e00-\u9fa5A-Za-z0-9\-\_]*$/
+  if (reg.test(value)) {
+    validate = true
+  } else {
+    validate = false
+  }
+  return validate
+}
+
 export default {
   name: 'ReportBox',
   mixins: [rightBoxMixin],
@@ -288,21 +313,32 @@ export default {
     currentCategoryId: Number
   },
   setup () {
-    const { proxy } = getCurrentInstance()
-
     const startTime = ref('')
     const endTime = ref('')
+    const focus = ref('')
+    const focusDate = ref('')
     function endTimeChange (val) {
       endTime.value = val
     }
     function startTimeChang (val) {
       startTime.value = val
     }
+    function startFocus (val) {
+      focus.value = val.target.value
+    }
+    function endFocus (val) {
+      focusDate.value = val.target.value
+    }
     const endDisabledDate = (time) => {
       if (time.getTime() > new Date()) {
         return true
       }
-      if (startTime.value !== '' && startTime.value > time) {
+      if (startTime.value != '' && startTime.value > time) {
+        return true
+      }
+      if (focusDate.value != '' && endTime.value > time) {
+        return false
+      } else if (endTime.value != '' && endTime.value < time) {
         return true
       }
     }
@@ -310,71 +346,22 @@ export default {
       if (time.getTime() > new Date()) {
         return true
       }
-      if (endTime.value !== '' && endTime.value < time) {
+      if (focus.value != '' && startTime.value > time) {
+        return false
+      } else if (startTime.value != '' && startTime.value > time) {
         return true
       }
-    }
-
-    const paramValidator = (rule, value, callback) => {
-      let validate = true
-      if (value && value.length > 0) {
-        const hasEmpty = value.some(v => {
-          return !v.value && v.value !== 0
-        })
-        validate = !hasEmpty
+      if (endTime.value != '' && endTime.value < time) {
+        return true
       }
-      return validate
-    }
-    const nameValidator = (rule, value, callback) => {
-      let validate = true
-      const reg = /^[\u4e00-\u9fa5A-Za-z0-9\-\_]*$/
-      validate = reg.test(value)
-      return validate
-    }
-    const startTimeValidator = (rule, value, callback) => {
-      const form = proxy.$refs.reportForm
-      if (form.model.config.endTime) {
-        form.validateField('config.endTime', () => null)
-      }
-      callback()
-    }
-    const endTimeValidator = (rule, value, callback) => {
-      let validate = true
-      if (startTime.value !== '' && value <= startTime.value) {
-        validate = false
-      }
-      return validate
-    }
-    const rules = { // 表单校验规则
-      name: [
-        { required: true, message: i18n.global.t('validate.required'), trigger: 'blur' },
-        { validator: nameValidator, message: i18n.global.t('validate.onlyAllowNumberLetterChinese-_'), trigger: 'blur' }
-      ],
-      categoryId: [
-        { required: true, message: i18n.global.t('validate.required'), trigger: 'change' }
-      ],
-      schedulerStart: [
-        { required: true, message: i18n.global.t('validate.required'), trigger: 'change' }
-      ],
-      'config.startTime': [
-        { required: true, message: i18n.global.t('validate.required'), trigger: 'change' },
-        { validator: startTimeValidator, trigger: 'change' }
-      ],
-      'config.endTime': [
-        { required: true, message: i18n.global.t('validate.required'), trigger: 'change' },
-        { validator: endTimeValidator, message: i18n.global.t('validate.endTimeGreaterThanStart'), trigger: 'change' }
-      ],
-      categoryParams: [
-        { required: true, message: i18n.global.t('validate.required'), trigger: 'blur' },
-        { validator: paramValidator, message: i18n.global.t('validate.required'), trigger: 'blur' }
-      ]
     }
     return {
       endDisabledDate,
       startDisabledDate,
       startTimeChang,
       endTimeChange,
-      rules
+      startFocus,
+      endFocus
     }
   },
   data () {
@@ -404,20 +391,48 @@ export default {
       monthWeekdayCheckedAll: false,
       monthWeekdayIsIndeterminate: false,
 
+      rules: { // 表单校验规则
+        name: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' },
+          { validator: nameValidator, message: this.$t('validate.onlyAllowNumberLetterChinese-_'), trigger: 'blur' }
+        ],
+        categoryId: [
+          { required: true, message: this.$t('validate.required'), trigger: 'change' }
+        ],
+        schedulerStart: [
+          { required: true, message: this.$t('validate.required'), trigger: 'change' }
+        ],
+        'config.startTime': [
+          { required: true, message: this.$t('validate.required'), trigger: 'change' }
+        ],
+        'config.endTime': [
+          { required: true, message: this.$t('validate.required'), trigger: 'change' }
+        ],
+        categoryParams: [
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' },
+          { validator: paramValidator, message: this.$t('validate.required'), trigger: 'blur' }
+        ]
+      },
       paramsOptions: []
     }
   },
   watch: {
     scheduleType (n, o) {
       this.editObject.config.schedulerConfig.type = n
-      this.cleanScheduleConfig()
+      if (!this.editObject.id) {
+        this.cleanScheduleConfig()
+      }
     },
     scheduleChecked (n) {
       this.editObject.config.isScheduler = n ? 1 : 0
-      this.cleanScheduleConfig()
+      if (!this.editObject.id) {
+        this.cleanScheduleConfig()
+      }
     },
     monthScheduleType (n) {
-      this.cleanScheduleConfig()
+      if (!this.editObject.id) {
+        this.cleanScheduleConfig()
+      }
     },
     monthIsCycle (n) {
       if (!this.editObject.id) {
@@ -551,13 +566,15 @@ export default {
           this.editObject.config.timeConfig.offset--
         }
       }
+    },
+    typeChange (id) {
+
     },
     cleanScheduleConfig () {
       this.editObject.config.schedulerConfig.monthDates = []
       this.editObject.config.schedulerConfig.weekDates = []
       this.editObject.config.schedulerConfig.months = []
       this.editObject.config.schedulerConfig.monthWeekDates = []
-      this.editObject.config.schedulerConfig.interval = 1
       this.monthIsCycle = true
       this.dateCheckedAll = false
       this.dateIsIndeterminate = false
@@ -571,14 +588,11 @@ export default {
         this.scheduleChecked = false
       }
     },
-    scheduleTypeChange (val) {
-      this.scheduleType = val
-    },
     save () {
       if (this.blockOperation.save) { return }
       this.blockOperation.save = true
 
-      this.$refs.reportForm.validate((valid) => {
+      this.$refs.userForm.validate((valid) => {
         if (valid) {
           let startTime = ''
           let endTime = ''

src/components/table/CnDataList.vue

@@ -2,29 +2,31 @@
   <div :class="from" class="list-page">
     <!-- 主页面 -->
     <div class="main-list">
+      <!-- 顶部工具栏 -->
       <div class="main-container">
-        <!-- 顶部工具栏 -->
         <div class="top-tools">
           <div class="top-tool-left" style="min-width: 300px">
             <slot name="top-tool-left"></slot>
+          </div>
+          <div class="top-tool-right">
+<!--           <el-input v-model="keyWord" value="keyWord"></el-input>
+            <el-button @click="onsearch" icon="el-icon-search" type="info" size="mini" style="margin-right: 10px"></el-button>-->
             <div v-if="showLayout.indexOf('search') > -1" class="top-tool-search margin-r-20">
               <div style="display: flex">
-                <el-input v-model="keyWord"  size="small" @keyup.enter="onSearch"></el-input>
-                <!--                <el-button icon="el-icon-search" @click="onSearch" size="small"></el-button>-->
-                <button class="top-tool-btn  top-tool-btn--search" style="border-radius: 0 2px 2px 0 !important;" @click="onSearch">
+                <el-input
+                    v-model="keyWord"  size="small" @keyup.enter="onsearch"></el-input>
+<!--                <el-button icon="el-icon-search" @click="onsearch" size="small"></el-button>-->
+                <button   class="top-tool-btn" style="border-radius: 0px"
+                        type="button" @click="onsearch">
                   <i class="el-icon-search"></i>
                 </button>
               </div>
             </div>
-          </div>
-          <div class="top-tool-right">
-<!--           <el-input v-model="keyWord" value="keyWord"></el-input>
-            <el-button @click="onSearch" icon="el-icon-search" type="info" size="mini" style="margin-right: 10px"></el-button>-->
-
             <slot name="top-tool-right"></slot>
-            <div  v-if="showLayout.indexOf('elementSet') > -1" class="btn-customize"  @click="tools.showCustomTableTitle = true">
-              <i class="cn-icon-gear cn-icon icon-gear"></i> <span> {{$t('network.customize')}}</span>
-            </div>
+            <button v-if="showLayout.indexOf('elementSet') > -1"  class="top-tool-btn"
+                    type="button" @click="tools.showCustomTableTitle = true">
+              <i class="cn-icon-gear cn-icon"></i>
+            </button>
           </div>
         </div>
         <div class="cn-table">
@@ -92,7 +94,7 @@ export default {
     updateCustomTableTitle (custom) {
       this.$emit('update:customTableTitle', custom)
     },
-    onSearch () {
+    onsearch () {
       const params = {
         q: this.keyWord
       }

src/components/table/ColumnCustomize.vue

@@ -19,18 +19,18 @@
       </div>
     </div>
     <div class="custom-bottom-btns">
-      <el-button size="mini" v-if="isCancel" :id="tableId+'-element-set-none'" class="cn-btn cn-btn-size-small-new cn-btn-style-light-new is-cancel" @click="batchHandler(false)">
+      <el-button size="mini" v-if="isCancel" :id="tableId+'-element-set-none'" class="cn-btn cn-btn-size-small-new cn-btn-style-light-new is-cancel" type="button" @click="batchHandler(false)">
         <span class="top-tool-btn-txt">{{$t('overall.clear')}}</span>
       </el-button>
-      <el-button size="mini" v-if="!isCancel" :id="tableId+'-element-set-all'" class="cn-btn cn-btn-size-small-new cn-btn-style-light-new" @click="batchHandler(true)">
+      <el-button size="mini" v-if="!isCancel" :id="tableId+'-element-set-all'" class="cn-btn cn-btn-size-small-new cn-btn-style-light-new" type="button" @click="batchHandler(true)">
         <span class="top-tool-btn-txt">{{$t('overall.all')}}</span>
       </el-button>
-      <div class="custom-bottom-btns-right">
-        <el-button size="mini" :id="tableId+'-element-set-esc'" class="cn-btn cn-btn-size-small-new cn-btn-style-light-new" @click="esc">
+      <div>
+        <el-button size="mini" :id="tableId+'-element-set-esc'" class="cn-btn cn-btn-size-small-new cn-btn-style-light-new" type="button" @click="esc">
           <span class="top-tool-btn-txt">{{$t('overall.cancel')}}</span>
         </el-button>
-        <el-button size="mini" :id="tableId+'-element-set-save'" class="cn-btn cn-btn-size-small-new cn-btn-style-normal-new" @click="save" style="background-color: #0091ff;color:#DCDFE6">
-          <span class="top-tool-btn-txt top-tool-btn-save">{{$t('overall.save')}}</span>
+        <el-button size="mini" :id="tableId+'-element-set-save'" class="cn-btn cn-btn-size-small-new cn-btn-style-normal-new" type="button" @click="save" style="background-color: #0091ff;color:#DCDFE6">
+          <span class="top-tool-btn-txt">{{$t('overall.save')}}</span>
         </el-button>
       </div>
     </div>
@@ -86,7 +86,6 @@ export default {
     // 单选
     handler (val, index) {
       if (!this.allowedAll && !val.allowed && (index === 0 || index === 1 || val.NotSet)) {
-        //
       } else {
         this.custom[index].show = !this.custom[index].show
       }

src/components/table/report/builtinReportTable.vue

@@ -0,0 +1,172 @@
+<template>
+  <el-table
+      id="userTable"
+      ref="dataTable"
+      :data="tableData"
+      :height="height"
+      border
+      @header-dragend="dragend"
+      @sort-change="tableDataSort"
+      @selection-change="selectionChange"
+  >
+    <el-table-column
+        :resizable="false"
+        align="center"
+        type="selection"
+        width="55">
+    </el-table-column>
+    <el-table-column
+        v-for="(item, index) in customTableTitles"
+        :key="`col-${index}`"
+        :fixed="item.fixed"
+        :label="item.label"
+        :min-width="`${item.minWidth}`"
+        :prop="item.prop"
+        :resizable="true"
+        :sort-orders="['ascending', 'descending']"
+        :sortable="item.sortable"
+        :width="`${item.width}`"
+    >
+      <template #header>
+        <span class="data-column__span">{{item.label}}</span>
+        <div class="col-resize-area"></div>
+      </template>
+      <template #default="scope" :column="item">
+        <span v-if="item.prop === 'dataRange'">
+          <template v-if="scope.row.startTime && scope.row.endTime">
+            {{dateFormatByAppearance(scope.row.startTime)}}<span style="padding: 0 5px">-</span>{{dateFormatByAppearance(scope.row.endTime)}}
+          </template>
+        </span>
+        <span v-else-if="item.prop === 'type'">
+            {{$_.get(scope.row.reportTemp, 'name')}}
+        </span>
+        <span v-else-if="item.prop === 'state'">
+            {{getJobStatus(scope.row)}}
+        </span>
+        <span v-else>{{scope.row[item.prop]}}</span>
+      </template>
+
+    </el-table-column>
+    <el-table-column
+        :resizable="false"
+        :width="operationWidth"
+        fixed="right">
+      <template #header>
+        <div class="table-operation-title">{{$t('overall.option')}}</div>
+      </template>
+      <template #default="scope">
+        <div class="table-operation-items" v-if="scope.row.state === 1">
+          <div class="table-operation-item--no-border" @click="tableOperation(['download', scope.row, 1])">
+            <loading :loading="loadingTableId === scope.row.id"></loading>
+            <svg class="icon" aria-hidden="true" :class="{'table-operation-all-loading': loadingTableId}">
+              <use xlink:href="#cn-icon-download2"></use>
+            </svg>
+          </div>
+          <div class="table-operation-item--no-border" @click="tableOperation(['preview', scope.row])">
+            <loading :loading="loadingPreviewId === scope.row.id"></loading>
+            <svg class="icon" aria-hidden="true" :class="{'table-operation-all-loading': loadingPreviewId}">
+              <use xlink:href="#cn-icon-preview"></use>
+            </svg>
+          </div>
+<!--          <div class="table-operation-item&#45;&#45;no-border" @click="tableOperation(['rerun', scope.row])">
+            <loading :loading="loadingPreviewId === scope.row.id"></loading>
+            <svg class="icon2" aria-hidden="true" :class="{'table-operation-all-loading': loadingPreviewId}">
+              <use xlink:href="#cn-icon-refresh"></use>
+            </svg>
+          </div>-->
+        </div>
+      </template>
+    </el-table-column>
+  </el-table>
+  <div class="table-operation-all">
+    <el-checkbox v-model="checkboxAll" @change="selectAll(tableData)"></el-checkbox>
+    <div class="table-operation-all-span">
+      <span>{{ $t('overall.all') }}</span>
+      <div class="table-operation-back-down" :class="{'table-operation-all-checkbox': batchDow, 'table-operation-all-loading': loading}" @click="tableOperation(['download', this.checkboxIds, 2])">
+        <loading :loading="loading"></loading>
+        <span>{{$t('report.batchDow')}}</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import table from '@/mixins/table'
+import Loading from '@/components/common/Loading'
+export default {
+  name: 'builtinReportTable',
+  mixins: [table],
+  components: {
+    Loading
+  },
+  data () {
+    return {
+      tableTitle: [ // 原始table列
+        {
+          label: this.$t('config.user.name'),
+          prop: 'name',
+          show: true,
+          sortable: 'custom'
+        }, /* {
+          label: this.$t('config.chart.remark'),
+          prop: 'remark',
+          show: true
+        }, */{
+          label: this.$t('overall.type'),
+          prop: 'type',
+          show: true,
+          sortable: 'custom'
+        }, {
+          label: this.$t('report.dataRange'),
+          prop: 'dataRange',
+          show: true,
+          minWidth: 110
+        }, {
+          label: this.$t('overall.completionTime'),
+          prop: 'finishTime',
+          show: true
+        }, {
+          label: this.$t('overall.status'),
+          prop: 'state',
+          show: true,
+          width: 130,
+          sortable: 'custom'
+        }
+      ],
+      checkboxAll: false,
+      checkboxIds: '',
+      batchDow: false,
+      builtinId: '',
+      indeterminate: false,
+      loading: false,
+      loadingTableId: '',
+      loadingPreviewId: ''
+
+    }
+  },
+  methods: {
+    getJobStatus (report) {
+      if (report.state === 1 && report.upload === 1) {
+        return this.$t('overall.completed')
+      } else {
+        return this.$t('overall.inProgress')
+      }
+    },
+    selectionChange (objs) {
+      this.$emit('selectionChange', objs)
+      this.checkboxIds = objs.map(item => { return item.id }).join(',')
+      this.checkboxAll = objs.length > 0 || objs.length === this.tableData.length
+      this.batchDow = objs.length > 0
+    },
+    selectAll (objs) {
+      if (objs) {
+        objs.forEach(item => {
+          this.$refs.dataTable.toggleAllSelection(item)
+        })
+      } else {
+        this.$refs.dataTable.clearSelection()
+      }
+    }
+  }
+}
+</script>

src/components/table/report/reportTestTable.vue

@@ -6,7 +6,7 @@
         :data="tableData"
         :height="height"
         :expand-row-keys="expandedIds"
-        :empty-text="$t('npm.noData')"
+        empty-text=""
         border
         tooltip-effect="light"
         :row-key="(row) => { return row.id }"
@@ -188,8 +188,24 @@
           <span v-else>{{ scope.row[item.prop] || '-' }}</span>
         </template>
       </el-table-column>
+      <el-table-column
+          :resizable="false"
+          :width="operationWidth"
+          fixed="right">
+        <template #header>
+          <div class="table-operation-title">{{ $t('overall.option') }}</div>
+        </template>
+        <template #default="scope">
+          <div class="table-operation-items">
+            <button class="table-operation-item" @click="tableOperation(['edit', scope.row])"><i
+                class="cn-icon cn-icon-bianji"></i></button>
+            <button class="table-operation-item" @click="tableOperation(['delete', scope.row])"><i
+                class="cn-icon cn-icon-shanchu"></i></button>
+          </div>
+        </template>
+      </el-table-column>
     </el-table>
-<!--    <div class="table-operation-all">
+    <div class="table-operation-all">
       <el-checkbox v-model="checkboxAll" :indeterminate="isIndeterminate" @change="selectAll(tableData)"></el-checkbox>
       <div class="table-operation-all-span">
         <span>{{ $t('overall.all') }}</span>
@@ -200,7 +216,7 @@
           <span>{{ $t('report.batchDeletion') }}</span>
         </div>
       </div>
-    </div>-->
+    </div>
   </div>
 </template>
 
@@ -292,7 +308,6 @@ export default {
       loadingTableId: '',
       loadingPreviewId: '',
       downDataList: [],
-      disableEdit:false,//编辑按钮是否不可用，当选择多条记录的时候你，编辑按钮不可用
       // pageObj: {
       //   pageNo: 1,
       //   pageSize: 20,
@@ -541,12 +556,6 @@ export default {
         })
         // this.selectIds = selectIds
       }
-      this.batchDeleteObjs = objs
-      if(objs.length > 1) {
-        this.disableEdit = true
-      }else {
-        this.disableEdit = false
-      }
     },
     /**
      * 全选按钮
@@ -565,13 +574,6 @@ export default {
         this.$refs.dataTable.clearSelection()
       }
 
-      this.batchDeleteObjs = objs
-      if(objs.length > 1) {
-        this.disableEdit = true
-      }else {
-        this.disableEdit = false
-      }
-
       // this.selectIds = selectIds
     },
     /**

src/components/table/setting/KnowledgeBaseTable.vue

@@ -1,135 +0,0 @@
-<template>
-  <el-table
-      id="knowledgeBaseTable"
-      ref="dataTable"
-      :data="tableData"
-      :height="height"
-      border
-      @header-dragend="dragend"
-      @sort-change="tableDataSort"
-      @selection-change="selectionChange"
-  >
-    <el-table-column
-        :resizable="false"
-        align="center"
-        type="selection"
-        width="55">
-    </el-table-column>
-    <el-table-column
-        v-for="(item, index) in customTableTitles"
-        :key="`col-${index}`"
-        :fixed="item.fixed"
-        :label="item.label"
-        :min-width="`${item.minWidth}`"
-        :prop="item.prop"
-        :resizable="true"
-        :sort-orders="['ascending', 'descending']"
-        :sortable="item.sortable"
-        :width="`${item.width}`"
-        class="data-column"
-    >
-      <template #header>
-        <span class="data-column__span">{{item.label}}</span>
-        <div class="col-resize-area"></div>
-      </template>
-      <template  #default="scope" :column="item">
-        <template v-if="item.prop === 'name'">
-          <template v-if="scope.row.i18n">
-            <span>{{$t(scope.row.i18n)}}</span>
-          </template>
-          <template v-else-if="scope.row.name">
-            <span>{{scope.row.name}}</span>
-          </template>
-          <template v-else>
-            <span>-</span>
-          </template>
-        </template>
-        <template v-else-if="item.prop === 'tagType'">
-          <span class="type-tag">{{tagTypeText(scope.row[item.prop])}}</span>
-        </template>
-        <template v-else-if="item.prop === 'utime' || item.prop === 'ctime'">
-          <template v-if="scope.row[item.prop]">
-            {{dateFormatByAppearance(scope.row[item.prop])}}
-          </template>
-          <template v-else>
-            <span>-</span>
-          </template>
-        </template>
-        <template v-else-if="item.prop === 'cuser' || item.prop === 'uuser'">
-          <template v-if="scope.row[item.prop]">
-            {{scope.row[item.prop].username || '-'}}
-          </template>
-          <template v-else>
-            <span>-</span>
-          </template>
-        </template>
-        <span v-else>{{scope.row[item.prop] || '-'}}</span>
-      </template>
-    </el-table-column>
-  </el-table>
-</template>
-
-<script>
-import table from '@/mixins/table'
-import { knowledgeBaseType } from '@/utils/constants'
-export default {
-  name: 'knowledgeBaseTable',
-  mixins: [table],
-  data () {
-    return {
-      tableTitle: [ // 原table列
-        {
-          label: 'ID',
-          prop: 'id',
-          show: true,
-          width: 100,
-          sortable: 'custom'
-        }, {
-          label: this.$t('config.roles.name'),
-          prop: 'tagName',
-          show: true,
-          sortable: 'custom'
-        }, {
-          label: this.$t('overall.type'),
-          prop: 'tagType',
-          show: true
-        }, {
-          label: this.$t('overall.remark'),
-          prop: 'remark',
-          show: true
-        },
-        {
-          label: this.$t('overall.createdBy'),
-          prop: 'cuser',
-          show: true
-        },
-        {
-          label: this.$t('config.user.createTime'),
-          prop: 'ctime',
-          show: false,
-          sortable: 'custom'
-        },
-        {
-          label: this.$t('overall.updatedBy'),
-          prop: 'uuser',
-          show: false
-        },
-        {
-          label: this.$t('overall.updateTime'),
-          prop: 'utime',
-          show: false,
-          sortable: 'custom'
-        }
-      ]
-    }
-  },
-  computed: {
-    tagTypeText () {
-      return function (type) {
-        const t = knowledgeBaseType.find(t => t.value === type)
-        return t ? t.name : ''
-      }
-    }
-  }
-}
-</script>

src/components/table/settings/ChartTable.vue

@@ -110,6 +110,7 @@
 <script>
 import table from '@/mixins/table'
 import { panelTypeAndRouteMapping } from '@/utils/constants'
+import { api } from '@/utils/api'
 
 export default {
   name: 'chartTable',

src/components/table/settings/OperationLogTable.vue

@@ -92,7 +92,7 @@ export default {
           show: true
         },
         {
-          label: this.$t('overall.type'),
+          label: this.$t('config.operationlog.type'),
           prop: 'type',
           show: true
         },

src/components/table/settings/RoleTable.vue

@@ -47,6 +47,29 @@
         <span v-else>{{scope.row[item.prop]}}</span>
       </template>
     </el-table-column>
+    <el-table-column
+            :resizable="false"
+            :width="operationWidth"
+            fixed="right">
+      <template #header>
+        <div class="table-operation-title">{{$t('overall.option')}}</div>
+      </template>
+      <template #default="scope">
+        <div class="table-operation-items">
+          <button class="table-operation-item" @click="tableOperation(['edit', scope.row])"><i class="cn-icon cn-icon-edit"></i></button>
+          <el-dropdown size="medium" trigger="hover" @command="tableOperation">
+            <div class="table-operation-item table-operation-item--more">
+              <i class="cn-icon cn-icon-more-arrow-down"></i>
+            </div>
+            <template #dropdown>
+              <el-dropdown-menu >
+                <el-dropdown-item :command="['delete', scope.row]" :disabled="scope.row.id === 1"><i class="cn-icon cn-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+              </el-dropdown-menu>
+            </template>
+          </el-dropdown>
+        </div>
+      </template>
+    </el-table-column>
   </el-table>
 </template>
 

src/components/table/settings/UserTable.vue

@@ -62,6 +62,29 @@
         <span v-else>{{scope.row[item.prop]}}</span>
       </template>
     </el-table-column>
+    <el-table-column
+      :resizable="false"
+      :width="operationWidth"
+      fixed="right">
+      <template #header>
+        <div class="table-operation-title">{{$t('overall.option')}}</div>
+      </template>
+      <template #default="scope">
+        <div class="table-operation-items">
+          <button class="table-operation-item" @click="tableOperation(['edit', scope.row])"><i class="cn-icon cn-icon-edit"></i></button>
+          <el-dropdown size="medium" trigger="hover" @command="tableOperation">
+            <div class="table-operation-item table-operation-item--more">
+              <i class="cn-icon cn-icon-more-arrow-down"></i>
+            </div>
+            <template #dropdown>
+              <el-dropdown-menu >
+                <el-dropdown-item :command="['delete', scope.row]" :disabled="scope.row.id === 1"><i class="cn-icon cn-icon-delete"></i><span class="operation-dropdown-text">{{$t('overall.delete')}}</span></el-dropdown-item>
+              </el-dropdown-menu>
+            </template>
+          </el-dropdown>
+        </div>
+      </template>
+    </el-table-column>
   </el-table>
 </template>
 

src/i18n/index.js

@@ -1,4 +1,4 @@
-import { createI18n } from 'vue-i18n/index'
+import { createI18n } from 'vue-i18n'
 import { storageKey } from '@/utils/constants'
 import { getI18n } from '@/utils/api'
 import store from '@/store'

src/indexedDB/index.js

@@ -1,19 +1,8 @@
 import { dbName, dbGeoDataTableName, dbDrilldownTableConfig } from '@/utils/constants'
 import Dexie from 'dexie'
-/* https://dexie.org/ */
 
-const db = new Dexie(dbName)
-db.version(3).stores({
+export const db = new Dexie(dbName)
+db.version(2).stores({
   [dbGeoDataTableName]: '++name, geo',
-  [dbDrilldownTableConfig]: '++id, config',
-  test: '++id, name'
+  [dbDrilldownTableConfig]: '++id, config'
 })
-function selectTable (tableName) {
-  return db[tableName]
-}
-
-const indexedDBUtils = {
-  db,
-  selectTable
-}
-export default indexedDBUtils

src/jest.config.js

@@ -0,0 +1,37 @@
+module.exports = {
+  globals: {
+    // work around: https://github.com/kulshekhar/ts-jest/issues/748#issuecomment-423528659
+    'ts-jest': {
+      diagnostics: {
+        ignoreCodes: [151001]
+      }
+    }
+  },
+  testEnvironment: 'jsdom',
+  transform: {
+    '^.+\\.vue$': 'vue-jest',
+    '^.+\\.(t|j)sx?$': [
+      'babel-jest', {
+        presets: [
+          [
+            '@babel/preset-env',
+            {
+              targets: {
+                node: true
+              }
+            }
+          ],
+          '@babel/preset-typescript'
+        ],
+        plugins: [
+          '@vue/babel-plugin-jsx',
+          '@babel/plugin-proposal-class-properties'
+        ]
+      }
+    ]
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
+  // u can change this option to a more specific folder for test single component or util when dev
+  // for example, ['<rootDir>/packages/input']
+  roots: ['<rootDir>']
+}

src/mixins/common.js

@@ -1,5 +1,6 @@
 import { hasButton } from '@/permission'
 import { dateFormatByAppearance } from '@/utils/date-util'
+import { storageKey } from '@/utils/constants'
 export default {
   data () {
     return {
@@ -20,9 +21,7 @@ export default {
         query: false
       },
       timeout: null,
-      debounceFunc: null,
-      // 是否正在单元测试
-      isUnitTesting: false
+      debounceFunc: null
     }
   },
   methods: {

src/mixins/data-list.js

@@ -20,7 +20,7 @@ export default {
       pageObj: { // 分页对象
         pageNo: 1,
         pageSize: defaultPageSize,
-        total: 0
+        total: ''
       },
       /* 工具参数 */
       tools: {
@@ -32,12 +32,9 @@ export default {
       object: {},
       searchLabel: ref({}),
 
-      isFirstQuery: true,
-
       tableData: [],
       scrollbarWrap: null,
       delFlag: false,
-      disableEdit:false,//编辑按钮是否不可用，当选择多条记录的时候你，编辑按钮不可用
       operationWidth: '165' // 操作列宽
     }
   },
@@ -75,11 +72,6 @@ export default {
     },
     selectionChange (objs) {
       this.batchDeleteObjs = objs
-      if(this.batchDeleteObjs.length > 1) {
-        this.disableEdit = true
-      }else {
-        this.disableEdit = false
-      }
     },
     getTableData (params) {
       if (params) {
@@ -101,13 +93,6 @@ export default {
           this.tableData = response.data.list
           this.pageObj.total = response.data.total
           // TODO 回到顶部
-        } else {
-          console.error(response)
-          if (response.message) {
-            this.$message.error(response.message)
-          } else {
-            this.$message.error('Something went wrong...')
-          }
         }
       })
     },
@@ -128,52 +113,12 @@ export default {
         })
       })
     },
-    delBatch () {
-      let ids = []
-      if(this.batchDeleteObjs && this.batchDeleteObjs.length > 0){
-        this.batchDeleteObjs.forEach(item =>{
-          ids.push(item.id)
-        })
-      }
-      if(ids.length === 0){
-        this.$alert(this.$t('tip.pleaseSelect'),{
-          confirmButtonText: this.$t('tip.yes'),
-          type:'warning'
-        })
-      }else {
-        this.$confirm(this.$t('tip.confirmDelete'), {
-          confirmButtonText: this.$t('tip.yes'),
-          cancelButtonText: this.$t('tip.no'),
-          type: 'warning'
-        }).then(() => {
-          this.tools.loading = true
-          axios.delete(this.url + '?ids=' + ids).then(response => {
-            if (response.data.code === 200) {
-              this.delFlag = true
-              this.$message({ duration: 2000, type: 'success', message: this.$t('tip.deleteSuccess') })
-              this.getTableData()
-            } else {
-              this.$message.error(response.data.message)
-            }
-          }).finally(() => {
-            this.tools.loading = false
-          })
-        })
-      }
-    },
     newObject () {
       return JSON.parse(JSON.stringify(this.blankObject))
     },
     pageNo (val) {
       this.pageObj.pageNo = val
-      if (this.isFirstQuery) {
-        this.isFirstQuery = false
-        setTimeout(() => {
-          this.getTableData()
-        }, 300)
-      } else {
-        this.getTableData()
-      }
+      this.getTableData()
     },
     pageSize (val) {
       this.pageObj.pageSize = val
@@ -199,21 +144,6 @@ export default {
         }
       })
     },
-    editSelectRecord(){
-      if(this.batchDeleteObjs.length === 0){
-        this.$alert(this.$t('tip.pleaseSelectForEdit'),{
-          confirmButtonText: this.$t('tip.yes'),
-          type:'warning'
-        })
-      }else {
-        get(`${this.url}/${this.batchDeleteObjs[0].id}`).then(response => {
-          if (response.code === 200) {
-            this.object = response.data
-            this.rightBox.show = true
-          }
-        })
-      }
-    },
     copy (u) {
       this.object = { ...u, name: 'Copy from ' + u.name, id: '' }
       this.rightBox.show = true
@@ -222,15 +152,6 @@ export default {
       if (this.$refs.dataTable.loadingTableId === u.id) { // 列表单个下载
         return
       }
-      if (localStorage.getItem(storageKey.s3Enable) == 1) {
-        if (u.state !== 1 || u.upload !== 1) {
-          return
-        }
-      } else {
-        if (u.state !== 1) {
-          return
-        }
-      }
       let fileName = ''
       let url = ''
       let params = {}
@@ -290,15 +211,6 @@ export default {
       if (this.$refs.dataTable.loadingPreviewId === u.id) { // 列表单个下载
         return
       }
-      if (localStorage.getItem(storageKey.s3Enable) == 1) {
-        if (u.state !== 1 || u.upload !== 1) {
-          return
-        }
-      } else {
-        if (u.state !== 1) {
-          return
-        }
-      }
       const params = {
         id: u.id
       }
@@ -381,6 +293,6 @@ export default {
       const arr = localStorageTableTitle.splice(this.$refs.dataTable.tableTitle.length, localStorageTableTitle.length)
       this.tools.customTableTitle = this.tools.customTableTitle.concat(arr)
     }
-    // this.getTableData()
+    this.getTableData()
   }
 }

src/mixins/table.js

@@ -28,7 +28,7 @@ export default {
       if (n) {
         setTimeout(() => {
           this.$refs.dataTable.doLayout()
-        }, 200)
+        }, 100)
       }
     }
   },
@@ -55,7 +55,21 @@ export default {
       })
     },
     tableDataSort (item) {
-      const orderBy = (item.order === 'descending' ? '-' : '') + (item.prop ? (chartTableOrderOptionsMapping[item.prop] || item.prop) : '')
+      let orderBy = ''
+      if (item.order === 'ascending') {
+        if (item.prop === 'lastTime') {
+          orderBy = chartTableOrderOptionsMapping[item.prop]
+        } else {
+          orderBy = item.prop
+        }
+      }
+      if (item.order === 'descending') {
+        if (item.prop === 'lastTime') {
+          orderBy = '-' + chartTableOrderOptionsMapping[item.prop]
+        } else {
+          orderBy = '-' + item.prop
+        }
+      }
       this.$emit('orderBy', orderBy)
     }
   }

src/mock/npm.js

@@ -4,27 +4,27 @@ const openMock = false
 if (openMock) {
   Mock.mock(new RegExp(BASE_CONFIG.baseUrl + 'visual/panel.*'), 'get', function (requestObj) {
     return {
-      msg: 'success',
-      code: 200,
-      data: {
-        total: 1,
-        pageSize: 10,
-        pages: 1,
-        pageNo: 1,
-        list: [
+      "msg": "success",
+      "code": 200,
+      "data": {
+        "total": 1,
+        "pageSize": 10,
+        "pages": 1,
+        "pageNo": 1,
+        "list": [
           {
-            id: 2,
-            name: 'Network & App',
-            i18n: 'npm.npm',
-            type: 2,
-            params: '',
-            cby: 1,
-            ctime: '2021-06-03 08:27:32',
-            uby: 1,
-            utime: '2021-06-03 08:28:10',
-            remark: '',
-            state: 1,
-            buildIn: 1
+            "id": 2,
+            "name": "Network & App",
+            "i18n": "npm.npm",
+            "type": 2,
+            "params": "",
+            "cby": 1,
+            "ctime": "2021-06-03 08:27:32",
+            "uby": 1,
+            "utime": "2021-06-03 08:28:10",
+            "remark": "",
+            "state": 1,
+            "buildIn": 1
           }
         ]
       }

src/permission.js

@@ -1,5 +1,6 @@
 import router from './router'
 import store from './store'
+import { ElMessage } from 'element-plus'
 import { getPermission } from '@/utils/api'
 import { loadGeoData } from '@/utils/tools'
 import axios from 'axios'
@@ -17,7 +18,6 @@ router.beforeEach(async (to, from, next) => {
   loadGeoData()
   // 加载baseUrl
   if (!axios.defaults.baseURL) {
-    // eslint-disable-next-line no-undef
     axios.defaults.baseURL = BASE_CONFIG.baseUrl
   }
   if (localStorage.getItem(storageKey.token)) {
@@ -36,12 +36,11 @@ router.beforeEach(async (to, from, next) => {
         store.commit('setRoleList', roleList)
       }
       if (to.path) {
-        next()
-        /* if (hasMenu(store.getters.menuList, to.path)) {
+        if (hasMenu(store.getters.menuList, to.path)) {
           next()
         } else {
           ElMessage.error('No access') // TODO 国际化
-        } */
+        }
       }
     }
   } else {
@@ -81,7 +80,7 @@ export function hasMenu (menuList, route) {
 export function hasParam (url, param) {
   let hasParam = false
   let tempArr = url.split('?')
-  // const query = {}
+  const query = {}
   if (tempArr[1]) {
     tempArr = tempArr[1].split('&')
     tempArr.forEach(t => {

src/router/index.js

@@ -19,66 +19,49 @@ const routes = [
         path: '/panel/:typeName',
         component: () => import('@/views/charts2/Panel')
       },
+      {
+        path: '/user',
+        component: () => import('@/views/settings/User')
+      },
+      {
+        path: '/role',
+        component: () => import('@/views/settings/Roles')
+      },
+      {
+        path: '/i18n',
+        component: () => import('@/views/settings/I18n')
+      },
       {
         path: '/report/builtIn',
-        component: () => import('@/views/report/Report')
+        component: () => import('@/views/report/reportTest')
+      },
+      {
+        path: '/operationLog',
+        component: () => import('@/views/settings/OperationLog')
       },
       {
         path: '/entityExplorer',
         component: () => import('@/views/entityExplorer/EntityExplorer')
       },
-      {
-        path: '/detection',
-        redirect: '/detection/securityEvent'
-      },
       {
         path: '/detection/:typeName',
         component: () => import('@/views/detections/Index')
       },
+      {
+        path: '/galaxyProxy',
+        component: () => import('@/views/settings/GalaxyProxy')
+      },
+      {
+        path: '/chart',
+        component: () => import('@/views/settings/Chart')
+      },
+      {
+        path: '/temp',
+        component: () => import('@/views/Temp')
+      },
       {
         path: '/businessLog/viewer',
         component: () => import('@/views/businessLog/Viewer')
-      },
-      {
-        path: '/knowledgeBase',
-        component: () => import('@/views/setting/KnowledgeBase')
-      },
-      {
-        path: '/knowledgeBase/form',
-        component: () => import('@/views/setting/KnowledgeBaseForm')
-      },
-      {
-        name: 'Administration',
-        path: '/administration',
-        redirect: '/administration/user',
-        component: () => import('@/views/administration/Index'),
-        children: [
-          {
-            name: 'User',
-            path: '/administration/user',
-            component: () => import('@/views/administration/User')
-          },
-          {
-            name: 'Role',
-            path: '/administration/role',
-            component: () => import('@/views/administration/Roles')
-          },
-          {
-            name: 'OperationLog',
-            path: '/administration/operationLog',
-            component: () => import('@/views/administration/OperationLog')
-          }
-        ]
-      },
-      {
-        name: 'I18n',
-        path: '/i18n',
-        component: () => import('@/views/administration/I18n')
-      },
-      {
-        name: 'Chart',
-        path: '/chart',
-        component: () => import('@/views/administration/Chart')
       }
     ]
   }

src/store/index.js

@@ -12,8 +12,7 @@ const store = createStore({
     return {
       i18n: false,
       showEntityTypeSelector: false, // 在entity explore页面时，控制header显示实体类型选择框
-      from: '', // entity type
-      test: 'jest' // 用于单测的demo
+      from: '' // entity type
     }
   },
   getters: {
@@ -25,9 +24,6 @@ const store = createStore({
     },
     entityName (state) {
       return state.entityName
-    },
-    getTest (state) {
-      return state.test
     }
   },
   mutations: {
@@ -41,9 +37,6 @@ const store = createStore({
     },
     showEntityTypeSelector (state, show) {
       state.showEntityTypeSelector = show
-    },
-    setTest (state, test) {
-      state.test = test
     }
   }
 })

src/store/modules/panel.js

@@ -58,9 +58,8 @@ const panel = {
     httpCancel: null, // 终止http请求
     rangeEchartsData: {}, // 框选echarts图表
     routerHistoryList: [], // 路由跳转记录列表
-    dnsQtypeMapData: [],
-    dnsRcodeMapData: [],
-    chartTabList: null // chartTabs组件的tab状态点击列表，初始化为null方便原有逻辑计算
+    dnsQtypeMapData:[],
+    dnsRcodeMapData:[]
   },
   mutations: {
     setShowRightBox (state, flag) {
@@ -152,9 +151,6 @@ const panel = {
     },
     setRouterHistoryList (state, list) {
       state.routerHistoryList = list
-    },
-    setChartTabList (state, list) {
-      state.chartTabList = list
     }
   },
   getters: {
@@ -229,9 +225,6 @@ const panel = {
     },
     getRouterHistoryList (state) {
       return state.routerHistoryList
-    },
-    getChartTabList (state) {
-      return state.chartTabList
     }
   },
   actions: {
@@ -260,9 +253,6 @@ const panel = {
     },
     clearPanel (store) {
       store.commit('cleanPanel')
-    },
-    dispatchChartTabList (store, list) {
-      store.commit('setChartTabList', list)
     }
   }
 }

src/store/modules/user.js

@@ -5,7 +5,7 @@ import { ElMessage } from 'element-plus' // dependent on utc plugin
 import { storageKey, dbDrilldownTableConfig } from '@/utils/constants'
 import { getConfigVersion } from '@/utils/tools'
 import { api } from '@/utils/api'
-import indexedDBUtils from '@/indexedDB'
+import { db } from '@/indexedDB'
 
 const user = {
   state () {
@@ -64,9 +64,9 @@ const user = {
           if (tempArr[1]) {
             tempArr = tempArr[1].split('&')
             tempArr.forEach(t => {
-              const firstEqualIndex = t.indexOf('=')
-              const key = t.substring(0, firstEqualIndex)
-              const value = t.substring(firstEqualIndex + 1)
+              let firstEqualIndex = t.indexOf('=')
+              let key = t.substring(0, firstEqualIndex)
+              let value = t.substring(firstEqualIndex + 1)
               query[key] = value
             })
           }
@@ -92,15 +92,15 @@ const user = {
         if (res.code === 200 && res.page.list && res.page.list.length > 0) {
           // 从接口返回整体配置，再读取用户缓存，将对应条目覆盖，作为使用的配置
           const defaultConfigs = JSON.parse(res.page.list[0].cvalue)
-          await indexedDBUtils.selectTable(dbDrilldownTableConfig).put({
+          await db[dbDrilldownTableConfig].put({
             id: 'default',
             version: defaultConfigs.version,
             config: defaultConfigs.config
           })
-          const userId = localStorage.getItem(storageKey.userId)
-          const oldVersion = await getConfigVersion(userId)
-          if (oldVersion !== defaultConfigs.version) {
-            indexedDBUtils.selectTable(dbDrilldownTableConfig).delete(userId)
+          let userId = localStorage.getItem(storageKey.userId)
+          let oldVersion = await getConfigVersion(userId)
+          if(oldVersion !== defaultConfigs.version ){
+            db[dbDrilldownTableConfig].delete(userId)
           }
         }
       })

src/utils/api.js

@@ -33,8 +33,6 @@ export const api = {
   chartList: '/visual/chart/list',
   // galaxyProxy
   galaxyProxy: '/galaxy/setting',
-  // 知识库
-  knowledgeBase: '/knowledge',
 
   // 报告相关
   reportJob: '/report/job',
@@ -320,12 +318,11 @@ export async function getI18n () {
 
 /* 获得原始的3611-2 json字符串数据 */
 export async function getIso36112JsonData (suffix) {
-  const url = `${window.location.protocol}//${window.location.host}/geojson/${suffix}.json`
   const request = new Promise(resolve => {
-    axios({ url }).then(response => {
+    axios({
+      url: `${window.location.protocol}//${window.location.host}:${window.location.port}/geojson/${suffix}.json`
+    }).then(response => {
       resolve(response.data || response || null)
-    }).catch(err => {
-      console.error(err)
     })
   })
   return await request