From f6ba5de2578c58a738f35b29a708c523ccb518ba Mon Sep 17 00:00:00 2001 From: jiangping <jp@doumee.com> Date: 星期四, 05 十二月 2024 09:20:07 +0800 Subject: [PATCH] 最新版本541200007 --- admin/src/views/index.vue | 508 ++++++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 379 insertions(+), 129 deletions(-) diff --git a/admin/src/views/index.vue b/admin/src/views/index.vue index a391765..0de3d22 100644 --- a/admin/src/views/index.vue +++ b/admin/src/views/index.vue @@ -3,7 +3,7 @@ <div class="home_header"> <div class="mb10 fs17">涓嬪崍濂斤紝{{ userInfo.realname }}</div> <div class="fs13"> - 浠婂ぉ鏄� {{ nowDate }} {{ nowWeek }}锛屾杩庡洖鍒版櫤鎱х墿娴佸洯鍖哄畨娑堜竴浣撳寲绯荤粺 + 浠婂ぉ鏄� {{ nowDate }} {{ nowWeek }}锛屾杩庤闂櫤鎱х墿娴佸洯鍖哄畨娑堜竴浣撳寲绯荤粺 </div> </div> <div class="main"> @@ -13,59 +13,59 @@ <div class="header"> <div class="left"> <div class="fs15">浠婃棩鍦ㄥ洯浜烘暟(浜�)</div> - <div class="num">300</div> + <div class="num">{{ headerData.todayInParkUserNum }}</div> </div> <img src="@/assets/icons/home_icon1.png" alt="" /> </div> <div class="content"> - <div>鍏ュ洯浜烘(浜�)锛�600</div> - <div>鍑哄洯浜烘(浜�)锛�300</div> + <div>鍏ュ洯浜烘(浜�)锛歿{ headerData.todayInUserNum }}</div> + <div>鍑哄洯浜烘(浜�)锛歿{ headerData.todayOutUserNum }}</div> </div> </div> <div class="card"> <div class="header"> <div class="left"> <div class="fs15">鍦ㄥ洯璁垮鏁�(浜�)</div> - <div class="num">300</div> + <div class="num">{{ headerData.inParkVisitUserNum }}</div> </div> <img src="@/assets/icons/home_icon2.png" alt="" /> </div> <div class="content"> - <div>璁垮浜烘(浜�)锛�200</div> - <div>绛剧浜烘(浜�)锛�300</div> + <div>璁垮浜烘(浜�)锛歿{ headerData.visitUserNum }}</div> + <div>绛剧浜烘(浜�)锛歿{ headerData.signLevelNum }}</div> </div> </div> <div class="card"> <div class="header"> <div class="left"> <div class="fs15">鍦ㄥ洯闀挎湡鐩稿叧鏂规暟(浜�)</div> - <div class="num">300</div> + <div class="num">{{ headerData.inParkLwUserNum }}</div> </div> <img src="@/assets/icons/home_icon3.png" alt="" /> </div> <div class="content"> - <div>鍏ュ洯浜烘(浜�)锛�600</div> - <div>鍑哄洯浜烘(浜�)锛�300</div> + <div>鍏ュ洯浜烘(浜�)锛歿{ headerData.lwUserInNum }}</div> + <div>鍑哄洯浜烘(浜�)锛歿{ headerData.lwUserOutNum }}</div> </div> </div> <div class="card"> <div class="header"> <div class="left"> - <div class="fs15">鍦ㄥ洯闀挎湡鐩稿叧鏂规暟(浜�)</div> - <div class="num">300</div> + <div class="fs15">浠婃棩鍦ㄥ洯杞﹁締(杈�)</div> + <div class="num">{{ headerData.todayInParkCarNum }}</div> </div> <img src="@/assets/icons/home_icon4.png" alt="" /> </div> <div class="content"> - <div>鍏ュ洯杞︽(杈�)锛�600</div> - <div>鍑哄洯杞︽(杈�)锛�300</div> + <div>鍏ュ洯杞︽(杈�)锛歿{ headerData.todayInCarNum }}</div> + <div>鍑哄洯杞︽(杈�)锛歿{ headerData.todayOutCarNum }}</div> </div> </div> </div> <div class="funcs"> <div class="home_title">甯哥敤鍔熻兘</div> <div class="list"> - <div v-for="item in funcList" :key="item.name" class="item"> + <div v-for="item in funcList" @click="funcClick(item)" :key="item.name" class="item"> <img class="mb10" :src="item.url" alt="" /> <div>{{ item.name }}</div> </div> @@ -76,33 +76,23 @@ <div class="wrap static1"> <div class="header"> <div class="home_title">鍦ㄥ満浜哄憳鍗犳瘮</div> - <div class="df_ac more"> + <!-- <div class="df_ac more"> 鏇村<i class="el-icon-arrow-right"></i> - </div> + </div> --> </div> <div class="content"> <div class="echart_wrap"> <div class="pie_text"> <div class="fs13">鎬绘暟</div> - <div class="fs15"><strong>300</strong></div> + <div class="fs15"><strong>{{ headerData.todayInParkUserNum }}</strong></div> </div> <div class="echart" id="echart1"></div> </div> <div class="list"> - <div class="item"> - <div class="icon"></div> - <div class="text">璁垮</div> - <div class="num">100</div> - </div> - <div class="item"> - <div :style="{ background: colors[0] }" class="icon"></div> - <div class="text">璁垮</div> - <div class="num">100</div> - </div> - <div class="item"> - <div :style="{ background: colors[1] }" class="icon"></div> - <div class="text">璁垮</div> - <div class="num">100</div> + <div class="item" v-for="item, i in manningRatio" :key="i"> + <div :style="{ background: colors[i] }" class="icon"></div> + <div class="text">{{ item.name }}</div> + <div class="num">{{ item.value }}</div> </div> </div> </div> @@ -110,9 +100,9 @@ <div class="wrap static2"> <div class="header"> <div class="home_title">闀挎湡鐩稿叧鏂瑰垎甯�</div> - <div class="df_ac more"> + <!-- <div class="df_ac more"> 鏇村<i class="el-icon-arrow-right"></i> - </div> + </div> --> </div> <div class="echart" id="echart2"></div> </div> @@ -121,18 +111,18 @@ <div class="wrap static3"> <div class="header"> <div class="home_title">7鏃ヨ瀹㈢粺璁�</div> - <div class="df_ac more"> + <!-- <div class="df_ac more"> 鏇村<i class="el-icon-arrow-right"></i> - </div> + </div> --> </div> <div class="echart" id="echart3"></div> </div> <div class="wrap static4"> <div class="header"> <div class="home_title">7鏃ヨ溅杈嗙粺璁�</div> - <div class="df_ac more"> + <!-- <div class="df_ac more"> 鏇村<i class="el-icon-arrow-right"></i> - </div> + </div> --> </div> <div class="echart" id="echart4"></div> </div> @@ -143,27 +133,23 @@ <div class="task"> <div class="header df_sb"> <div class="home_title df"> - <span>寰呭姙浜嬮」</span> - <span class="num">10</span> + <span >寰呭姙浜嬮」</span> + <span class="num" v-if="taskTotal">{{ taskTotal }}</span> </div> - <div class="df_ac more"> + <div class="df_ac more" @click="jumpPage('/task/index')"> 鏇村<i class="el-icon-arrow-right"></i> </div> </div> <div class="list"> - <div class="item"> + <div class="item" v-for="item in taskList" :key="item.id"> <div class="content"> - <div class="title">鐐圭偣婊存淮</div> - <div class="time">time</div> + <div class="title">{{ item.title }}</div> + <div class="time">{{ item.createDate }}</div> </div> - <div class="btn">澶勭悊</div> + <div class="btn" v-permissions="['business:staging:query']" @click="handleDetail(item)">澶勭悊</div> </div> - <div class="item"> - <div class="content"> - <div class="title">鐐圭偣婊存淮</div> - <div class="time">time</div> - </div> - <div class="btn">澶勭悊</div> + <div v-if="taskList.length == 0" class="empty"> + <img src="@/assets/images/default_homeimg.png" alt=""> </div> </div> </div> @@ -171,53 +157,42 @@ <div class="header df_sb"> <div class="home_title df"> <span>瓒呮椂棰勮</span> - <span class="num">10</span> + <span class="num" v-if="warningTotal">{{ warningTotal }}</span> </div> - <div class="df_ac more"> + <div class="df_ac more" @click="jumpPage('/business/strandedPersonnel')"> 鏇村<i class="el-icon-arrow-right"></i> </div> </div> <div class="list"> - <div class="item"> + <div class="item" v-for="item in warningList" :key="item.id"> <div class="name_wrap df_sb"> - <div class="name">琚侀殕骞�</div> - <div class="identity">鏅�氳瀹�</div> + <div class="name">{{ item.name }}</div> + <div class="identity">璁垮</div> </div> - <div class="line">鑱旂郴鐢佃瘽锛�1888</div> - <div class="line">璁垮鍏徃锛氬畨寰借眴绫�</div> + <div class="line">鑱旂郴鐢佃瘽锛歿{ item.phone }}</div> + <div class="line">璁垮鍏徃锛歿{ item.companyName }}</div> <div class="auth df_sb"> - <div class="time">鎺堟潈鏈熼檺锛�</div> - <div class="btn">绂诲満</div> + <div class="time">鎺堟潈鏈熼檺锛歿{ item.endtime }}</div> + <div class="btn" @click="departure(item.id)">绂诲満</div> </div> </div> - <div class="item"> - <div class="name_wrap df_sb"> - <div class="name">琚侀殕骞�</div> - <div class="identity">鏅�氳瀹�</div> - </div> - <div class="line">鑱旂郴鐢佃瘽锛�1888</div> - <div class="line">璁垮鍏徃锛氬畨寰借眴绫�</div> - <div class="auth df_sb"> - <div class="time">鎺堟潈鏈熼檺锛�</div> - <div class="btn">绂诲満</div> - </div> - </div> - <div class="item"> - <div class="name_wrap df_sb"> - <div class="name">琚侀殕骞�</div> - <div class="identity">鏅�氳瀹�</div> - </div> - <div class="line">鑱旂郴鐢佃瘽锛�1888</div> - <div class="line">璁垮鍏徃锛氬畨寰借眴绫�</div> - <div class="auth df_sb"> - <div class="time">鎺堟潈鏈熼檺锛�</div> - <div class="btn">绂诲満</div> - </div> - </div> + </div> + <div v-if="warningList.length == 0" class="empty"> + <img src="@/assets/images/default_homeimg.png" alt=""> </div> </div> </div> </div> + <TaskDetail v-if="isShowDetail" ref="DetailRef" @success="SubSuccess('isShowDetail')" /> + <VisReportDetail v-if="isShowReport" ref="VisReportDetailRef" @success="SubSuccess('isShowReport')" /> + <DangetDetail v-if="isShowDanger" ref="DangetDetailRef" @success="SubSuccess('isShowDanger')" /> + <DriverDetail v-if="isShowDriver" ref="DriverDetailRef" @success="SubSuccess('isShowDriver')" /> + <!-- 鐢ㄨ溅鐢宠 --> + <OperaCarUseBookWindow ref="OperaDetailsWindow" @success="getTaskList" /> + <!-- 闅愭偅 --> + <OperaHiddenDangerWindow ref="OperaHiddenDangerWindow" @success="getTaskList" /> + <!-- 棰勭害璇︽儏 --> + <OperaVisitsDesWindow ref="OperaVisitsDesWindow" /> </div> </template> @@ -226,31 +201,58 @@ import * as echarts from 'echarts' import { weeks } from '@/utils/config' import { - getWorkbenchBody, - getWorkbenchHead + getWorkbenchData, + getAppHeaderNav, syncHkNotice } from '@/api' +import { level } from '@/api/business/visits' +import TaskDetail from '@/views/task/visSubDetail.vue' +import VisReportDetail from '@/views/task/visReportDetail.vue' +import DangetDetail from '@/views/task/dangetDetail.vue' +import DriverDetail from '@/views/task/driverDetail.vue' +import OperaCarUseBookWindow from '@/components/business/OperaCarUseBookWindow' +import OperaHiddenDangerWindow from '@/components/business/OperaHiddenDangerWindow' +import OperaVisitsDesWindow from '@/components/business/OperaVisitsDesWindow' const colors = ['#52a4f7', '#7678f7', '#5fc6d5'] export default { + components: { + TaskDetail, + VisReportDetail, + DangetDetail, + DriverDetail, + OperaCarUseBookWindow, + OperaHiddenDangerWindow, + OperaVisitsDesWindow + }, data () { return { colors, nowDate: '', nowWeek: '', + headerData: {}, + staticData: {}, + manningRatio: [], + taskList: [], + taskTotal: 0, + warningList: [], + warningTotal: 0, funcList: [ - { name: '璁垮鎶ュ', path: '', url: require('@/assets/icons/home_func1.png') }, - { name: '闅愭偅闅忔墜鎷�', path: '', url: require('@/assets/icons/home_func2.png') }, - { name: '棰勭害浼氳瀹�', path: '', url: require('@/assets/icons/home_func3.png') }, + { name: '璁垮鎶ュ', path: '', url: require('@/assets/icons/home_func1.png'), path: '/business/reportRecord' }, + { name: '闅愭偅闅忔墜鎷�', path: '', url: require('@/assets/icons/home_func2.png'), path: '/operation/danger/record' }, + { name: '棰勭害浼氳瀹�', path: '', url: require('@/assets/icons/home_func3.png'), path: '/meeting/bookings' }, { name: '鑰冨嫟宸ヤ綔鍙�', path: '', url: require('@/assets/icons/home_func4.png') } - ] + ], + isShowDetail: false, + isShowReport: false, + isShowDanger: false, + isShowDriver: false } }, computed: { - userInfo(){ + userInfo () { return this.$store.state.userInfo } }, created () { - this.updateDate() setInterval(() => { this.updateDate() @@ -260,28 +262,202 @@ this.initData() }, methods: { + getNoticeList(){ + syncHkNotice().then(res => { + + }) + }, + handleTest (row) { + getAppHeaderNav(5).then(res => { + if (res == undefined || res == null) { + return + } + const myWindow = window.open(res) + setTimeout(() => { + const params = { + componentId: 'dfe', + componentMenuId: 'process_apply', + callback: { + method: 'dealTlncMsg', + argument: { + msgId: '98c256b9-aaff-11ef-8347-fa163ee2c57c', + moduleId: 'dfeFlowTodoModuleId', + msgTitle: '璇峰強鏃跺鐞�13856591439鍙戣捣鐨勮鍋囩敵璇�', + msgStatus: '0', + msgCreateTime: '浠婂ぉ 15:33', + msgCreateTimeIso: '2024-11-25T15:33:42.000+08:00', + serverTime: 1732531014591, + menuCode: 'process_apply', + msgStatusStr: '寰呭鐞�', + comId: 'dfe', + userId: '13856591439', + extendNoShow: '{"processInstanceId":"98a57fe0-aaff-11ef-8347-fa163ee2c57c","processId":"process_dabcfdd39f1b6f46d36a9f4ff6ce1080","param":{"sourceType":"todo","modelCode":"tb_leave_dfe_for_dfe_runtime","processNodeId":"UserTask_dde7d83377343a2d5fa1f60c23b023ef","taskId":"98c256b9-aaff-11ef-8347-fa163ee2c57c"},"process.param.appId":"32ca8770-6f85-11ec-b5a3-991864da52a6","appId":"32ca8770-6f85-11ec-b5a3-991864da52a6","name":"璇峰亣鐢宠","taskId":"98c256b9-aaff-11ef-8347-fa163ee2c57c","taskNodeId":"UserTask_dde7d83377343a2d5fa1f60c23b023ef","url":"/dfe-form/process/tlnc/apply"}', + targetComId: 'dfe', + moduleName: '娴佺▼寰呭姙', + tid: '99cad778-aaff-11ef-9dbf-ff08ba71965c', + msgEndTime: null, + msgEndTimeIso: '', + picUrl: '', + extendJson: '{"key1":"璇峰強鏃跺鐞嗛檲楦块鍙戣捣鐨勮鍋囩敵璇�"}', + extendParam: null, + extendCascade: null, + createUser: '13856591439', + webCascadeUrl: null, + h5CascadeUrl: null, + cascadeTodoOpenType: null, + cascadeSourceConfigId: null, + h5Url: '/h5/pages/form-page/form-page?returnPath=-1&appId=32ca8770-6f85-11ec-b5a3-991864da52a6&taskId=98c256b9-aaff-11ef-8347-fa163ee2c57c&processNodeId=UserTask_dde7d83377343a2d5fa1f60c23b023ef&modelCode=tb_leave_dfe_for_dfe_runtime&type=flowHandle&component=form-apply&_sn=true', + segmentId: 'dfe-form', + lastUsers: '闄堥缚椋�', + currentUsers: '闄堥缚椋�', + todoTypeCode: 'dfe@@tlnc_placeholder_tlnc@@dfeFlowTodoModuleId', + currentUserIds: '13856591439', + lastUserIds: '13856591439', + msgDesc: null, + widgetUrl: null, + detailType: null, + widgetWidth: null, + widgetHeight: null, + userIdList: null, + statusName: null, + arriveTime: null, + stayTime: null, + todoType: null, + cascadePort: null, + openMode: null + } + }, + msgType: 'tlnc' + } + // const argus = JSON.stringify(params) + myWindow.postMessage('{"method":"goToApp","argument":' + row.param5 + '}', '*') + }, 3000) + }) + }, + SubSuccess (str) { + this[str] = false + this.getTaskList() + }, + funcClick (item) { + if (item.name == '鑰冨嫟宸ヤ綔鍙�') { + getAppHeaderNav(4).then(res => { + window.open(res, '_blank') + }) + } + this.$router.push(item.path) + }, updateDate () { this.nowDate = dayjs().format('YYYY骞碝鏈圖鏃�') this.nowWeek = weeks[new Date().getDay()] }, initData () { - this.getWorkBody() //涓讳綋鏁版嵁 - this.getWorkHead() //涓讳綋鏁版嵁 - - this.initEchart1() - this.initEchart2() - this.initEchart3() - this.initEchart4() + this.getWorkHead() + this.getWorkBody() + this.getTaskList() + this.getWarningList() }, - getWorkBody() { - getWorkbenchBody() + getWarningList () { + getWorkbenchData({ queryType: 4 }).then(res => { + this.warningList = res.timeOutVisitList || [] + this.warningTotal = res.timeOutVisitNum || 0 + }) }, - getWorkHead() { - getWorkbenchHead() + getTaskList () { + getWorkbenchData({ queryType: 3 }).then(res => { + this.taskList = res.noticesList || [] + this.taskTotal = res.noticesNum || 0 + }) + }, + getWorkBody () { + getWorkbenchData({ queryType: 2 }).then(res => { + this.staticData = res || {} + this.initEchart2() + this.initEchart3() + this.initEchart4() + }) + }, + getWorkHead () { + getWorkbenchData({ queryType: 1 }).then(res => { + this.headerData = res || {} + const arr = [] + arr.push({ name: '璁垮', value: this.headerData.inParkVisitUserNum }) + arr.push({ name: '鍐呴儴鍛樺伐', value: this.headerData.todayInParkUserNum - this.headerData.inParkLwUserNum - this.headerData.inParkVisitUserNum }) + arr.push({ name: '闀挎湡鐩稿叧鏂�', value: this.headerData.inParkLwUserNum }) + arr.sort((a, b) => b.value - a.value) + this.manningRatio = arr + this.initEchart1() + }) + }, + jumpPage (page) { + this.$router.push(page) + }, + departure (id) { + this.$confirm('纭畾绂诲巶鍚�, 鏄惁缁х画?', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning' + }).then(() => { + level(id) + .then(res => { + this.getWarningList() + }) + }).catch(() => { + + }) + }, + handleDetail (row) { + if (row.type === 7) { + this.handleTest(row); + return + } + if (row.objType === 2) { + this.$refs.OperaDetailsWindow.open('鍏姟杞︾敵璇疯鎯�', { ...row, id: row.objId }) + return + } + if (row.objType === 1) { + this.isShowReport = true + this.$nextTick(() => { + this.$refs.VisReportDetailRef.id = row.objId + this.$refs.VisReportDetailRef.type = row.objType + this.$refs.VisReportDetailRef.getDetail() + this.$refs.VisReportDetailRef.isShowModal = true + }) + return + } + if (row.objType === 3) { + const obj = { ...row, id: row.objId } + this.$refs.OperaHiddenDangerWindow.open('闅愭偅闅忔墜鎷嶈鎯�', obj) + return + } + if (row.objType === 6) { + const obj = { ...row, id: row.objId } + this.isShowDriver = true + this.$nextTick(() => { + this.$refs.DriverDetailRef.id = row.objId + this.$refs.DriverDetailRef.type = row.objType + this.$refs.DriverDetailRef.getDetail() + this.$refs.DriverDetailRef.isShowModal = true + }) + return + } + if (row.objType === 0) { + this.isShowDetail = true + this.$nextTick(() => { + this.$refs.DetailRef.id = row.objId + this.$refs.DetailRef.type = row.objType + this.$refs.DetailRef.getDetail() + this.$refs.DetailRef.isShowModal = true + }) + } }, initEchart1 () { const myChart = echarts.init(document.getElementById('echart1')) + const that = this + const option = { + tooltip: { + trigger: 'item' + }, series: [ { type: 'pie', @@ -294,11 +470,12 @@ labelLine: { show: false }, - data: [ - { value: 1048, name: 'Search Engine' }, - { value: 735, name: 'Direct' }, - { value: 580, name: 'Email' } - ] + data: that.manningRatio + // data: [ + // { value: that.headerData.inParkVisitUserNum, name: '璁垮' }, + // { value: that.headerData.todayInParkUserNum - that.headerData.inParkVisitUserNum - that.headerData.inParkLwUserNum, name: '鍐呴儴鍛樺伐' }, + // { value: that.headerData.inParkLwUserNum, name: '闀挎湡鐩稿叧鏂�' } + // ] } ] } @@ -309,6 +486,7 @@ }, initEchart2 () { const myChart = echarts.init(document.getElementById('echart2')) + const that = this myChart.setOption({ grid: { top: '4%', @@ -336,11 +514,11 @@ }, yAxis: { type: 'category', - data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] + data: that.staticData.lwList.map(i => i.name) }, series: [ { - data: [120, 200, 150, 80, 70, 110, 130], + data: that.staticData.lwList.map(i => i.num), type: 'bar', barWidth: 10, itemStyle: { @@ -351,8 +529,8 @@ { offset: 0, color: '#56abf8' }, { offset: 1, color: '#407ff0' } ] - ), - barBorderRadius: [0, 10, 10, 0] + ) + // barBorderRadius: [0, 10, 10, 0] } } } @@ -364,6 +542,7 @@ }, initEchart3 () { const myChart = echarts.init(document.getElementById('echart3')) + const that = this myChart.setOption({ tooltip: { trigger: 'axis', @@ -373,7 +552,7 @@ formatter: function (params) { return ` <div style="background-color: #15323f;margin: -12px;padding: 14px;border: 2px solid rgba(1,217,254,0.5);color: #fff;"> - <div>${params[0].name}鏃ュ娴�</div> + <div>${params[0].name}</div> <div style="display: flex;align-items: center;"> <div style="width: 10px;height: 10px;border-radius: 50%;background-color: #6feef0;"></div> <span style="margin-left: 6px;">${params[0].value}</span> @@ -386,7 +565,7 @@ xAxis: { type: 'category', boundaryGap: false, - data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] + data: that.staticData.weekVisitList.map(i => i.name) }, yAxis: { type: 'value', @@ -405,13 +584,13 @@ grid: { top: '16%', left: '2%', - right: '2%', - bottom: '4%', + right: '8%', + bottom: '2%', containLabel: true }, series: [ { - data: [150, 230, 224, 218, 135, 147, 260], + data: that.staticData.weekVisitList.map(i => i.num), type: 'line', areaStyle: { normal: { @@ -449,9 +628,9 @@ symbol: 'circle', symbolSize: 10, itemStyle: { - normal: { - color: '#207FF7' // 鎶樼嚎鐐圭殑棰滆壊 - } + borderWidth: 1, + borderColor: '#fff', + color: '#207FF7' }, smooth: false } @@ -463,6 +642,7 @@ }, initEchart4 () { const myChart = echarts.init(document.getElementById('echart4')) + const that = this myChart.setOption({ tooltip: { trigger: 'axis', @@ -472,11 +652,11 @@ formatter: function (params) { return ` <div style="background-color: #15323f;margin: -12px;padding: 14px;border: 2px solid rgba(1,217,254,0.5);color: #fff;"> - <div>${params[0].name}鏃ュ娴�</div> + <div>${params[0].name}</div> <div style="display: flex;align-items: center;"> <div style="width: 10px;height: 10px;border-radius: 50%;background-color: #6feef0;"></div> <span style="margin-left: 6px;">${params[0].value}</span> - <div>浜�</div> + <div>杈�</div> </div> </div> ` @@ -485,7 +665,7 @@ xAxis: { type: 'category', boundaryGap: false, - data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] + data: that.staticData.weekCarList.map(i => i.name) }, yAxis: { type: 'value', @@ -504,13 +684,13 @@ grid: { top: '16%', left: '2%', - right: '2%', + right: '8%', bottom: '4%', containLabel: true }, series: [ { - data: [150, 230, 224, 218, 135, 147, 260], + data: that.staticData.weekCarList.map(i => i.num), type: 'line', areaStyle: { normal: { @@ -548,9 +728,9 @@ symbol: 'circle', symbolSize: 10, itemStyle: { - normal: { - color: '#42D49D' // 鎶樼嚎鐐圭殑棰滆壊 - } + borderWidth: 1, + borderColor: '#fff', + color: '#42D49D' // 鎶樼嚎鐐圭殑棰滆壊 }, smooth: false } @@ -568,23 +748,28 @@ div { box-sizing: border-box; } + .home_title { font-weight: 600; font-size: 16px; color: #222222; line-height: 22px; } + .main { display: flex; position: relative; z-index: 99; + .app_content { flex: 1; + .static_card { height: 187px; color: #fff; display: flex; justify-content: space-between; + .card { flex: 1; height: 187px; @@ -592,16 +777,20 @@ box-shadow: 0px 2px 10px 0px rgba(32, 127, 247, 0.4); border-radius: 8px; margin-right: 14px; + &:nth-of-type(2) { background: linear-gradient(270deg, #8383ff 0%, #6b6eff 100%); } + &:nth-of-type(3) { background: linear-gradient(270deg, #42d49d 0%, #12bb8b 100%); } + &:nth-of-type(4) { margin-right: 0; background: linear-gradient(270deg, #30d3de 0%, #04b7cd 100%); } + .header { height: 103px; display: flex; @@ -609,16 +798,19 @@ align-items: center; padding: 20px 20px 12px; border-bottom: 1px solid rgba(255, 255, 255, 0.2); + img { width: 40px; height: 40px; } + .num { font-weight: 600; font-size: 30px; margin-top: 12px; } } + .content { height: 82px; display: flex; @@ -629,20 +821,25 @@ } } } + .funcs { height: 149px; padding: 20px; background: #fff; margin: 10px 0; + .list { display: flex; padding-top: 20px; + .item { display: flex; flex-direction: column; align-items: center; justify-content: center; margin-right: 24px; + cursor: pointer; + img { width: 44px; height: 44px; @@ -651,9 +848,11 @@ } } } + .app_side { width: 408px; margin-left: 10px; + .task { background: #fff; border-radius: 2px; @@ -661,6 +860,7 @@ padding: 20px; height: 346px; margin-bottom: 10px; + .header { .num { position: relative; @@ -675,27 +875,33 @@ border-radius: 8px; margin-left: 13px; } + .more { font-size: 13px; color: #999999; } } + .list { .item { display: flex; align-items: center; margin-top: 15px; + .content { flex: 1; + .title { color: #222222; margin-bottom: 5px; } + .time { color: #999999; font-size: 12px; } } + .btn { margin-left: 10px; width: 58px; @@ -707,16 +913,19 @@ border: 1px solid #207ff7; font-size: 13px; color: #207ff7; + cursor: pointer; } } } } + .warnning { background: #fff; border-radius: 2px; border: 1px solid #eeeeee; padding: 20px; height: 508px; + .header { .num { position: relative; @@ -731,13 +940,16 @@ border-radius: 8px; margin-left: 13px; } + .more { font-size: 13px; color: #999999; } } + .list { padding-top: 6px; + .item { margin-top: 10px; padding: 15px; @@ -745,33 +957,40 @@ height: 140px; background: rgba(32, 127, 247, 0.05); border-radius: 4px; + .name_wrap { margin-bottom: 10px; + .name { font-weight: 600; color: #222222; } + .identity { font-size: 13px; color: #207ff7; } } + .line { color: #666666; margin-bottom: 8px; font-size: 13px; } + .auth { .time { font-weight: 600; font-size: 13px; color: #ee3821; } - .btn{ + + .btn { margin-left: 10px; width: 58px; text-align: center; height: 30px; + cursor: pointer; line-height: 30px; background: #ffffff; border-radius: 2px; @@ -783,7 +1002,23 @@ } } } + + .more { + cursor: pointer; + } + + .empty { + height: 300px; + display: flex; + justify-content: center; + align-items: center; + + img { + width: 140px; + } + } } + .static_wrap { .wrap { background: #fff; @@ -792,30 +1027,38 @@ border: 1px solid #eeeeee; height: 250px; flex: 1; + &:nth-of-type(2n) { margin-left: 10px; } + .echart { width: 100%; height: 190px; } + .header { display: flex; justify-content: space-between; align-items: center; + .more { font-size: 13px; color: #999999; } } } + .static1 { .content { display: flex; justify-content: center; align-items: center; + height: 100%; + .echart_wrap { position: relative; + .pie_text { position: absolute; left: 50%; @@ -824,16 +1067,20 @@ z-index: 999; } } + .echart { width: 150px; height: 150px; } + .list { margin-left: 36px; + .item { display: flex; align-items: center; margin: 8px 0; + .icon { width: 16px; height: 16px; @@ -841,6 +1088,7 @@ margin-right: 6px; background: linear-gradient(270deg, #29aeff 0%, #207ff7 100%); } + .text { margin-right: 6px; } @@ -850,6 +1098,7 @@ } } } + .main_home { background: #f4f7fc; position: relative; @@ -858,6 +1107,7 @@ overflow: auto; padding: 20px; padding-top: 92px; + .home_header { position: absolute; top: 0; -- Gitblit v1.9.3