| | |
| | | "safer-buffer": "^2.1.0" |
| | | } |
| | | }, |
| | | "echarts": { |
| | | "version": "5.6.0", |
| | | "resolved": "https://registry.npmmirror.com/echarts/-/echarts-5.6.0.tgz", |
| | | "integrity": "sha512-oTbVTsXfKuEhxftHqL5xprgLoc0k7uScAwtryCgWF6hPYFLRwOUHiFmHGCBKP5NPFNkDVopOieyUqYGH8Fa3kA==", |
| | | "requires": { |
| | | "tslib": "2.3.0", |
| | | "zrender": "5.6.1" |
| | | }, |
| | | "dependencies": { |
| | | "tslib": { |
| | | "version": "2.3.0", |
| | | "resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz", |
| | | "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==" |
| | | } |
| | | } |
| | | }, |
| | | "ee-first": { |
| | | "version": "1.1.1", |
| | | "resolved": "https://registry.npm.taobao.org/ee-first/download/ee-first-1.1.1.tgz", |
| | |
| | | "dev": true |
| | | } |
| | | } |
| | | }, |
| | | "zrender": { |
| | | "version": "5.6.1", |
| | | "resolved": "https://registry.npmmirror.com/zrender/-/zrender-5.6.1.tgz", |
| | | "integrity": "sha512-OFXkDJKcrlx5su2XbzJvj/34Q3m6PvyCZkVPHGYpcCJ52ek4U/ymZyfuV1nKE23AyBJ51E/6Yr0mhZ7xGTO4ag==", |
| | | "requires": { |
| | | "tslib": "2.3.0" |
| | | }, |
| | | "dependencies": { |
| | | "tslib": { |
| | | "version": "2.3.0", |
| | | "resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz", |
| | | "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==" |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | |
| | | "core-js": "^3.6.5", |
| | | "crypto-js": "^4.1.1", |
| | | "dayjs": "^1.11.0", |
| | | "echarts": "^5.6.0", |
| | | "element-ui": "^2.3.6", |
| | | "js-cookie": "^2.2.1", |
| | | "js-file-download": "^0.4.12", |
| | |
| | | <meta charset="utf-8"> |
| | | <meta http-equiv="X-UA-Compatible" content="IE=edge"> |
| | | <meta name="viewport" content="width=device-width,initial-scale=1.0"> |
| | | <link rel="icon" href="<%= BASE_URL %>favicon.ico"> |
| | | <link rel="icon" href="<%= BASE_URL %>icon.png"> |
| | | <title>èåå©åäºä»¶ä¸æ¥ç³»ç»</title> |
| | | </head> |
| | | <body> |
| | | <noscript> |
| | | <strong>We're sorry but æ±èçé¡¹ç® doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> |
| | | </noscript> |
| | | <div id="app"></div> |
| | | <!-- built files will be auto injected --> |
| | | </body> |
| | |
| | | .el-image-viewer__wrapper{ |
| | | z-index: 3000 !important; |
| | | } |
| | | .statusInfo0{color: #186acf} |
| | | .statusInfo1{color: #cf3a18 |
| | | } |
| | | .statusInfo2{color: #cf3a18} |
| | | .statusInfo3{color: #157713 |
| | | } |
| | | .statusInfo4{color: #157713} |
| | | .statusInfo5{color: #157713} |
| | | .statusInfo6{color: #cf3a18 |
| | | } |
| | |
| | | <div class="company"> |
| | | åå·¥ï¼<span> {{ item.userName }} / {{item.companyName}}</span> |
| | | <div style="display: block" >æ¶é´ï¼<span>{{item.createDate}}</span></div> |
| | | <div class="dealinfo"> |
| | | <div class="dealinfo" v-if="item.param2||item.remark||(item.multifileList !=null && item.multifileList.length)"> |
| | | <div style="display: block" v-if="item.param2" >å¤ç人ï¼<span>{{item.param2}}</span></div> |
| | | <div style="display: block" v-if="item.remark" >说æï¼<span>{{item.remark}}</span></div> |
| | | <div style="display: block;margin-top:10px" v-if="item.multifileList !=null && item.multifileList.length"> |
| | |
| | | src="@/assets/task/bg_shenhe_pass@2x.png" alt=""> |
| | | <img v-else class="head_bg" src="@/assets/task/bg_shenhe@2x.png" alt=""> |
| | | <div class="left"> |
| | | <div class="h1">{{ cateList[type] }}</div> |
| | | <div class="h1">ä¸ç¬¦å项ï¼{{ info.problemTitle }}</div> |
| | | <div class="time">æäº¤æ¶é´ï¼{{ info.createDate }}</div> |
| | | </div> |
| | | <div class="right" :class="{ scs: info.status == '3' || info.status == '4' || info.status == '5', msg: info.status == '6' }">{{statusMap[info.status] }}</div> |
| | |
| | | <div class="title">å·¥åä¿¡æ¯</div> |
| | | <div class="list"> |
| | | <div class="item"> |
| | | <div class="label">è§å¯ä¸»é¢</div> |
| | | <div class="value">{{ info.typeName }} / {{info.categoryName}}</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">åå·¥å§å</div> |
| | | <div class="value">{{ info.memberName }} - {{ info.memberPhone || '[æ ææºå·]' }}</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">æå±é¨é¨</div> |
| | | <div class="value">{{ info.companyName }} </div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">åçå°ç¹</div> |
| | | <div class="value">{{ info.locationName }}</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">䏿¥æ¶é´</div> |
| | |
| | | <div class="value">{{ info.happenTime}}</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">é£é©ç±»å</div> |
| | | <div class="value">{{ info.typeName }}</div> |
| | | <div class="label">éç¥äºº</div> |
| | | <div class="value">{{ info.memberNames }}</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">åçå°ç¹</div> |
| | | <div class="value">{{ info.locationName }}</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">é£é©æè¿°</div> |
| | | <div class="value">{{ info.riskInfo }}</div> |
| | | <div class="item" style="width: 100%"> |
| | | <div class="label">ä¸ç¬¦ååå </div> |
| | | <div class="value" style="color: red">{{ info.eventInfo }}</div> |
| | | </div> |
| | | <div class="item" style="width: 100%"> |
| | | <div class="label">å¾ç</div> |
| | |
| | | <div class="company"> |
| | | åå·¥ï¼<span> {{ item.userName }} / {{item.companyName}}</span> |
| | | <div style="display: block" >æ¶é´ï¼<span>{{item.createDate}}</span></div> |
| | | <div class="dealinfo"> |
| | | <div class="dealinfo" v-if="item.param2||item.remark||(item.multifileList !=null && item.multifileList.length)"> |
| | | <div style="display: block" v-if="item.param2" >å¤ç人ï¼<span>{{item.param2}}</span></div> |
| | | <div style="display: block" v-if="item.remark" >说æï¼<span>{{item.remark}}</span></div> |
| | | <div style="display: block;margin-top:10px" v-if="item.multifileList !=null && item.multifileList.length"> |
| | |
| | | <div class="value">{{ info.companyName }} </div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">è§å¯ä¸»é¢</div> |
| | | <div class="value">{{ info.typeName }}</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">䏿¥æ¶é´</div> |
| | | <div class="value">{{ info.submitDate }}</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">åçæ¶é´</div> |
| | | <div class="value">{{ info.happenTime}}</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">è§å¯ä¸»é¢</div> |
| | | <div class="value">{{ info.typeName }}</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="label">åçå°ç¹</div> |
| | |
| | | <div class="table_info"> |
| | | <div class="title">ä¸ç¬¦å项工åå表</div> |
| | | <el-table :data="info.dcaChildList" border fit> |
| | | <el-table-column label="ä¸çº§ä¸»é¢" prop="typeName" min-width="150"> </el-table-column> |
| | | <el-table-column label="äºçº§ä¸»é¢" prop="categoryName" min-width="150"> </el-table-column> |
| | | <el-table-column label="è§å¯é¡¹" prop="problemTitle" min-width="150"> </el-table-column> |
| | | <el-table-column label="å·¥åå·" prop="code" min-width="100"> |
| | | <template slot-scope="{row}"> |
| | | <span style="color: #2E68EC;cursor: pointer" @click="$refs.OperaWorkorderDetailDcaInfoWindow.open('DCAä¸ç¬¦å项工å详æ
', row)" >{{ row.code || '-'}}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="ä¸çº§ä¸»é¢" prop="typeName" min-width="60"> </el-table-column> |
| | | <el-table-column label="äºçº§ä¸»é¢" prop="categoryName" min-width="60"> </el-table-column> |
| | | <el-table-column label="è§å¯é¡¹" prop="problemTitle" min-width="100"> </el-table-column> |
| | | <el-table-column label="ä¸ç¬¦ååå " prop="eventInfo" min-width="120" /> |
| | | <el-table-column label="å¤çç¶æ" prop="status" min-width="80"> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.status ==0">å¾
å¤ç</span> |
| | | <span v-else-if="row.status ==3 ||row.status ==4||row.status ==5">å·²å¤ç</span> |
| | | <span v-else>å¤çä¸</span> |
| | | <span :class="'statusInfo'+row.status" v-if="row.status ==0">å¾
å¤ç</span> |
| | | <span :class="'statusInfo'+row.status" v-else-if="row.status ==3 ||row.status ==4||row.status ==5">å·²å¤ç</span> |
| | | <span :class="'statusInfo'+row.status" v-else>å¤çä¸</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="æä½" prop="status" min-width="80"> |
| | |
| | | {{title}} |
| | | </h2> |
| | | <div class="user"> |
| | | <el-dropdown trigger="click"> |
| | | <span class="el-dropdown-link"> |
| | | <el-dropdown trigger="click"> |
| | | <span class="el-dropdown-link" style="color: white"> |
| | | <img v-if="userInfo != null" :src="userInfo.avatar == null ? '@/assets/images/avatar/man.png' : userInfo.avatar" alt="">{{userInfo | displayName}}<i class="el-icon-arrow-down el-icon--right"></i> |
| | | </span> |
| | | <el-dropdown-menu slot="dropdown"> |
| | |
| | | .header { |
| | | overflow: hidden; |
| | | padding: 0 25px; |
| | | background: #fff; |
| | | background: #0c6ce3; |
| | | height: 100%; |
| | | display: flex; |
| | | h2 { |
| | |
| | | line-height: $header-height; |
| | | font-size: 19px; |
| | | font-weight: 600; |
| | | color: #606263; |
| | | color: white; |
| | | display: inline; |
| | | & > i { |
| | | font-size: 20px; |
| | |
| | | .user { |
| | | width: 50%; |
| | | flex-shrink: 0; |
| | | color: white; |
| | | text-align: right; |
| | | .el-dropdown { |
| | | top: 2px; |
| | |
| | | <template> |
| | | <div class="menu" :class="{collapse: menuData.collapse}"> |
| | | <div class="logo"> |
| | | <!-- <div><img src="@/assets/logo.png"></div>--> |
| | | <div><img src="@/assets/logo.png"></div> |
| | | <h1 :class="{hidden: menuData.collapse}">èåå©åäºä»¶ä¸æ¥ç³»ç»</h1> |
| | | </div> |
| | | <scrollbar> |
¶Ô±ÈÐÂÎļþ |
| | |
| | | export const weeks = ['æææ¥', 'ææä¸', 'ææäº', 'ææä¸', 'ææå', 'ææäº', 'ææå
'] |
| | |
| | | <el-table-column prop="companyName" label="æå¨é¨é¨" min-width="100px"></el-table-column> |
| | | <el-table-column prop="status" label="ç¶æ" min-width="100px"> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.status ==0">å¾
å¤ç</span> |
| | | <span v-else-if="row.status ==3 ||row.status ==4||row.status ==5">å·²å¤ç</span> |
| | | <span v-else>å¤çä¸</span> |
| | | <span :class="'statusInfo'+row.status" v-if="row.status ==0">å¾
å¤ç</span> |
| | | <span :class="'statusInfo'+row.status" v-else-if="row.status ==3 ||row.status ==4||row.status ==5">å·²å¤ç</span> |
| | | <span :class="'statusInfo'+row.status" v-else>å¤çä¸</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="submitDate" label="䏿¥æ¶é´" min-width="150px"></el-table-column> |
| | |
| | | <div slot="search-form"> |
| | | <el-form ref="searchForm" :model="searchForm" label-width="100px" inline> |
| | | <el-form-item label="é£é©ç±»å" prop="typeId"> |
| | | <el-select v-model="searchForm.typeId"> |
| | | <el-select v-model="searchForm.typeId" @change="search"> |
| | | <el-option clearable filterable |
| | | v-for="item in categorys" |
| | | :key="item.id" |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="companyName" label="æå¨é¨é¨" min-width="100px"></el-table-column> |
| | | <el-table-column prop="status" label="ç¶æ" min-width="100px"> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.status ==0">å¾
å¤ç</span> |
| | | <span v-else-if="row.status ==3 ||row.status ==4||row.status ==5">å·²å¤ç</span> |
| | | <span v-else>å¤çä¸</span> |
| | | </template> |
| | | </el-table-column> |
| | | <!-- |
| | | <el-table-column prop="typeName" label="DCAç±»å" min-width="100px"></el-table-column> |
| | | --> |
| | | <el-table-column prop="typeName" label="è§å¯ä¸»é¢" min-width="150px"></el-table-column> |
| | | <el-table-column prop="dcaYesNum" label="è§å¯é¡¹ç»è®¡" min-width="150px"> |
| | | <template slot-scope="{row}"> |
| | | <span style="color: #1562e2" >符åï¼{{row.dcaYesNum}} ä¸ç¬¦åï¼{{row.dcaNoNum}}</span> |
| | | <span style="color: #1562e2" >符åï¼{{row.dcaYesNum}} ï¼ä¸ç¬¦åï¼<span style="color:red;">{{row.dcaNoNum}}</span> </span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="submitDate" label="䏿¥æ¶é´" min-width="150px"></el-table-column> |
| | |
| | | </el-form-item> |
| | | <el-form-item label="䏿¥äººå" prop="memberName"> |
| | | <el-input v-model="searchForm.memberName" clearable placeholder="人åå§åæææºå·" @keypress.enter.native="search"></el-input> |
| | | |
| | | |
| | | </el-form-item> |
| | | <el-form-item label="å·¥åå·" prop="code"> |
| | | <el-input v-model="searchForm.code" clearable placeholder="请è¾å
¥å·¥åå·" @keypress.enter.native="search"></el-input> |
| | |
| | | <el-table-column prop="submitDate" label="䏿¥æ¶é´" min-width="150px"></el-table-column> |
| | | <el-table-column prop="status" label="ç¶æ" min-width="100px"> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.status ==0">å¾
å¤ç</span> |
| | | <span v-else-if="row.status ==3 ||row.status ==4||row.status ==5">å·²å¤ç</span> |
| | | <span v-else>å¤çä¸</span> |
| | | <span :class="'statusInfo'+row.status" v-if="row.status ==0">å¾
å¤ç</span> |
| | | <span :class="'statusInfo'+row.status" v-else-if="row.status ==3 ||row.status ==4||row.status ==5">å·²å¤ç</span> |
| | | <span :class="'statusInfo'+row.status" v-else>å¤çä¸</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="memberName" label="䏿¥äººå" min-width="100px"> |
| | |
| | | <template> |
| | | <div class="home"> |
| | | <div class="wrap"> |
| | | <div class="main_home"> |
| | | <!-- <div style="position: fixed;z-index: 99999"><video style="height: 100px;width: 500px" src="rtsp://10.50.250.253:554/openUrl/K2y2vE4" controls></video></div> --> |
| | | <div class="home_header" style="text-align: center"> |
| | | <div class="mb10 fs17">ä¸å好ï¼{{ userInfo.realname }}</div> |
| | | <div class="fs13"> |
| | | ä»å¤©æ¯ {{ nowDate }} {{ nowWeek }}ï¼æ¬¢è¿è®¿é®èåå©åäºä»¶ä¸æ¥ç³»ç»ç®¡çå¹³å° |
| | | </div> |
| | | </div> |
| | | <!-- <div class="main"> |
| | | <div class="app_content"> |
| | | <div class="static_card"> |
| | | <div class="card"> |
| | | <div class="header"> |
| | | <div class="left"> |
| | | <div class="fs15">仿¥å¨å人æ°(人)</div> |
| | | <div class="num">{{ headerData.todayInParkUserNum }}</div> |
| | | </div> |
| | | <img src="@/assets/icons/home_icon1.png" alt="" /> |
| | | </div> |
| | | <div class="content"> |
| | | <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">{{ headerData.inParkVisitUserNum }}</div> |
| | | </div> |
| | | <img src="@/assets/icons/home_icon2.png" alt="" /> |
| | | </div> |
| | | <div class="content"> |
| | | <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">{{ headerData.inParkLwUserNum }}</div> |
| | | </div> |
| | | <img src="@/assets/icons/home_icon3.png" alt="" /> |
| | | </div> |
| | | <div class="content"> |
| | | <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">{{ headerData.todayInParkCarNum }}</div> |
| | | </div> |
| | | <img src="@/assets/icons/home_icon4.png" alt="" /> |
| | | </div> |
| | | <div class="content"> |
| | | <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" @click="funcClick(item)" :key="item.name" class="item"> |
| | | <img class="mb10" :src="item.url" alt="" /> |
| | | <div>{{ item.name }}</div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="static_wrap"> |
| | | <div class="df mb10"> |
| | | <div class="wrap static1"> |
| | | <div class="header"> |
| | | <div class="home_title">å¨åºäººåå æ¯</div> |
| | | <!– <div class="df_ac more"> |
| | | æ´å¤<i class="el-icon-arrow-right"></i> |
| | | </div> –> |
| | | </div> |
| | | <div class="content"> |
| | | <div class="echart_wrap"> |
| | | <div class="pie_text"> |
| | | <div class="fs13">æ»æ°</div> |
| | | <div class="fs15"><strong>{{ headerData.todayInParkUserNum }}</strong></div> |
| | | </div> |
| | | <div class="echart" id="echart1"></div> |
| | | </div> |
| | | <div class="list"> |
| | | <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> |
| | | </div> |
| | | <div class="wrap static2"> |
| | | <div class="header"> |
| | | <div class="home_title">é¿æç¸å
³æ¹åå¸</div> |
| | | <!– <div class="df_ac more"> |
| | | æ´å¤<i class="el-icon-arrow-right"></i> |
| | | </div> –> |
| | | </div> |
| | | <div class="echart" id="echart2"></div> |
| | | </div> |
| | | </div> |
| | | <div class="df"> |
| | | <div class="wrap static3"> |
| | | <div class="header"> |
| | | <div class="home_title">7æ¥è®¿å®¢ç»è®¡</div> |
| | | <!– <div class="df_ac more"> |
| | | æ´å¤<i class="el-icon-arrow-right"></i> |
| | | </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"> |
| | | æ´å¤<i class="el-icon-arrow-right"></i> |
| | | </div> –> |
| | | </div> |
| | | <div class="echart" id="echart4"></div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="app_side"> |
| | | <div class="task"> |
| | | <div class="header df_sb"> |
| | | <div class="home_title df"> |
| | | <span >å¾
åäºé¡¹</span> |
| | | <span class="num" v-if="taskTotal">{{ taskTotal }}</span> |
| | | </div> |
| | | <div class="df_ac more" @click="jumpPage('/task/index')"> |
| | | æ´å¤<i class="el-icon-arrow-right"></i> |
| | | </div> |
| | | </div> |
| | | <div class="list"> |
| | | <div class="item" v-for="item in taskList" :key="item.id"> |
| | | <div class="content"> |
| | | <div class="title">{{ item.title }}</div> |
| | | <div class="time">{{ item.createDate }}</div> |
| | | </div> |
| | | <div class="btn" v-permissions="['business:staging:query']" @click="handleDetail(item)">å¤ç</div> |
| | | </div> |
| | | <div v-if="taskList.length == 0" class="empty"> |
| | | <img src="@/assets/images/default_homeimg.png" alt=""> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="warnning"> |
| | | <div class="header df_sb"> |
| | | <div class="home_title df"> |
| | | <span>è¶
æ¶é¢è¦</span> |
| | | <span class="num" v-if="warningTotal">{{ warningTotal }}</span> |
| | | </div> |
| | | <div class="df_ac more" @click="jumpPage('/business/strandedPersonnel')"> |
| | | æ´å¤<i class="el-icon-arrow-right"></i> |
| | | </div> |
| | | </div> |
| | | <div class="list"> |
| | | <div class="item" v-for="item in warningList" :key="item.id"> |
| | | <div class="name_wrap df_sb"> |
| | | <div class="name">{{ item.name }}</div> |
| | | <div class="identity">访客</div> |
| | | </div> |
| | | <div class="line">èç³»çµè¯ï¼{{ item.phone }}</div> |
| | | <div class="line">访客å
¬å¸ï¼{{ item.companyName }}</div> |
| | | <div class="auth df_sb"> |
| | | <div class="time">æææéï¼{{ item.endtime }}</div> |
| | | <div class="btn" @click="departure(item.id)">离åº</div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div v-if="warningList.length == 0" class="empty"> |
| | | <img src="@/assets/images/default_homeimg.png" alt=""> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div>--> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import dayjs from 'dayjs' |
| | | import * as echarts from 'echarts' |
| | | import { weeks } from '@/utils/config' |
| | | const colors = ['#52a4f7', '#7678f7', '#5fc6d5'] |
| | | export default { |
| | | name: 'Index', |
| | | components: { |
| | | }, |
| | | data () { |
| | | return {} |
| | | return { |
| | | colors, |
| | | nowDate: '', |
| | | nowWeek: '', |
| | | headerData: {}, |
| | | staticData: {}, |
| | | manningRatio: [], |
| | | taskList: [], |
| | | taskTotal: 0, |
| | | warningList: [], |
| | | warningTotal: 0, |
| | | funcList: [ |
| | | { 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 () { |
| | | return this.$store.state.userInfo |
| | | } |
| | | }, |
| | | created () { |
| | | }, |
| | | mounted () { |
| | | // this.initData() |
| | | }, |
| | | methods: { |
| | | 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å¹´MæDæ¥') |
| | | this.nowWeek = weeks[new Date().getDay()] |
| | | }, |
| | | 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 () { |
| | | 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', |
| | | radius: ['42%', '90%'], |
| | | label: { |
| | | show: false, |
| | | position: 'center' |
| | | }, |
| | | color: colors, |
| | | labelLine: { |
| | | show: false |
| | | }, |
| | | 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: 'é¿æç¸å
³æ¹' } |
| | | // ] |
| | | } |
| | | ] |
| | | } |
| | | myChart.setOption(option) |
| | | window.addEventListener('resize', function () { // æ§è¡ |
| | | myChart.resize() |
| | | }) |
| | | }, |
| | | initEchart2 () { |
| | | const myChart = echarts.init(document.getElementById('echart2')) |
| | | const that = this |
| | | myChart.setOption({ |
| | | grid: { |
| | | top: '4%', |
| | | left: '2%', |
| | | right: '6%', |
| | | bottom: '2%', |
| | | containLabel: true |
| | | }, |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'line' |
| | | } |
| | | }, |
| | | xAxis: { |
| | | type: 'value', |
| | | position: 'bottom', |
| | | splitLine: { |
| | | show: true, |
| | | lineStyle: { |
| | | // è¿éè¾å
¥çº¿æ¡çæ ·å¼ |
| | | color: 'rgba(255,255,255,0.14)' |
| | | } |
| | | } |
| | | }, |
| | | yAxis: { |
| | | type: 'category', |
| | | data: that.staticData.lwList.map(i => i.name) |
| | | }, |
| | | series: [ |
| | | { |
| | | data: that.staticData.lwList.map(i => i.num), |
| | | type: 'bar', |
| | | barWidth: 10, |
| | | itemStyle: { |
| | | normal: { |
| | | color: new echarts.graphic.LinearGradient( |
| | | 1, 0, 0, 0, |
| | | [ |
| | | { offset: 0, color: '#56abf8' }, |
| | | { offset: 1, color: '#407ff0' } |
| | | ] |
| | | ) |
| | | // barBorderRadius: [0, 10, 10, 0] |
| | | } |
| | | } |
| | | } |
| | | ] |
| | | }) |
| | | window.addEventListener('resize', function () { // æ§è¡ |
| | | myChart.resize() |
| | | }) |
| | | }, |
| | | initEchart3 () { |
| | | const myChart = echarts.init(document.getElementById('echart3')) |
| | | const that = this |
| | | myChart.setOption({ |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'line' |
| | | }, |
| | | 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 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> |
| | | ` |
| | | } |
| | | }, |
| | | xAxis: { |
| | | type: 'category', |
| | | boundaryGap: false, |
| | | data: that.staticData.weekVisitList.map(i => i.name) |
| | | }, |
| | | yAxis: { |
| | | type: 'value', |
| | | name: '人æ°', |
| | | nameTextStyle: { |
| | | padding: [0, 0, 4, -30] // å个æ°ååå«ä¸ºä¸å³ä¸å·¦ä¸åä½ç½®è·ç¦» |
| | | }, |
| | | splitLine: { |
| | | show: true, |
| | | lineStyle: { |
| | | // è¿éè¾å
¥çº¿æ¡çæ ·å¼ |
| | | color: 'rgba(255,255,255,0.14)' |
| | | } |
| | | } |
| | | }, |
| | | grid: { |
| | | top: '16%', |
| | | left: '2%', |
| | | right: '8%', |
| | | bottom: '2%', |
| | | containLabel: true |
| | | }, |
| | | series: [ |
| | | { |
| | | data: that.staticData.weekVisitList.map(i => i.num), |
| | | type: 'line', |
| | | areaStyle: { |
| | | normal: { |
| | | color: { |
| | | x: 0, |
| | | y: 0, |
| | | x2: 0, |
| | | y2: 1, |
| | | colorStops: [{ |
| | | offset: 0, |
| | | color: '#207FF7' // 0% å¤çé¢è² |
| | | }, { |
| | | offset: 1, |
| | | color: 'rgba(255,255,255,.2)' // 100% å¤çé¢è² |
| | | }], |
| | | globalCoord: false // 缺ç为 false |
| | | } |
| | | } |
| | | }, |
| | | lineStyle: { // çº¿æ¡æ ·å¼ |
| | | color: { |
| | | type: 'linear', |
| | | x: 0, |
| | | y: 0, |
| | | x2: 0, |
| | | y2: 1, |
| | | colorStops: [{ |
| | | offset: 0, color: '#207FF7' // 0% å¤çé¢è² |
| | | }, { |
| | | offset: 1, color: '#207FF7' // 100% å¤çé¢è² |
| | | }] |
| | | }, |
| | | width: 2 // 线æ¡ç²ç» |
| | | }, |
| | | symbol: 'circle', |
| | | symbolSize: 10, |
| | | itemStyle: { |
| | | borderWidth: 1, |
| | | borderColor: '#fff', |
| | | color: '#207FF7' |
| | | }, |
| | | smooth: false |
| | | } |
| | | ] |
| | | }) |
| | | window.addEventListener('resize', function () { // æ§è¡ |
| | | myChart.resize() |
| | | }) |
| | | }, |
| | | initEchart4 () { |
| | | const myChart = echarts.init(document.getElementById('echart4')) |
| | | const that = this |
| | | myChart.setOption({ |
| | | tooltip: { |
| | | trigger: 'axis', |
| | | axisPointer: { |
| | | type: 'line' |
| | | }, |
| | | 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 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> |
| | | ` |
| | | } |
| | | }, |
| | | xAxis: { |
| | | type: 'category', |
| | | boundaryGap: false, |
| | | data: that.staticData.weekCarList.map(i => i.name) |
| | | }, |
| | | yAxis: { |
| | | type: 'value', |
| | | name: 'è½¦è¾æ°', |
| | | nameTextStyle: { |
| | | padding: [0, 0, 4, -30] // å个æ°ååå«ä¸ºä¸å³ä¸å·¦ä¸åä½ç½®è·ç¦» |
| | | }, |
| | | splitLine: { |
| | | show: true, |
| | | lineStyle: { |
| | | // è¿éè¾å
¥çº¿æ¡çæ ·å¼ |
| | | color: 'rgba(255,255,255,0.14)' |
| | | } |
| | | } |
| | | }, |
| | | grid: { |
| | | top: '16%', |
| | | left: '2%', |
| | | right: '8%', |
| | | bottom: '4%', |
| | | containLabel: true |
| | | }, |
| | | series: [ |
| | | { |
| | | data: that.staticData.weekCarList.map(i => i.num), |
| | | type: 'line', |
| | | areaStyle: { |
| | | normal: { |
| | | color: { |
| | | x: 0, |
| | | y: 0, |
| | | x2: 0, |
| | | y2: 1, |
| | | colorStops: [{ |
| | | offset: 0, |
| | | color: '#42D49D' // 0% å¤çé¢è² |
| | | }, { |
| | | offset: 1, |
| | | color: 'rgba(255,255,255,.5)' // 100% å¤çé¢è² |
| | | }], |
| | | globalCoord: false // 缺ç为 false |
| | | } |
| | | } |
| | | }, |
| | | lineStyle: { // çº¿æ¡æ ·å¼ |
| | | color: { |
| | | type: 'linear', |
| | | x: 0, |
| | | y: 0, |
| | | x2: 0, |
| | | y2: 1, |
| | | colorStops: [{ |
| | | offset: 0, color: '#42D49D' // 0% å¤çé¢è² |
| | | }, { |
| | | offset: 1, color: '#42D49D' // 100% å¤çé¢è² |
| | | }] |
| | | }, |
| | | width: 2 // 线æ¡ç²ç» |
| | | }, |
| | | symbol: 'circle', |
| | | symbolSize: 10, |
| | | itemStyle: { |
| | | borderWidth: 1, |
| | | borderColor: '#fff', |
| | | color: '#42D49D' // æçº¿ç¹çé¢è² |
| | | }, |
| | | smooth: false |
| | | } |
| | | ] |
| | | }) |
| | | window.addEventListener('resize', function () { // æ§è¡ |
| | | myChart.resize() |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | @import "@/assets/style/variables.scss"; |
| | | .home { |
| | | text-align: center; |
| | | color: #777; |
| | | .wrap { |
| | | margin-top: 80px; |
| | | img { |
| | | width: 240px; |
| | | } |
| | | } |
| | | h2 { |
| | | font-size: 32px; |
| | | color: #555; |
| | | margin-bottom: 20px; |
| | | } |
| | | p { |
| | | line-height: 24px; |
| | | margin: 0; |
| | | } |
| | | .start-up { |
| | | margin-top: 8px; |
| | | } |
| | | .guide { |
| | | margin: 30px 0 40px 0; |
| | | display: flex; |
| | | justify-content: center; |
| | | a { |
| | | margin-right: 12px; |
| | | padding: 12px 40px; |
| | | border-radius: 30px; |
| | | background: $primary-color; |
| | | <style lang="scss" scoped> |
| | | 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; |
| | | text-decoration: none; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | |
| | | .card { |
| | | flex: 1; |
| | | height: 187px; |
| | | background: linear-gradient(270deg, #29aeff 0%, #207ff7 100%); |
| | | 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; |
| | | justify-content: space-between; |
| | | 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; |
| | | flex-direction: column; |
| | | justify-content: space-between; |
| | | font-size: 13px; |
| | | padding: 15px 20px 20px; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .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; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | em,a { |
| | | font-style: normal; |
| | | font-weight: bold; |
| | | margin: 0 3px; |
| | | color: $primary-color; |
| | | |
| | | .app_side { |
| | | width: 408px; |
| | | margin-left: 10px; |
| | | |
| | | .task { |
| | | background: #fff; |
| | | border-radius: 2px; |
| | | border: 1px solid #eeeeee; |
| | | padding: 20px; |
| | | height: 346px; |
| | | margin-bottom: 10px; |
| | | |
| | | .header { |
| | | .num { |
| | | position: relative; |
| | | top: 3px; |
| | | height: 16px; |
| | | line-height: 16px; |
| | | font-size: 12px; |
| | | color: #ffffff; |
| | | padding: 0 6px; |
| | | font-weight: 400; |
| | | background: red; |
| | | 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; |
| | | text-align: center; |
| | | height: 30px; |
| | | line-height: 30px; |
| | | background: #ffffff; |
| | | border-radius: 2px; |
| | | 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; |
| | | top: 3px; |
| | | height: 16px; |
| | | line-height: 16px; |
| | | font-size: 12px; |
| | | color: #ffffff; |
| | | padding: 0 6px; |
| | | font-weight: 400; |
| | | background: red; |
| | | border-radius: 8px; |
| | | margin-left: 13px; |
| | | } |
| | | |
| | | .more { |
| | | font-size: 13px; |
| | | color: #999999; |
| | | } |
| | | } |
| | | |
| | | .list { |
| | | padding-top: 6px; |
| | | |
| | | .item { |
| | | margin-top: 10px; |
| | | padding: 15px; |
| | | width: 100%; |
| | | 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 { |
| | | margin-left: 10px; |
| | | width: 58px; |
| | | text-align: center; |
| | | height: 30px; |
| | | cursor: pointer; |
| | | line-height: 30px; |
| | | background: #ffffff; |
| | | border-radius: 2px; |
| | | border: 1px solid #207ff7; |
| | | font-size: 13px; |
| | | color: #207ff7; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | .more { |
| | | cursor: pointer; |
| | | } |
| | | |
| | | .empty { |
| | | height: 300px; |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | |
| | | img { |
| | | width: 140px; |
| | | } |
| | | } |
| | | } |
| | | .award { |
| | | |
| | | .static_wrap { |
| | | .wrap { |
| | | background: #fff; |
| | | padding: 20px 20px 10px; |
| | | border-radius: 2px; |
| | | 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%; |
| | | top: 50%; |
| | | transform: translate(-50%, -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; |
| | | border-radius: 50%; |
| | | margin-right: 6px; |
| | | background: linear-gradient(270deg, #29aeff 0%, #207ff7 100%); |
| | | } |
| | | |
| | | .text { |
| | | margin-right: 6px; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | .main_home { |
| | | background: #f4f7fc; |
| | | position: relative; |
| | | width: 100%; |
| | | height: 100%; |
| | | overflow: auto; |
| | | padding: 92px 20px 20px; |
| | | .home_header { |
| | | position: absolute; |
| | | right: 20px; |
| | | bottom: 60px; |
| | | display: flex; |
| | | flex-direction: column; |
| | | text-align: left; |
| | | padding: 12px; |
| | | border: 1px solid #eee; |
| | | box-shadow: -1px 1px 10px #ccc; |
| | | h4 { |
| | | font-weight: bold; |
| | | margin-bottom: 8px; |
| | | } |
| | | img { |
| | | width: 160px; |
| | | margin-bottom: 20px; |
| | | transition: opacity ease .3s; |
| | | } |
| | | top: 0; |
| | | left: 0; |
| | | width: 100%; |
| | | height: 200px; |
| | | padding: 20px; |
| | | color: #fff; |
| | | background: linear-gradient(180deg, #0c6ce3 0%, rgba(32, 127, 247, 0) 100%); |
| | | } |
| | | } |
| | | </style> |
| | |
| | | display: flex; |
| | | width: 100%; |
| | | height: 100vh; |
| | | background-image: url("../assets/images/login.jpg"); |
| | | background-image: url("../assets/images/login.png"); |
| | | background-repeat: no-repeat; |
| | | background-size: auto 180%; |
| | | background-clip: content-box; |
| | |
| | | flex-direction: column; |
| | | justify-content: center; |
| | | h2 { |
| | | font-size:34px; |
| | | font-size:44px; |
| | | font-style: italic; |
| | | font-weight: 900; |
| | | margin-top: 50px; |
| | | margin-top: 0px; |
| | | } |
| | | h3 { |
| | | font-size: 49px; |
| | |
| | | |
| | | @Override |
| | | public List<Workorder> findList(Workorder pageWrap) { |
| | | |
| | | return workorderMapper.selectJoinList(Workorder.class,getJoinQueryMapper(pageWrap)); |
| | | } |
| | | |
| | | private MPJLambdaWrapper<Workorder> getJoinQueryMapper(Workorder pageWrap) { |
| | | MPJLambdaWrapper<Workorder> queryWrapper = new MPJLambdaWrapper<>(); |
| | | pageWrap.setIsdeleted(Constants.ZERO); |
| | | queryWrapper |
| | |
| | | .selectAs(Member::getName,Workorder::getMemberName) |
| | | .selectAs(Member::getCompanyName,Workorder::getCompanyName) |
| | | .selectAs(Member::getPhone,Workorder::getMemberPhone) |
| | | .select(" c2.name ",Workorder::getCategoryName) |
| | | .select(" c3.name ",Workorder::getTypeName) |
| | | .select(" c4.name ",Workorder::getProblemName) |
| | | .leftJoin(Member.class,Member::getId,Workorder::getMemberId) |
| | | .leftJoin(" category c3 on t.TYPE_ID = c3.id ") //é£é©ç±»å |
| | | .leftJoin(" category c4 on t.PROBLEM_ID = c4.id ") //DCAé®é¢ç¼ç |
| | | .leftJoin(" category c2 on t.CATEGORY_ID = c2.id ") //DCAä¸çº§é®é¢ç¼ç |
| | | .eq( pageWrap.getId() != null, Workorder::getId, pageWrap.getId()) |
| | | .eq( pageWrap.getCreator() != null, Workorder::getCreator, pageWrap.getCreator()) |
| | | .ge( pageWrap.getCreateDate() != null, Workorder::getCreateDate, Utils.Date.getStart( pageWrap.getCreateDate())) |
| | |
| | | .or().like(Member::getPhone, pageWrap.getMemberName()) ); |
| | | } |
| | | queryWrapper.orderByDesc(Workorder::getProblemId); |
| | | return workorderMapper.selectJoinList(Workorder.class,queryWrapper); |
| | | return queryWrapper; |
| | | } |
| | | |
| | | |
| | | @Override |
| | | public PageData<Workorder> findPage(PageWrap<Workorder> pageWrap) { |
| | | IPage<Workorder> page = new Page<>(pageWrap.getPage(), pageWrap.getCapacity()); |
| | | Utils.MP.blankToNull(pageWrap.getModel()); |
| | | MPJLambdaWrapper<Workorder> queryWrapper = new MPJLambdaWrapper<>(); |
| | | pageWrap.getModel().setIsdeleted(Constants.ZERO); |
| | | queryWrapper |
| | | .selectAll(Workorder.class) |
| | | .selectAs(Member::getName,Workorder::getMemberName) |
| | | .selectAs(Member::getCompanyName,Workorder::getCompanyName) |
| | | .selectAs(Member::getPhone,Workorder::getMemberPhone) |
| | | .select(" c2.name ",Workorder::getCategoryName) |
| | | .select(" c3.name ",Workorder::getTypeName) |
| | | .select(" c4.name ",Workorder::getProblemName) |
| | | .leftJoin(Member.class,Member::getId,Workorder::getMemberId) |
| | | .leftJoin(" category c3 on t.TYPE_ID = c3.id ") //é£é©ç±»å |
| | | .leftJoin(" category c4 on t.PROBLEM_ID = c4.id ") //DCAé®é¢ç¼ç |
| | | .leftJoin(" category c2 on t.CATEGORY_ID = c2.id ") //DCAé®é¢ç¼ç |
| | | .eq(pageWrap.getModel().getId() != null, Workorder::getId, pageWrap.getModel().getId()) |
| | | .eq(pageWrap.getModel().getCreator() != null, Workorder::getCreator, pageWrap.getModel().getCreator()) |
| | | .ge(pageWrap.getModel().getCreateDate() != null, Workorder::getCreateDate, Utils.Date.getStart(pageWrap.getModel().getCreateDate())) |
| | | .le(pageWrap.getModel().getCreateDate() != null, Workorder::getCreateDate, Utils.Date.getEnd(pageWrap.getModel().getCreateDate())) |
| | | .eq(pageWrap.getModel().getEditor() != null, Workorder::getEditor, pageWrap.getModel().getEditor()) |
| | | .ge(pageWrap.getModel().getEditDate() != null, Workorder::getEditDate, Utils.Date.getStart(pageWrap.getModel().getEditDate())) |
| | | .le(pageWrap.getModel().getEditDate() != null, Workorder::getEditDate, Utils.Date.getEnd(pageWrap.getModel().getEditDate())) |
| | | .eq(pageWrap.getModel().getIsdeleted() != null, Workorder::getIsdeleted, pageWrap.getModel().getIsdeleted()) |
| | | .eq(pageWrap.getModel().getCategoryId() != null, Workorder::getCategoryId, pageWrap.getModel().getCategoryId()) |
| | | .eq(pageWrap.getModel().getRemark() != null, Workorder::getRemark, pageWrap.getModel().getRemark()) |
| | | .eq(pageWrap.getModel().getStatus() != null, Workorder::getStatus, pageWrap.getModel().getStatus()) |
| | | .eq(pageWrap.getModel().getSortnum() != null, Workorder::getSortnum, pageWrap.getModel().getSortnum()) |
| | | .eq(pageWrap.getModel().getType() != null, Workorder::getType, pageWrap.getModel().getType()) |
| | | .eq(pageWrap.getModel().getMemberId() != null, Workorder::getMemberId, pageWrap.getModel().getMemberId()) |
| | | .eq(pageWrap.getModel().getCompanyId() != null, Workorder::getCompanyId, pageWrap.getModel().getCompanyId()) |
| | | .eq(pageWrap.getModel().getSubmitDate() != null, Workorder::getSubmitDate, pageWrap.getModel().getSubmitDate()) |
| | | .eq(pageWrap.getModel().getMemberType() != null, Workorder::getMemberType, pageWrap.getModel().getMemberType()) |
| | | .eq(pageWrap.getModel().getMemberQwids() != null, Workorder::getMemberQwids, pageWrap.getModel().getMemberQwids()) |
| | | .like(pageWrap.getModel().getMemberNames() != null, Workorder::getMemberNames, pageWrap.getModel().getMemberNames()) |
| | | .eq(pageWrap.getModel().getLocaltionId() != null, Workorder::getLocaltionId, pageWrap.getModel().getLocaltionId()) |
| | | .eq(pageWrap.getModel().getOutJiuyi() != null, Workorder::getOutJiuyi, pageWrap.getModel().getOutJiuyi()) |
| | | .eq(pageWrap.getModel().getIsYiwushi() != null, Workorder::getIsYiwushi, pageWrap.getModel().getIsYiwushi()) |
| | | .eq(pageWrap.getModel().getIsHurted() != null, Workorder::getIsHurted, pageWrap.getModel().getIsHurted()) |
| | | .eq(pageWrap.getModel().getWorkRelated() != null, Workorder::getWorkRelated, pageWrap.getModel().getWorkRelated()) |
| | | .eq(pageWrap.getModel().getEventInfo() != null, Workorder::getEventInfo, pageWrap.getModel().getEventInfo()) |
| | | .eq(pageWrap.getModel().getEmialMemberIds() != null, Workorder::getEmialMemberIds, pageWrap.getModel().getEmialMemberIds()) |
| | | .eq(pageWrap.getModel().getQwnoticeMemberIds() != null, Workorder::getQwnoticeMemberIds, pageWrap.getModel().getQwnoticeMemberIds()) |
| | | .eq(pageWrap.getModel().getHappenTime() != null, Workorder::getHappenTime, pageWrap.getModel().getHappenTime()) |
| | | .eq(pageWrap.getModel().getTypeId() != null, Workorder::getTypeId, pageWrap.getModel().getTypeId()) |
| | | .eq(pageWrap.getModel().getRiskInfo() != null, Workorder::getRiskInfo, pageWrap.getModel().getRiskInfo()) |
| | | .eq(pageWrap.getModel().getManagerId() != null, Workorder::getManagerId, pageWrap.getModel().getManagerId()) |
| | | .eq(pageWrap.getModel().getDealerId() != null, Workorder::getDealerId, pageWrap.getModel().getDealerId()) |
| | | .ge(pageWrap.getModel().getDispatchTime() != null, Workorder::getDispatchTime, Utils.Date.getStart(pageWrap.getModel().getDispatchTime())) |
| | | .le(pageWrap.getModel().getDispatchTime() != null, Workorder::getDispatchTime, Utils.Date.getEnd(pageWrap.getModel().getDispatchTime())) |
| | | .eq(pageWrap.getModel().getDispatchInfo() != null, Workorder::getDispatchInfo, pageWrap.getModel().getDispatchInfo()) |
| | | .ge(pageWrap.getModel().getDealTime() != null, Workorder::getDealTime, Utils.Date.getStart(pageWrap.getModel().getDealTime())) |
| | | .le(pageWrap.getModel().getDealTime() != null, Workorder::getDealTime, Utils.Date.getEnd(pageWrap.getModel().getDealTime())) |
| | | .eq(pageWrap.getModel().getDealInfo() != null, Workorder::getDealInfo, pageWrap.getModel().getDealInfo()) |
| | | .eq(pageWrap.getModel().getProblemTitle() != null, Workorder::getProblemTitle, pageWrap.getModel().getProblemTitle()) |
| | | .eq(pageWrap.getModel().getProblemId() != null, Workorder::getProblemId, pageWrap.getModel().getProblemId()) |
| | | .eq(pageWrap.getModel().getProblemInfo() != null, Workorder::getProblemInfo, pageWrap.getModel().getProblemInfo()) |
| | | .eq(pageWrap.getModel().getLocationName() != null, Workorder::getLocationName, pageWrap.getModel().getLocationName()) |
| | | .like(pageWrap.getModel().getCode() != null, Workorder::getCode, pageWrap.getModel().getCode()) |
| | | .eq(pageWrap.getModel().getDcaYesNum() != null, Workorder::getDcaYesNum, pageWrap.getModel().getDcaYesNum()) |
| | | .eq(pageWrap.getModel().getDcaNoNum() != null, Workorder::getDcaNoNum, pageWrap.getModel().getDcaNoNum()) |
| | | .eq(pageWrap.getModel().getDcaRecordId() != null, Workorder::getDcaRecordId, pageWrap.getModel().getDcaRecordId()) |
| | | .eq(pageWrap.getModel().getDcaCsIds() != null, Workorder::getDcaCsIds, pageWrap.getModel().getDcaCsIds()) ; |
| | | if (pageWrap.getModel().getMemberName() != null) { |
| | | queryWrapper.and( ms->ms.like(Member::getName,pageWrap.getModel().getMemberName()) |
| | | .or().like(Member::getPhone,pageWrap.getModel().getMemberName()) ); |
| | | } |
| | | queryWrapper.orderByDesc(Workorder::getCreateDate); |
| | | MPJLambdaWrapper<Workorder> queryWrapper = getJoinQueryMapper(pageWrap.getModel()); |
| | | return PageData.from(workorderMapper.selectJoinPage(page,Workorder.class, queryWrapper)); |
| | | } |
| | | |