From 917829ce1b14690e9d72606cace87b04eabb9993 Mon Sep 17 00:00:00 2001 From: BianLzhaoMin <11485688+bianliangzhaomin123@user.noreply.gitee.com> Date: Mon, 26 Aug 2024 20:53:34 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A4=A7=E5=B1=8F=E5=8A=9F=E8=83=BD=E5=AE=8C?= =?UTF-8?q?=E5=96=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- sgzb-screen/config/dev.env.js | 1 + sgzb-screen/config/index.js | 2 +- sgzb-screen/package-lock.json | 2 +- sgzb-screen/package.json | 2 +- sgzb-screen/src/api/index.js | 2 +- sgzb-screen/src/api/screen.js | 20 +- sgzb-screen/src/assets/img/endIcon.png | Bin 0 -> 4595 bytes sgzb-screen/src/assets/img/startIcon.png | Bin 0 -> 4084 bytes .../src/components/Pagination/index.vue | 38 +- .../src/components/home/centerFold.vue | 35 +- .../src/components/home/countryMap1.vue | 231 ++++++-- sgzb-screen/src/components/home/leftThree.vue | 122 +++-- sgzb-screen/src/components/home/leftTwo.vue | 37 +- sgzb-screen/src/components/home/new-map.vue | 143 +++-- sgzb-screen/src/components/home/rightOne.vue | 249 +++++---- .../src/components/home/rightThree.vue | 31 +- sgzb-screen/src/components/home/rightTwo.vue | 53 +- sgzb-screen/src/main.js | 3 +- sgzb-screen/src/router/index.js | 102 ++-- sgzb-screen/src/views/new-login/index.vue | 505 ++++++++++++++++++ .../newHome/components/drawer-device.vue | 381 +++++++++++-- .../newHome/components/drawer-project.vue | 382 +++++++++++-- sgzb-screen/src/views/newHome/index.vue | 12 +- sgzb-ui/src/views/base/section/index.vue | 40 +- .../claimAndreturn/picking/outbound/index.vue | 2 + .../return/receive/component/handlePage.vue | 17 +- .../warehousing/newTools/index.vue | 36 ++ sgzb-ui/vue.config.js | 2 +- 28 files changed, 1966 insertions(+), 484 deletions(-) create mode 100644 sgzb-screen/src/assets/img/endIcon.png create mode 100644 sgzb-screen/src/assets/img/startIcon.png create mode 100644 sgzb-screen/src/views/new-login/index.vue diff --git a/sgzb-screen/config/dev.env.js b/sgzb-screen/config/dev.env.js index 36efffd7..367c917d 100644 --- a/sgzb-screen/config/dev.env.js +++ b/sgzb-screen/config/dev.env.js @@ -13,6 +13,7 @@ var testUrl = '10.40.92.8:8080' // var testUrl = '' module.exports = merge(prodEnv, { NODE_ENV: '"development"', + // API_ROOT: '/screen' //API调用地址 // API_ROOT: '"http://' + testUrl + '"', // BASE_URL: '/cockpit-screen/' diff --git a/sgzb-screen/config/index.js b/sgzb-screen/config/index.js index 0a7477fe..1ad6307c 100644 --- a/sgzb-screen/config/index.js +++ b/sgzb-screen/config/index.js @@ -23,7 +23,7 @@ var proxyUrl = // target: 'http://112.29.103.165:21626',//重庆 // target: 'http://192.168.0.14:21624',//测试 // target: 'http://112.29.103.165:21624/', //宁夏 - target: 'http://192.168.2.145:28080', + target: 'http://192.168.2.152:28080', changeOrigin: true, // secure: true, //如果是https接口,需要配置这个参数 pathRewrite: { diff --git a/sgzb-screen/package-lock.json b/sgzb-screen/package-lock.json index 9dac9645..0d854e57 100644 --- a/sgzb-screen/package-lock.json +++ b/sgzb-screen/package-lock.json @@ -9629,7 +9629,7 @@ }, "moment": { "version": "2.30.1", - "resolved": "https://registry.npmmirror.com/moment/-/moment-2.30.1.tgz", + "resolved": "https://repo.huaweicloud.com/repository/npm/moment/-/moment-2.30.1.tgz", "integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==" }, "move-concurrently": { diff --git a/sgzb-screen/package.json b/sgzb-screen/package.json index f1c26104..9e1c39c1 100644 --- a/sgzb-screen/package.json +++ b/sgzb-screen/package.json @@ -25,7 +25,7 @@ "js-base64": "^3.6.0", "js-md5": "^0.7.3", "less-loader": "^4.1.0", - "moment": "^2.29.1", + "moment": "^2.30.1", "scss": "^0.2.4", "svg-sprite-loader": "^6.0.11", "swiper": "^3.4.2", diff --git a/sgzb-screen/src/api/index.js b/sgzb-screen/src/api/index.js index f02e2bb0..d9c973a1 100644 --- a/sgzb-screen/src/api/index.js +++ b/sgzb-screen/src/api/index.js @@ -5,7 +5,7 @@ import axios from 'axios'; axios.defaults.timeout = 30000 // 默认配置 -axios.defaults.baseURL = process.env.API_ROOT; +axios.defaults.baseURL = ''; axios.interceptors.request.use( config => { diff --git a/sgzb-screen/src/api/screen.js b/sgzb-screen/src/api/screen.js index bc07f74e..61b6df96 100644 --- a/sgzb-screen/src/api/screen.js +++ b/sgzb-screen/src/api/screen.js @@ -15,7 +15,11 @@ export const getMaterialReturnByMonthApi = params => POST(`/screen/base/largeScr //当月维修分析 export const getMaintenanceByMonthApi = params => POST(`/screen/base/largeScreen/home/getMaintenanceByMonth?maType=${params.maType}`,) //设备分布图 -export const getEquipmentDisByMapApi = params => POST(`/screen/base/largeScreen/home/getEquipmentDisByMap`,) +export const getEquipmentDisByMapApi = params => GET(`/screen/base/largeScreen/home/getEquipmentDisByMap`,) +//获取工程的位置信息 +export const getProjectByMapApi = params => GET(`/screen/base/largeScreen/home/getEquipmentDis`, params) +//获取设备的位置信息 +export const getDeviceByMapApi = params => GET(`/screen/base/largeScreen/home/getIotMaCodeMachine`, params) //施工机具/ export const getTotalOwnershipApi = params => POST(`/screen/base/largeScreen/home/getTotalOwnership`,) // 当月使用车辆 @@ -25,3 +29,17 @@ export const getMaintenanceWarningApi = params => POST(`/screen/base/largeScreen //各公司机具保有量 export const getTotalOwnershipByCompany = params => POST(`/screen/base/largeScreen/home/getTotalOwnershipByCompany`) + +/** 获取机具设备的行程信息 */ +export const getIotDeviceTripApi = params => POST(`/screen/material/iotMachine/searchItinerary`, params) +/** 获取机具设备的停留点信息 */ +export const getIotDeviceParkDetailApi = params => POST(`/screen/material/iotMachine/reportParkDetailByTime`, params) +/** 获取工程领料的记录 */ +export const getProjectOutApi = params => GET(`/screen/base/largeScreen/home/getLeaseRecordListByLotId`, params) +/** 获取工程退料的记录 */ +export const getProjectReturnApi = params => GET(`/screen/base/largeScreen/home/getBackRecordListByLotId`, params) +/** 获取工程退料的记录 */ +export const getProjectDeviceNumApi = params => GET(`/screen/base/largeScreen/home/getUseNumByLotId`, params) +/** 获取单位数据 */ +export const getUnitListApi = params => POST(`/screen/system/select/getUnitCbx`, params) + diff --git a/sgzb-screen/src/assets/img/endIcon.png b/sgzb-screen/src/assets/img/endIcon.png new file mode 100644 index 0000000000000000000000000000000000000000..37f29b28ad7b83e73ccec4a1bd6e4a8eb9037995 GIT binary patch literal 4595 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 literal 0 HcmV?d00001 diff --git a/sgzb-screen/src/assets/img/startIcon.png b/sgzb-screen/src/assets/img/startIcon.png new file mode 100644 index 0000000000000000000000000000000000000000..e5dc18adb1e50d60c73bcb1af4a296ff4045b79e GIT binary patch literal 4084 zcmc&%`9IX(_n+oH>SfE!82ejh#*%$0`#Qs5hOF5OS+ehyUEW>|GqwyOTgnz?32Cv0 z5QT)Y4p~we5wa&AegBE?59gfwxc8p(e4cY2=RO`c(cILKorRwT0)eoThy=@H+xu65 zlgGN+uBPzVoVaFbs0*nX{P#Nq!cjva;H|=)emMTPG2Mh<66Gn1P0t#me1TS7vy7`Y z^0Rg=0}I@Et~90*0uKX|Y1wM%yUo*Fxac7Hc1YM!mmHMzbMW$MS$W>;EIMcitO~f^ zeiDG3(14?M`wU-t){j@p`MOQy0P!*${GzqYvlg(qH-Un9YM`1^6 zDuTI)ve~2NDe;eoHjXbWOz% zUb7NVKfHKK_g7!v=c$W={)JXy>w&axo^xKbE#kncIaMx=(?ghp-G@ZSYcEp%oickQvodw=VL{5K}SBm&wujR)|uNQw*?~m z648)E3C6)oo>z!DguiSbT0|7juyFzPZ>|a{`0yF*Ar~4P%iH{Qv~;>0FMqWj;B+72 zy-VNeVsK@&c$TPd0mUg|zIkXWe{xFfc2}9 z#rF3caSutuD7<{>h8wxj`lzAx;9wz7gV^$%8N^XD84;cb<3GR|=`* zwKwhRMZJpWprGUzk)@>)bS9U`tp$T8-=>z=jMg*9Zzc)(B#IE@p4#-x5njKp1V60DsNc!N`ke!Qm^RFHwkjSj*`y4~C!d1|NrL+?oaaEDHzHlXAJ zWsPpJtx0`-aOMPTPQWQ5BEJ#wMZGsEAV*H-Hu}QF2^7u<4cMx8@oVB~=D(c6)UCZ4G|1X87Be6nepNiA}>{5t7j?b=Kn5&tGH_lH;t*7ecap`=`xtdc`M7%i`jNwd z?_sh!y5B18v#s?9O?|~@cBx*7x`3woiuF0PM8cO3X5YO-_umbn{RWUW`@IjZvQ(sS zfK&|C(zBZ%96XR8R8{jx@{ss>_-FQY|0e}?JEDN9V*Ox(0{88wjVAys6chG^T;#OQ zv8a@d^RNuK!SAt_F|2-EG_Q)VKobj!@HEwF77P`W8-SX*`@(2TJ>DHTiYBHM)n%Ny zH5qP#Xw<#!H!|Ue1dvykH;mJ>rG_bTTk)o0@3$|#jaQ%g0e}R1W>_NV-y|MZGjtAb zYEyI(l_{ObQR~~O0r!7msc?C!=C-E z!KkoxHS3P1tA^6C>E=7Hg20wNOA0Oa>XbfM5Xh9RPkUN4pj!54KP$qzbyva(?w+e_ z^ACSRx;SW;$@3-=@zBL~584_HF5c^_UpcR0phSY%{|5=Bv%oFrD-^SD`n$4mzGi+RV`7No=^aHEYX~^z$80TTp@` zZ_*8##NnZ8rF(vNQelf7cTdXqHS8}68|cpO(byK`IY_|6Uq{AA2-J!uO=v@f*VVVY z)QeqiT71^d{Fyd5$HKR-2g7f$J)OQtJFvyvH=YLPg@$JLOM8{{Rs}iQU*KnWzfg#9&%J1w}BBb5R6Mu?Xj?15=qW3=u2*n9{?G!~k7*C7n z+EbE7q!*VIEB1cKk^a7RTX*!2^K~qE;rZ}Wi%7~s;5{$ikm!jb_w<=>Wek=bJ->qC}5PaT9S4P$=OBTxcS3fQsBC)g9+%D+Z3q5DCBbw zDS7aQ%I6xakBCZtmcM7g=JZIE4aR&f^ixl~RSjD=4uvf;$qrsv z6+a*OZRVXY@vVgO)JoR9J2yr6b}oNYh{fv_4h4Qs+SVE$1 ze%7u$cA{{*bB8W;BXpi?!jKsB3vNuaNQT!WOOJZ8gbx}#T8#^_cpr``km6pE>ScIn zpZ9+_g{Z00pggD<>pKh!=3iW7{T=FT04p3s{iJ1vX38wmC>SB&;7o47VrGt5wB7~ z$gw5;C2deEbmhaTrEf~93*Q^!53XY9l?FLu#votjjJRe@ z9I`UZIY*7*z_z(F)oabU9Xr3If7wz7-y@z85*2{hem9@ZY}}P4%6;5WpYG543DyZ zpJ70b$b`jRaUMwXAV)OA6z-chPhQJ=iN7jP6zy-brCY=dD^9g;+qD_4k#U*vgXKE? zE46}esSXjoBL^MOr{R-vwFmo#)?7xvo%hGCuZHyWvo$LQYvl2hH*0FR>Q$*0cNW71>FYI_N zbfb`Ceru^PRg!B3zErqv2wR6dRz3z@b@>&;3Ge!+vI(X^Zlv^anBd@M4a@Mqx0X)g zb>kjmlW;kdJVC4$OkoZb?9}WUA41Q0rCJcYL{WZZ7M1YoH#kGgTts@mk@#Pym=QLt z7F5jz6ci}J`e`~sLBfA$jcWCB4DEKqnE@p8efTl%8E*-CwjT&D5Strf=t5>!3Z-riXCa#&MaV4DzGO>LWsCeu8)k0Hpj$^AEhQ1RX zuR};yb76)v=kr6|xX2Nf3mCAJqVnjNoLL}lg=Cf%T&yVrZ2o#EPzXsMgeX2cKJk?2 zPq2$dj~ruP(|(5mYh6r)$1(jAYzaUos}cznC;wH6UlEX-kz&#yt37E%4>ztmSu-;U z6ulf^0vBEgqdl zk+Q#Ak6RfbyZLWnvQ=h^m>udke?FOO(TYIE1Y7oBdi|lfXE;E2WwOO_TRfk$V2KJR zhXmCeT@2f-Nj-R&L_7akfl72gYb}5!S{U#aQ)L|=hYCHvUnrEsxcpjB7v?>_8-7Ct zilzz(H+b=$fS0-~EPSK`|Dgj?hKgNaI9ft#nr)ac1bnHWo1B1v;Q5uco#?3$V7>>C i;WvQ%zXfPNI#E+9flt7k -
+
@@ -24,47 +25,46 @@ export default { props: { total: { required: true, - type: Number + type: Number, }, page: { type: Number, - default: 1 + default: 1, }, limit: { type: Number, - default: 20 + default: 20, }, pageSizes: { type: Array, default() { return [10, 20, 30, 50] - } + }, }, // 移动端页码按钮的数量端默认值5 pagerCount: { type: Number, - default: document.body.clientWidth < 992 ? 5 : 7 + default: document.body.clientWidth < 992 ? 5 : 7, }, layout: { type: String, - default: 'total, sizes, prev, pager, next, jumper' + default: 'total, sizes, prev, pager, next, jumper', }, background: { type: Boolean, - default: true + default: true, }, autoScroll: { type: Boolean, - default: true + default: true, }, hidden: { type: Boolean, - default: false - } + default: false, + }, }, data() { - return { - }; + return {} }, computed: { currentPage: { @@ -73,7 +73,7 @@ export default { }, set(val) { this.$emit('update:page', val) - } + }, }, pageSize: { get() { @@ -81,8 +81,8 @@ export default { }, set(val) { this.$emit('update:limit', val) - } - } + }, + }, }, methods: { handleSizeChange(val) { @@ -99,8 +99,8 @@ export default { if (this.autoScroll) { scrollTo(0, 800) } - } - } + }, + }, } diff --git a/sgzb-screen/src/components/home/centerFold.vue b/sgzb-screen/src/components/home/centerFold.vue index efef171a..bf18b806 100644 --- a/sgzb-screen/src/components/home/centerFold.vue +++ b/sgzb-screen/src/components/home/centerFold.vue @@ -17,7 +17,12 @@
-
+
{{ item.value }}
@@ -34,13 +39,13 @@ diff --git a/sgzb-screen/src/components/home/countryMap1.vue b/sgzb-screen/src/components/home/countryMap1.vue index 0d03ec0b..439f23fe 100644 --- a/sgzb-screen/src/components/home/countryMap1.vue +++ b/sgzb-screen/src/components/home/countryMap1.vue @@ -46,6 +46,7 @@ export default { isCity: 0, cityCount: [], gozoom: 1, + mapList: [], // 查询后的地图数据 } }, created() { @@ -54,13 +55,22 @@ export default { // this.getCityCount() }, mounted() { - this.getEquipmentDisByMapApiPage() - this.getInitData() + getEquipmentDisByMapApi().then((res) => { + console.log('res=====地图数据---', res) + + this.mapList = res.data + this.getInitData() + }) + // this.getEquipmentDisByMapApiPage().then((res) => { + // this.getInitData() + // }) }, methods: { - getEquipmentDisByMapApiPage() { + async getEquipmentDisByMapApiPage() { getEquipmentDisByMapApi().then((res) => { console.log('res=====地图数据---', res) + + this.mapList = res.data }) }, getCompanyList() { @@ -174,28 +184,46 @@ export default { } }) - let mapData = [ - { - name: '青海省', - value: ['101.778', '36.623'], - a: '100', - }, - { - name: '宁夏回族自治区', - value: ['106.278', '38.466'], - a: '100', - }, - { - name: '安徽省', - value: ['117.283', '31.861'], - a: '100', - }, - { - name: '湖南省', - value: ['112.982', '28.194'], - a: '100', - }, - ] + // let mapData = [ + // { + // name: '青海省', + // // value: ['101.778', '36.623'], + // a: 10, + // value: [], + // }, + // { + // name: '宁夏回族自治区', + // // value: ['106.278', '38.466'], + // a: 0, + // value: [], + // }, + // // { + // // name: '安徽省', + // // value: ['117.283', '31.861'], + // // a: 0, + // // }, + // // { + // // name: '湖南省', + // // value: ['112.982', '28.194'], + // // a: 0, + // // }, + // ] + console.log(this.mapList, 'this.mapList') + let mapData = this.mapList.map((e) => { + return { + name: e.province, + a: e.num, + value: [], + } + }) + + for (let i = 0; i < mapData.length; i++) { + let geoCoord = geoCoordMap[mapData[i].name] + if (geoCoord) { + mapData[i].value = geoCoord.concat(mapData[i].value) + } + } + let that = this this.pointAll = this.cityCount this.pointAll.push({ @@ -208,140 +236,229 @@ export default { }, }) let splitList = [ - { name: '北京市', itemStyle: { normal: { areaColor: '#0A2B7B' } } }, + { + name: '北京市', + count: 0, + value: [], + itemStyle: { normal: { areaColor: '#0A2B7B' } }, + }, { name: '天津市', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '上海市', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '重庆市', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '河北省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '河南省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '云南省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '辽宁省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '黑龙江省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '湖南省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '安徽省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '山东省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '新疆维吾尔自治区', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '江苏省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '浙江省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '江西省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '湖北省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '广西壮族自治区', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '甘肃省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '山西省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '内蒙古自治区', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '陕西省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '吉林省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '福建省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '贵州省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '广东省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '青海省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '西藏自治区', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '四川省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '宁夏回族自治区', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#2187FF' } }, }, { name: '海南省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '台湾省', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '香港特别行政区', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, { name: '澳门特别行政区', + count: 0, + value: [], itemStyle: { normal: { areaColor: '#0A2B7B' } }, }, ] + + for (let i = 0; i < splitList.length; i++) { + let geoCoord = geoCoordMap[splitList[i].name] + if (geoCoord) { + splitList[i].value = geoCoord.concat(splitList[i].value) + } + } + + mapData.forEach((e) => { + splitList.forEach((v) => { + if (e.name == v.name) { + v.count = e.a + } + }) + }) + + // console.log(splitList, '数量问题---', mapData) + let imgUrl = require('../../assets/img/myImage/tankuang.png') let echartOption = { geo: [ @@ -492,26 +609,27 @@ export default { zlevel: 1, symbolSize: [45, 55], symbol: (value, params) => { - if (params.name == '安徽省') { - return ( - 'image://' + require('@/assets/img/myImage/markPoints.png') - ) - } - if (params.name == '湖南省') { - return ( - 'image://' + require('@/assets/img/myImage/markPoints.png') - ) - } - if (params.name == '宁夏回族自治区') { - return ( - 'image://' + require('@/assets/img/myImage/markPoints.png') - ) - } - if (params.name == '青海省') { - return ( - 'image://' + require('@/assets/img/myImage/markPoints.png') - ) - } + return 'image://' + require('@/assets/img/myImage/markPoints.png') + // if (params.name == '安徽省') { + // return ( + // 'image://' + require('@/assets/img/myImage/markPoints.png') + // ) + // } + // if (params.name == '湖南省') { + // return ( + // 'image://' + require('@/assets/img/myImage/markPoints.png') + // ) + // } + // if (params.name == '宁夏回族自治区') { + // return ( + // 'image://' + require('@/assets/img/myImage/markPoints.png') + // ) + // } + // if (params.name == '青海省') { + // return ( + // 'image://' + require('@/assets/img/myImage/markPoints.png') + // ) + // } }, emphasis: { scale: false, @@ -525,9 +643,10 @@ export default { fontFamily: 'cursive', fontWeight: 'bold', position: 'top', - padding: [0, 0, -15, 0], + padding: [0, 0, 0, 0], formatter: function (params) { - return params.data.count + // 设置工程数量 + return params.data.a }, }, }, @@ -564,8 +683,20 @@ export default { }) const _this = this this.mapEcharts.on('click', function (params) { - console.log('点击事件---参数params', params) - _this.$router.push({ path: '/home-new' }) + if (params.data && params.data.a > 0) { + _this.$router.push({ + path: '/home-new', + query: { province: params.data.name, location: params.data.value }, + }) + } else if (params.region.count > 0) { + _this.$router.push({ + path: '/home-new', + query: { province: params.name, location: params.region.value }, + }) + } else { + _this.$message.error('当前省份没有工程数据!') + } + if (params.seriesType === 'scatter' && !params.name) { let option = that.mapEcharts.getOption() //获得option对象 // 点击变黄 diff --git a/sgzb-screen/src/components/home/leftThree.vue b/sgzb-screen/src/components/home/leftThree.vue index 56e69bcd..b091fde2 100644 --- a/sgzb-screen/src/components/home/leftThree.vue +++ b/sgzb-screen/src/components/home/leftThree.vue @@ -12,64 +12,64 @@ diff --git a/sgzb-screen/src/components/home/leftTwo.vue b/sgzb-screen/src/components/home/leftTwo.vue index 31d3ce48..7e05bbfe 100644 --- a/sgzb-screen/src/components/home/leftTwo.vue +++ b/sgzb-screen/src/components/home/leftTwo.vue @@ -5,10 +5,18 @@
退料数据
- +
- +
@@ -16,11 +24,11 @@ diff --git a/sgzb-screen/src/components/home/new-map.vue b/sgzb-screen/src/components/home/new-map.vue index e4cb4c20..12eeeb4b 100644 --- a/sgzb-screen/src/components/home/new-map.vue +++ b/sgzb-screen/src/components/home/new-map.vue @@ -3,14 +3,21 @@ @@ -136,4 +185,24 @@ export default { width: 0; height: 0; } + +.ll { + height: 35px; + line-height: 35px; + letter-spacing: 1px; + border: 1px dashed; +} + + + diff --git a/sgzb-screen/src/components/home/rightOne.vue b/sgzb-screen/src/components/home/rightOne.vue index 7d02b1b8..d92e5ae3 100644 --- a/sgzb-screen/src/components/home/rightOne.vue +++ b/sgzb-screen/src/components/home/rightOne.vue @@ -5,12 +5,19 @@
当月领料分析
-
+
- +
@@ -23,175 +30,209 @@ // HighchartsMore(Highcharts); // HighchartsDrilldown(Highcharts); // Highcharts3D(Highcharts); -import * as echarts from 'echarts'; +import * as echarts from 'echarts' import 'echarts-gl' // 3d图表库 -import { getPickingAnalysisByMonthApi } from "../../api/screen"; -import materialAnalysisDialog from "./materialAnalysisDialog"; +import { getPickingAnalysisByMonthApi } from '../../api/screen' +import materialAnalysisDialog from './materialAnalysisDialog' export default { components: { - materialAnalysisDialog + materialAnalysisDialog, }, data() { return { data: [], - maType: '' - }; + maType: '', + } }, mounted() { this.$eventBus.$on('maType', (maType) => { this.maType = maType this.getPickingAnalysisByMonthApiPage() - }); + }) setInterval(() => { this.getPickingAnalysisByMonthApiPage() - }, 60 * 1000); - + }, 60 * 1000) }, destroyed() { - this.$eventBus.$off('maType'); + this.$eventBus.$off('maType') }, methods: { getPickingAnalysisByMonthApiPage() { this.data = [] let params = { - maType: this.maType + maType: this.maType, } - getPickingAnalysisByMonthApi(params).then(res => { + getPickingAnalysisByMonthApi(params).then((res) => { if (res.code == 200) { - this.data.push({ - name: '数量领料', - value: res.data.num, - rate: res.data.rate, - itemStyle: { - color: '#01F4F5', - }, - }, + this.data.push( { - name: '编码领料', value: res.data.num2, + name: '数量领料', + value: res.data.num, + rate: res.data.rate, + itemStyle: { + color: '#01F4F5', + }, + }, + { + name: '编码领料', + value: res.data.num2, rate: res.data.rate2, itemStyle: { color: '#077E98', }, - }) - this.mastery(this.data); + } + ) + this.mastery(this.data) } }) }, // 生成扇形的曲面参数方程,用于 series-surface.parametricEquation - getParametricEquation(startRatio, endRatio, isSelected, isHovered, k, height) { - + getParametricEquation( + startRatio, + endRatio, + isSelected, + isHovered, + k, + height + ) { // 计算 - let midRatio = (startRatio + endRatio) / 2; + let midRatio = (startRatio + endRatio) / 2 - let startRadian = startRatio * Math.PI * 2; - let endRadian = endRatio * Math.PI * 2; - let midRadian = midRatio * Math.PI * 2; + let startRadian = startRatio * Math.PI * 2 + let endRadian = endRatio * Math.PI * 2 + let midRadian = midRatio * Math.PI * 2 // 如果只有一个扇形,则不实现选中效果。 if (startRatio === 0 && endRatio === 1) { - isSelected = false; + isSelected = false } // 通过扇形内径/外径的值,换算出辅助参数 k(默认值 1/3) - k = typeof k !== 'undefined' ? k : 1 / 3; + k = typeof k !== 'undefined' ? k : 1 / 3 // 计算选中效果分别在 x 轴、y 轴方向上的位移(未选中,则位移均为 0) - let offsetX = isSelected ? Math.cos(midRadian) * 0.1 : 0; - let offsetY = isSelected ? Math.sin(midRadian) * 0.1 : 0; + let offsetX = isSelected ? Math.cos(midRadian) * 0.1 : 0 + let offsetY = isSelected ? Math.sin(midRadian) * 0.1 : 0 // 计算高亮效果的放大比例(未高亮,则比例为 1) - let hoverRate = isHovered ? 1.05 : 1; + let hoverRate = isHovered ? 1.05 : 1 // 返回曲面参数方程 return { - u: { min: -Math.PI, max: Math.PI * 3, - step: Math.PI / 32 + step: Math.PI / 32, }, v: { min: 0, max: Math.PI * 2, - step: Math.PI / 20 + step: Math.PI / 20, }, x: function (u, v) { if (u < startRadian) { - return offsetX + Math.cos(startRadian) * (1 + Math.cos(v) * k) * hoverRate; + return ( + offsetX + + Math.cos(startRadian) * (1 + Math.cos(v) * k) * hoverRate + ) } if (u > endRadian) { - return offsetX + Math.cos(endRadian) * (1 + Math.cos(v) * k) * hoverRate; + return ( + offsetX + Math.cos(endRadian) * (1 + Math.cos(v) * k) * hoverRate + ) } - return offsetX + Math.cos(u) * (1 + Math.cos(v) * k) * hoverRate; + return offsetX + Math.cos(u) * (1 + Math.cos(v) * k) * hoverRate }, y: function (u, v) { if (u < startRadian) { - return offsetY + Math.sin(startRadian) * (1 + Math.cos(v) * k) * hoverRate; + return ( + offsetY + + Math.sin(startRadian) * (1 + Math.cos(v) * k) * hoverRate + ) } if (u > endRadian) { - return offsetY + Math.sin(endRadian) * (1 + Math.cos(v) * k) * hoverRate; + return ( + offsetY + Math.sin(endRadian) * (1 + Math.cos(v) * k) * hoverRate + ) } - return offsetY + Math.sin(u) * (1 + Math.cos(v) * k) * hoverRate; + return offsetY + Math.sin(u) * (1 + Math.cos(v) * k) * hoverRate }, z: function (u, v) { - if (u < - Math.PI * 0.5) { - return Math.sin(u); + if (u < -Math.PI * 0.5) { + return Math.sin(u) } if (u > Math.PI * 2.5) { - return Math.sin(u); + return Math.sin(u) } - return Math.sin(v) > 0 ? 1 * height : -1; - } - }; + return Math.sin(v) > 0 ? 1 * height : -1 + }, + } }, // 生成模拟 3D 饼图的配置项 getPie3D(pieData, internalDiameterRatio) { - let series = []; - let sumValue = 0; - let startValue = 0; - let endValue = 0; - let legendData = []; - let k = typeof internalDiameterRatio !== 'undefined' ? (1 - internalDiameterRatio) / (1 + internalDiameterRatio) : 1 / 3; + let series = [] + let sumValue = 0 + let startValue = 0 + let endValue = 0 + let legendData = [] + let k = + typeof internalDiameterRatio !== 'undefined' + ? (1 - internalDiameterRatio) / (1 + internalDiameterRatio) + : 1 / 3 // 为每一个饼图数据,生成一个 series-surface 配置 for (let i = 0; i < pieData.length; i++) { - sumValue += pieData[i].value; + sumValue += pieData[i].value let seriesItem = { - name: typeof pieData[i].name === 'undefined' ? `series${i}` : pieData[i].name, + name: + typeof pieData[i].name === 'undefined' + ? `series${i}` + : pieData[i].name, type: 'surface', parametric: true, wireframe: { - show: false + show: false, }, pieData: pieData[i], pieStatus: { selected: false, hovered: false, - k: k - } - }; + k: k, + }, + } if (typeof pieData[i].itemStyle != 'undefined') { - let itemStyle = {}; - typeof pieData[i].itemStyle.color != 'undefined' ? itemStyle.color = pieData[i].itemStyle.color : null; - typeof pieData[i].itemStyle.opacity != 'undefined' ? itemStyle.opacity = pieData[i].itemStyle.opacity : null; + let itemStyle = {} + typeof pieData[i].itemStyle.color != 'undefined' + ? (itemStyle.color = pieData[i].itemStyle.color) + : null + typeof pieData[i].itemStyle.opacity != 'undefined' + ? (itemStyle.opacity = pieData[i].itemStyle.opacity) + : null - seriesItem.itemStyle = itemStyle; + seriesItem.itemStyle = itemStyle } - series.push(seriesItem); + series.push(seriesItem) } for (let i = 0; i < series.length; i++) { - endValue = startValue + series[i].pieData.value; - console.log(series[i]); - series[i].pieData.startRatio = startValue / sumValue; - series[i].pieData.endRatio = endValue / sumValue; - series[i].parametricEquation = this.getParametricEquation(series[i].pieData.startRatio, series[i].pieData.endRatio, false, false, k, series[i].pieData.value); - startValue = endValue; - legendData.push(series[i].name); + endValue = startValue + series[i].pieData.value + console.log(series[i]) + series[i].pieData.startRatio = startValue / sumValue + series[i].pieData.endRatio = endValue / sumValue + series[i].parametricEquation = this.getParametricEquation( + series[i].pieData.startRatio, + series[i].pieData.endRatio, + false, + false, + k, + series[i].pieData.value + ) + startValue = endValue + legendData.push(series[i].name) } // // 补充一个透明的圆环,用于支撑高亮功能的近似实现。 series.push({ @@ -217,16 +258,16 @@ export default { step: Math.PI / 20, }, x: function (u, v) { - return ((Math.sin(v) * Math.sin(u) + Math.sin(u)) / Math.PI) * 2; + return ((Math.sin(v) * Math.sin(u) + Math.sin(u)) / Math.PI) * 2 }, y: function (u, v) { - return ((Math.sin(v) * Math.cos(u) + Math.cos(u)) / Math.PI) * 2; + return ((Math.sin(v) * Math.cos(u) + Math.cos(u)) / Math.PI) * 2 }, z: function (u, v) { - return Math.cos(v) > 0 ? -0.5 : -5; + return Math.cos(v) > 0 ? -0.5 : -5 }, }, - }); + }) // // 补充一个透明的圆环,用于支撑高亮功能的近似实现。 series.push({ @@ -252,16 +293,16 @@ export default { step: Math.PI / 20, }, x: function (u, v) { - return ((Math.sin(v) * Math.sin(u) + Math.sin(u)) / Math.PI) * 2; + return ((Math.sin(v) * Math.sin(u) + Math.sin(u)) / Math.PI) * 2 }, y: function (u, v) { - return ((Math.sin(v) * Math.cos(u) + Math.cos(u)) / Math.PI) * 2; + return ((Math.sin(v) * Math.cos(u) + Math.cos(u)) / Math.PI) * 2 }, z: function (u, v) { - return Math.cos(v) > 0 ? -5 : -7; + return Math.cos(v) > 0 ? -5 : -7 }, }, - }); + }) series.push({ name: 'mouseoutSeries', type: 'surface', @@ -272,7 +313,6 @@ export default { itemStyle: { opacity: 0.1, color: '#E1E8EC', - }, parametricEquation: { u: { @@ -286,20 +326,20 @@ export default { step: Math.PI / 20, }, x: function (u, v) { - return ((Math.sin(v) * Math.sin(u) + Math.sin(u)) / Math.PI) * 2.2; + return ((Math.sin(v) * Math.sin(u) + Math.sin(u)) / Math.PI) * 2.2 }, y: function (u, v) { - return ((Math.sin(v) * Math.cos(u) + Math.cos(u)) / Math.PI) * 2.2; + return ((Math.sin(v) * Math.cos(u) + Math.cos(u)) / Math.PI) * 2.2 }, z: function (u, v) { - return Math.cos(v) > 0 ? -7 : -7; + return Math.cos(v) > 0 ? -7 : -7 }, }, - }); - return series; + }) + return series }, mastery(data) { - var myChart = echarts.init(document.querySelector("#pieChartMap")); + var myChart = echarts.init(document.querySelector('#pieChartMap')) // const optionsData = [ // { // name: '数量领料', @@ -316,7 +356,7 @@ export default { // }, // }, // ]; - const series = this.getPie3D(this.data, 0.8, 360, 18, 56, 1); + const series = this.getPie3D(this.data, 0.8, 360, 18, 56, 1) series.push({ type: 'pie', @@ -340,7 +380,7 @@ export default { itemStyle: { opacity: 0, }, - }); + }) let option = { legend: { show: false, @@ -367,24 +407,24 @@ export default { label: { show: true, position: 'inside', - formatter: params => { + formatter: (params) => { return `${params.percent}%\n${params.name}` }, borderWidth: 0, padding: [0, -50], height: 70, fontSize: 14, - align: "center", - color: "#ffffff", + align: 'center', + color: '#ffffff', rich: { hr: { backgroundColor: '#fff', borderRadius: 3, width: 3, height: 3, - padding: [3, 3, 0, -12] + padding: [3, 3, 0, -12], }, - } + }, // rich: { // b: { // fontSize: 14, @@ -423,16 +463,19 @@ export default { }, }, series: series, - }; - if (option && typeof option === "object") { - myChart.setOption(option); + } + if (option && typeof option === 'object') { + myChart.setOption(option) } }, handleClick() { - this.$refs.materialAnalysisDialog.setOpen({ open: true, maType: this.maType }) - } + this.$refs.materialAnalysisDialog.setOpen({ + open: true, + maType: this.maType, + }) + }, }, -}; +} diff --git a/sgzb-screen/src/views/newHome/components/drawer-device.vue b/sgzb-screen/src/views/newHome/components/drawer-device.vue index bf1e211b..766cde68 100644 --- a/sgzb-screen/src/views/newHome/components/drawer-device.vue +++ b/sgzb-screen/src/views/newHome/components/drawer-device.vue @@ -1,51 +1,98 @@ @@ -121,6 +374,8 @@ export default { border-right: 1px dashed #0098ee; color: #fff; background-color: #030c3c; + display: flex; + flex-direction: column; ul { margin: 0; @@ -172,35 +427,56 @@ export default { margin: 8px 0; div { + margin-right: 8px; text-align: center; width: 96px; height: 44px; line-height: 44px; cursor: pointer; + background: url('../../../assets/img/myImage/no_active.png') no-repeat; + background-size: 100% 100%; } .active { - background: url('../../../assets/img/sel (1).png') no-repeat; + background: url('../../../assets/img/myImage/active.png') no-repeat; } } .location-list { - padding: 15px 10px; - border: 1px solid #035ea6; - + flex: 1; + overflow: auto; + .trip-container { + margin-bottom: 8px; + padding: 15px 10px; + border: 1px solid #035ea6; + cursor: pointer; + } div { - padding: 6px 0; + // padding: 6px 0; + } + + .activeIndex { + background-color: #3d4883; } .location-start { display: flex; align-items: center; - justify-content: space-between; + justify-content: space-around; img { vertical-align: middle; margin-right: 6px; } + + span { + flex: 1; + } + + div { + flex: 1; + word-break: break-all; + } } } } @@ -221,8 +497,29 @@ export default { #drawer-map-container { width: 100%; height: 70%; - background: orange; } } } +/deep/ .el-radio-button__inner, +.el-radio-group { + display: flex; +} + +//定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸 +*::-webkit-scrollbar { + width: 5px; + height: 5px; +} + +//定义滑块 内阴影+圆角 +*::-webkit-scrollbar-thumb { + border-radius: 1em; + background-color: rgba(230, 237, 248, 0.3); +} + +//定义滚动条轨道 内阴影+圆角 +*::-webkit-scrollbar-track { + border-radius: 1em; + background-color: rgba(230, 237, 248, 0.1); +} diff --git a/sgzb-screen/src/views/newHome/components/drawer-project.vue b/sgzb-screen/src/views/newHome/components/drawer-project.vue index 7ed6f050..881ef2b8 100644 --- a/sgzb-screen/src/views/newHome/components/drawer-project.vue +++ b/sgzb-screen/src/views/newHome/components/drawer-project.vue @@ -1,74 +1,234 @@ diff --git a/sgzb-screen/src/views/newHome/index.vue b/sgzb-screen/src/views/newHome/index.vue index dd45f2e0..6f143b60 100644 --- a/sgzb-screen/src/views/newHome/index.vue +++ b/sgzb-screen/src/views/newHome/index.vue @@ -92,8 +92,8 @@ :direction="direction" size="80%" > - - + + - - + + + +