|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <div class="main_home"> | 
|---|
|  |  |  | <div class="home_header"> | 
|---|
|  |  |  | <div class="mb10 fs17">下午好,系统管理员</div> | 
|---|
|  |  |  | <div class="mb10 fs17">下午好,{{ userInfo.realname }}</div> | 
|---|
|  |  |  | <div class="fs13"> | 
|---|
|  |  |  | 今天是 {{ nowDate }} {{ nowWeek }},欢迎回到智慧物流园区安消一体化系统 | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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="item"> | 
|---|
|  |  |  | <div class="icon"></div> | 
|---|
|  |  |  | <div class="text">访客</div> | 
|---|
|  |  |  | <div class="num">100</div> | 
|---|
|  |  |  | <div class="num">{{ headerData.inParkVisitUserNum }}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="item"> | 
|---|
|  |  |  | <div :style="{ background: colors[0] }" class="icon"></div> | 
|---|
|  |  |  | <div class="text">访客</div> | 
|---|
|  |  |  | <div class="num">100</div> | 
|---|
|  |  |  | <div class="text">内部员工</div> | 
|---|
|  |  |  | <div class="num">{{ headerData.todayInParkUserNum - headerData.inParkLwUserNum - | 
|---|
|  |  |  | headerData.inParkVisitUserNum }}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="item"> | 
|---|
|  |  |  | <div :style="{ background: colors[1] }" class="icon"></div> | 
|---|
|  |  |  | <div class="text">访客</div> | 
|---|
|  |  |  | <div class="num">100</div> | 
|---|
|  |  |  | <div class="text">长期相关方</div> | 
|---|
|  |  |  | <div class="num">{{ headerData.inParkLwUserNum }}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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_nodata.png" alt=""> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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_nodata.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> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | 
|---|
|  |  |  | import dayjs from 'dayjs' | 
|---|
|  |  |  | import * as echarts from 'echarts' | 
|---|
|  |  |  | import { weeks } from '@/utils/config' | 
|---|
|  |  |  | import { | 
|---|
|  |  |  | 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: {}, | 
|---|
|  |  |  | 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, | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | created () { | 
|---|
|  |  |  | computed: { | 
|---|
|  |  |  | userInfo() { | 
|---|
|  |  |  | return this.$store.state.userInfo | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | 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年M月D日') | 
|---|
|  |  |  | this.nowWeek = weeks[new Date().getDay()] | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | initData () { | 
|---|
|  |  |  | this.initEchart1() | 
|---|
|  |  |  | this.initEchart2() | 
|---|
|  |  |  | this.initEchart3() | 
|---|
|  |  |  | this.initEchart4() | 
|---|
|  |  |  | initData() { | 
|---|
|  |  |  | this.getWorkHead() | 
|---|
|  |  |  | this.getWorkBody() | 
|---|
|  |  |  | this.getTaskList() | 
|---|
|  |  |  | this.getWarningList() | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | initEchart1 () { | 
|---|
|  |  |  | 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() { | 
|---|
|  |  |  | getWorkbenchData({ queryType: 2 }).then(res => { | 
|---|
|  |  |  | this.staticData = res || {} | 
|---|
|  |  |  | this.initEchart2() | 
|---|
|  |  |  | this.initEchart3() | 
|---|
|  |  |  | this.initEchart4() | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | getWorkHead() { | 
|---|
|  |  |  | getWorkbenchData({ queryType: 1 }).then(res => { | 
|---|
|  |  |  | this.headerData = res || {} | 
|---|
|  |  |  | 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.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 = { | 
|---|
|  |  |  | series: [ | 
|---|
|  |  |  | { | 
|---|
|  |  |  | 
|---|
|  |  |  | show: false | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | data: [ | 
|---|
|  |  |  | { value: 1048, name: 'Search Engine' }, | 
|---|
|  |  |  | { value: 735, name: 'Direct' }, | 
|---|
|  |  |  | { value: 580, name: 'Email' } | 
|---|
|  |  |  | { value: that.headerData.inParkVisitUserNum, name: '访客' }, | 
|---|
|  |  |  | { value: that.headerData.todayInParkUserNum - that.headerData.inParkVisitUserNum - that.headerData.inParkLwUserNum, name: '内部员工' }, | 
|---|
|  |  |  | { value: that.headerData.inParkLwUserNum, name: '长期相关方' } | 
|---|
|  |  |  | ] | 
|---|
|  |  |  | } | 
|---|
|  |  |  | ] | 
|---|
|  |  |  | 
|---|
|  |  |  | myChart.resize() | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | initEchart2 () { | 
|---|
|  |  |  | initEchart2() { | 
|---|
|  |  |  | const myChart = echarts.init(document.getElementById('echart2')) | 
|---|
|  |  |  | let that = this | 
|---|
|  |  |  | myChart.setOption({ | 
|---|
|  |  |  | grid: { | 
|---|
|  |  |  | top: '4%', | 
|---|
|  |  |  | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | 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: { | 
|---|
|  |  |  | 
|---|
|  |  |  | { offset: 1, color: '#407ff0' } | 
|---|
|  |  |  | ] | 
|---|
|  |  |  | ), | 
|---|
|  |  |  | barBorderRadius: [0, 10, 10, 0] | 
|---|
|  |  |  | // barBorderRadius: [0, 10, 10, 0] | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | myChart.resize() | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | initEchart3 () { | 
|---|
|  |  |  | initEchart3() { | 
|---|
|  |  |  | const myChart = echarts.init(document.getElementById('echart3')) | 
|---|
|  |  |  | let that = this | 
|---|
|  |  |  | myChart.setOption({ | 
|---|
|  |  |  | tooltip: { | 
|---|
|  |  |  | trigger: 'axis', | 
|---|
|  |  |  | 
|---|
|  |  |  | xAxis: { | 
|---|
|  |  |  | type: 'category', | 
|---|
|  |  |  | boundaryGap: false, | 
|---|
|  |  |  | data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] | 
|---|
|  |  |  | data: that.staticData.weekVisitList.map(i => i.name) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | yAxis: { | 
|---|
|  |  |  | type: 'value', | 
|---|
|  |  |  | 
|---|
|  |  |  | 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: { | 
|---|
|  |  |  | 
|---|
|  |  |  | symbol: 'circle', | 
|---|
|  |  |  | symbolSize: 10, | 
|---|
|  |  |  | itemStyle: { | 
|---|
|  |  |  | normal: { | 
|---|
|  |  |  | color: '#207FF7' // 折线点的颜色 | 
|---|
|  |  |  | } | 
|---|
|  |  |  | borderWidth: 1, | 
|---|
|  |  |  | borderColor: '#fff', | 
|---|
|  |  |  | color: '#207FF7' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | smooth: false | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | myChart.resize() | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | initEchart4 () { | 
|---|
|  |  |  | initEchart4() { | 
|---|
|  |  |  | const myChart = echarts.init(document.getElementById('echart4')) | 
|---|
|  |  |  | let that = this | 
|---|
|  |  |  | myChart.setOption({ | 
|---|
|  |  |  | tooltip: { | 
|---|
|  |  |  | trigger: 'axis', | 
|---|
|  |  |  | 
|---|
|  |  |  | xAxis: { | 
|---|
|  |  |  | type: 'category', | 
|---|
|  |  |  | boundaryGap: false, | 
|---|
|  |  |  | data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] | 
|---|
|  |  |  | data: that.staticData.weekCarList.map(i => i.name) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | yAxis: { | 
|---|
|  |  |  | type: 'value', | 
|---|
|  |  |  | 
|---|
|  |  |  | 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: { | 
|---|
|  |  |  | 
|---|
|  |  |  | symbol: 'circle', | 
|---|
|  |  |  | symbolSize: 10, | 
|---|
|  |  |  | itemStyle: { | 
|---|
|  |  |  | normal: { | 
|---|
|  |  |  | color: '#42D49D' // 折线点的颜色 | 
|---|
|  |  |  | } | 
|---|
|  |  |  | borderWidth: 1, | 
|---|
|  |  |  | borderColor: '#fff', | 
|---|
|  |  |  | color: '#42D49D' // 折线点的颜色 | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | smooth: false | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | 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; | 
|---|
|  |  |  | 
|---|
|  |  |  | 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; | 
|---|
|  |  |  | 
|---|
|  |  |  | 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; | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .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; | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .app_side { | 
|---|
|  |  |  | width: 408px; | 
|---|
|  |  |  | margin-left: 10px; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .task { | 
|---|
|  |  |  | background: #fff; | 
|---|
|  |  |  | border-radius: 2px; | 
|---|
|  |  |  | 
|---|
|  |  |  | padding: 20px; | 
|---|
|  |  |  | height: 346px; | 
|---|
|  |  |  | margin-bottom: 10px; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .header { | 
|---|
|  |  |  | .num { | 
|---|
|  |  |  | position: relative; | 
|---|
|  |  |  | 
|---|
|  |  |  | 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; | 
|---|
|  |  |  | 
|---|
|  |  |  | 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; | 
|---|
|  |  |  | 
|---|
|  |  |  | border-radius: 8px; | 
|---|
|  |  |  | margin-left: 13px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .more { | 
|---|
|  |  |  | font-size: 13px; | 
|---|
|  |  |  | color: #999999; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .list { | 
|---|
|  |  |  | padding-top: 6px; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .item { | 
|---|
|  |  |  | margin-top: 10px; | 
|---|
|  |  |  | padding: 15px; | 
|---|
|  |  |  | 
|---|
|  |  |  | 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; | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .more{ | 
|---|
|  |  |  | cursor: pointer; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .empty { | 
|---|
|  |  |  | height: 300px; | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | justify-content: center; | 
|---|
|  |  |  | align-items: center; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | img { | 
|---|
|  |  |  | width: 140px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .static_wrap { | 
|---|
|  |  |  | .wrap { | 
|---|
|  |  |  | background: #fff; | 
|---|
|  |  |  | 
|---|
|  |  |  | 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; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .echart_wrap { | 
|---|
|  |  |  | position: relative; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .pie_text { | 
|---|
|  |  |  | position: absolute; | 
|---|
|  |  |  | left: 50%; | 
|---|
|  |  |  | 
|---|
|  |  |  | 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; | 
|---|
|  |  |  | 
|---|
|  |  |  | margin-right: 6px; | 
|---|
|  |  |  | background: linear-gradient(270deg, #29aeff 0%, #207ff7 100%); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .text { | 
|---|
|  |  |  | margin-right: 6px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .main_home { | 
|---|
|  |  |  | background: #f4f7fc; | 
|---|
|  |  |  | position: relative; | 
|---|
|  |  |  | 
|---|
|  |  |  | overflow: auto; | 
|---|
|  |  |  | padding: 20px; | 
|---|
|  |  |  | padding-top: 92px; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .home_header { | 
|---|
|  |  |  | position: absolute; | 
|---|
|  |  |  | top: 0; | 
|---|