| | |
| | | <div class="home_total_head">在厂人员总览</div> |
| | | <div class="home_total_list"> |
| | | <div class="home_total_list_item a"> |
| | | <span>352</span> |
| | | <span>{{head && head.workerCount ? head.workerCount : 0}}</span> |
| | | <span>内部员工</span> |
| | | </div> |
| | | <div class="home_total_list_item b"> |
| | | <span>352</span> |
| | | <span>{{head && head.visitorCount ? head.visitorCount : 0}}</span> |
| | | <span>访客</span> |
| | | </div> |
| | | <div class="home_total_list_item c"> |
| | | <span>352</span> |
| | | <span>{{head && head.lwCount ? head.lwCount : 0}}</span> |
| | | <span>劳务人员</span> |
| | | </div> |
| | | <div class="home_total_list_item d"> |
| | | <span>352</span> |
| | | <span>{{head && head.presenceCarCount ? head.presenceCarCount : 0}}</span> |
| | | <span>在场车辆</span> |
| | | </div> |
| | | <div class="home_total_list_item e"> |
| | | <span>352</span> |
| | | <span>访客车辆</span> |
| | | <span>{{head && head.longCarCount ? head.longCarCount : 0}}</span> |
| | | <span>长期车辆</span> |
| | | </div> |
| | | <div class="home_total_list_item f"> |
| | | <span>352</span> |
| | | <span>劳务车辆</span> |
| | | <span>{{head && head.visitorCarCount ? head.visitorCarCount : 0}}</span> |
| | | <span>预约车辆</span> |
| | | </div> |
| | | <div class="home_total_list_item g"> |
| | | <span>352</span> |
| | | <span>{{head && head.supplierCount ? head.supplierCount : 0}}</span> |
| | | <span>供应商</span> |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="home_table"> |
| | | <div class="home_table_head">超时预警人员(3)</div> |
| | | <div class="home_table_head">超时预警人员({{total}})</div> |
| | | <div class="home_table_box"> |
| | | <el-table |
| | | :data="list" |
| | |
| | | border |
| | | style="width: 100%"> |
| | | <el-table-column |
| | | prop="date" |
| | | prop="name" |
| | | label="访客姓名"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="name" |
| | | prop="phone" |
| | | label="访客电话"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | prop="companyName" |
| | | label="访客公司"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="公司类型"> |
| | | label="人员类型"> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.type === 0">劳务访客</span> |
| | | <span v-if="row.type === 1">普通访客</span> |
| | | <span v-if="row.type === 2">内部人员</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | prop="outDate" |
| | | label="授权到期时间"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="状态"> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.outStatus === 0">未超时</span> |
| | | <span style="color: red;" v-if="row.outStatus === 1">已超时</span> |
| | | <span v-if="row.outStatus === 2">即将超时</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="处理" |
| | | width="80"> |
| | | <template slot-scope="scope"> |
| | | <el-button type="text">离场</el-button> |
| | | <el-button type="text" @click="departure(scope.row.id)">离场</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | style="margin-top: 20px;" |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | | :current-page="page" |
| | | :page-sizes="[100, 200, 300, 400]" |
| | | :page-size="100" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="400"> |
| | | :page-size="10" |
| | | layout="total, prev, pager, next, jumper" |
| | | :total="total"> |
| | | </el-pagination> |
| | | </div> |
| | | </div> |
| | |
| | | |
| | | <script> |
| | | import * as echarts from 'echarts' |
| | | import { body, head, timeoutPage, level } from '@/api/business/staging' |
| | | export default { |
| | | name: 'Index', |
| | | data () { |
| | | return { |
| | | head: null, |
| | | list: [], |
| | | total: 0, |
| | | data1: [], |
| | | data2: [[],[]], |
| | | page: 1 |
| | | } |
| | | }, |
| | | created () { |
| | | this.getHeader() |
| | | this.getData() |
| | | }, |
| | | mounted () { |
| | | this.getcharts1() |
| | | this.getcharts2() |
| | | // this.getcharts2() |
| | | }, |
| | | methods: { |
| | | handleSizeChange () { |
| | | departure(id) { |
| | | this.$confirm('确定离场吗, 是否继续?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | level(id) |
| | | .then(res => { |
| | | this.page = 1 |
| | | this.getData() |
| | | }) |
| | | }).catch(() => { |
| | | |
| | | }); |
| | | }, |
| | | handleCurrentChange () { |
| | | |
| | | getData() { |
| | | timeoutPage({ |
| | | capacity: 10, |
| | | page: this.page, |
| | | model: {} |
| | | }).then(res => { |
| | | this.list = res.records |
| | | this.total = res.total |
| | | }) |
| | | }, |
| | | getHeader() { |
| | | head().then(res => { |
| | | this.head = res |
| | | }) |
| | | body().then(res => { |
| | | this.data1 = res.retentionUsers.map(item => { |
| | | let name = '' |
| | | if (item.memberType === 0) { |
| | | name = '劳务访客' |
| | | } else if (item.memberType === 1) { |
| | | name = '普通访客' |
| | | } else if (item.memberType === 2) { |
| | | name = '内部员工' |
| | | } |
| | | return { |
| | | value: item.memberCount, |
| | | name |
| | | } |
| | | }) |
| | | let arr1 = res.companyUsers.map(item => item.companyName) |
| | | let arr2 = res.companyUsers.map(item => item.memberCount) |
| | | if (arr1.length > 0) { |
| | | this.data2 = [arr1, arr2] |
| | | this.getcharts2() |
| | | } |
| | | this.getcharts1() |
| | | }) |
| | | }, |
| | | handleCurrentChange (page) { |
| | | this.page = page |
| | | this.getData() |
| | | }, |
| | | getcharts1 () { |
| | | const myChart = echarts.init(document.getElementById('chart1')) |
| | |
| | | label: { |
| | | formatter: '{b} {d}%' |
| | | }, |
| | | data: [ |
| | | { value: 1048, name: '劳务人员' }, |
| | | { value: 735, name: '内部员工' }, |
| | | { value: 580, name: '访客' } |
| | | ], |
| | | data: this.data1, |
| | | itemStyle: { |
| | | normal: { |
| | | color: function (colors) { |
| | |
| | | }, |
| | | yAxis: { |
| | | type: 'category', |
| | | data: ['海康威视', '农业有限公司', '字幕也有限公司', '万达股份有限公司', '阿里巴巴集团有限公司', '腾讯集团有限公司'] |
| | | data: this.data2[0] |
| | | }, |
| | | series: [ |
| | | { |
| | | realtimeSort: true, |
| | | type: 'bar', |
| | | data: [1, 2, 3, 4, 5, 6], |
| | | data: this.data2[1], |
| | | itemStyle: { |
| | | normal: { |
| | | color: '#fc8251' |