From 1ae471941bbdf9dde5dba668d33acf415fc6ec07 Mon Sep 17 00:00:00 2001 From: jiangping <jp@doumee.com> Date: 星期一, 21 十月 2024 16:54:48 +0800 Subject: [PATCH] 最新版本541200007 --- admin/src/views/index.vue | 443 ++++++++++++++++++++++++++++++++++++++---------------- 1 files changed, 310 insertions(+), 133 deletions(-) diff --git a/admin/src/views/index.vue b/admin/src/views/index.vue index a391765..5ff323a 100644 --- a/admin/src/views/index.vue +++ b/admin/src/views/index.vue @@ -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> @@ -144,26 +134,22 @@ <div class="header df_sb"> <div class="home_title df"> <span>寰呭姙浜嬮」</span> - <span class="num">10</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,44 @@ <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" v-if="item.memberType == 0">鍔冲姟璁垮</div> + <div class="identity" v-if="item.memberType == 1">鏅�氳瀹�</div> + <div class="identity" v-if="item.memberType == 2">鍐呴儴浜哄憳</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,62 +203,188 @@ import * as echarts from 'echarts' import { weeks } from '@/utils/config' import { - getWorkbenchBody, - getWorkbenchHead + getWorkbenchData, + getAppHeaderNav } 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 { - data () { + 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 () { - + created() { this.updateDate() setInterval(() => { this.updateDate() }, 1000 * 60 * 60) }, - mounted () { + mounted() { this.initData() }, methods: { - updateDate () { + SubSuccess(str) { + this[str] = false + this.getTaskList() + }, + funcClick(item) { + if (item.name == '鑰冨嫟宸ヤ綔鍙�') { + getAppHeaderNav(4).then(res => { + window.open(res, "_blank") + return + }) + } + 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() + initData() { + this.getWorkHead() + this.getWorkBody() + this.getTaskList() + this.getWarningList() + }, + getWarningList() { + getWorkbenchData({ queryType: 4 }).then(res => { + this.warningList = res.timeOutVisitList || [] + this.warningTotal = res.timeOutVisitNum || 0 + }) + }, + getTaskList() { + getWorkbenchData({ queryType: 3 }).then(res => { + this.taskList = res.noticesList || [] + this.taskTotal = res.noticesNum || 0 + }) }, getWorkBody() { - getWorkbenchBody() + getWorkbenchData({ queryType: 2 }).then(res => { + this.staticData = res || {} + this.initEchart2() + this.initEchart3() + this.initEchart4() + }) }, getWorkHead() { - getWorkbenchHead() + getWorkbenchData({ queryType: 1 }).then(res => { + this.headerData = res || {} + let 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() + }) }, - 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.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')) + let that = this + const option = { + tooltip: { + trigger: 'item' + }, series: [ { type: 'pie', @@ -294,11 +397,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: '闀挎湡鐩稿叧鏂�' } + // ] } ] } @@ -307,8 +411,9 @@ myChart.resize() }) }, - initEchart2 () { + initEchart2() { const myChart = echarts.init(document.getElementById('echart2')) + let that = this myChart.setOption({ grid: { top: '4%', @@ -336,11 +441,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: { @@ -352,7 +457,7 @@ { offset: 1, color: '#407ff0' } ] ), - barBorderRadius: [0, 10, 10, 0] + // barBorderRadius: [0, 10, 10, 0] } } } @@ -362,8 +467,9 @@ myChart.resize() }) }, - initEchart3 () { + initEchart3() { const myChart = echarts.init(document.getElementById('echart3')) + let that = this myChart.setOption({ tooltip: { trigger: 'axis', @@ -373,7 +479,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 +492,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 +511,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 +555,9 @@ symbol: 'circle', symbolSize: 10, itemStyle: { - normal: { - color: '#207FF7' // 鎶樼嚎鐐圭殑棰滆壊 - } + borderWidth: 1, + borderColor: '#fff', + color: '#207FF7' }, smooth: false } @@ -461,8 +567,9 @@ myChart.resize() }) }, - initEchart4 () { + initEchart4() { const myChart = echarts.init(document.getElementById('echart4')) + let that = this myChart.setOption({ tooltip: { trigger: 'axis', @@ -472,11 +579,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 +592,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 +611,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 +655,9 @@ symbol: 'circle', symbolSize: 10, itemStyle: { - normal: { - color: '#42D49D' // 鎶樼嚎鐐圭殑棰滆壊 - } + borderWidth: 1, + borderColor: '#fff', + color: '#42D49D' // 鎶樼嚎鐐圭殑棰滆壊 }, smooth: false } @@ -568,23 +675,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 +704,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 +725,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 +748,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 +775,11 @@ } } } + .app_side { width: 408px; margin-left: 10px; + .task { background: #fff; border-radius: 2px; @@ -661,6 +787,7 @@ padding: 20px; height: 346px; margin-bottom: 10px; + .header { .num { position: relative; @@ -675,27 +802,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 +840,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 +867,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 +884,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 +929,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 +954,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 +994,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 +1015,7 @@ margin-right: 6px; background: linear-gradient(270deg, #29aeff 0%, #207ff7 100%); } + .text { margin-right: 6px; } @@ -850,6 +1025,7 @@ } } } + .main_home { background: #f4f7fc; position: relative; @@ -858,6 +1034,7 @@ overflow: auto; padding: 20px; padding-top: 92px; + .home_header { position: absolute; top: 0; -- Gitblit v1.9.3