| | |
| | | <template> |
| | | <div class="home"> |
| | | <div class="home_total"> |
| | | <div class="home_total_head">在厂人员总览</div> |
| | | <div class="home_total_head">在园人员总览</div> |
| | | <div class="home_total_list"> |
| | | <div class="home_total_list_item a"> |
| | | <span>{{head && head.workerCount ? head.workerCount : 0}}</span> |
| | | <span>{{ head && head.workerCount ? head.workerCount : 0 }}</span> |
| | | <span>内部员工</span> |
| | | </div> |
| | | <div class="home_total_list_item b"> |
| | | <span>{{head && head.visitorCount ? head.visitorCount : 0}}</span> |
| | | <span>{{ head && head.visitorCount ? head.visitorCount : 0 }}</span> |
| | | <span>访客</span> |
| | | </div> |
| | | <div class="home_total_list_item c"> |
| | | <span>{{head && head.lwCount ? head.lwCount : 0}}</span> |
| | | <span>{{ head && head.lwCount ? head.lwCount : 0 }}</span> |
| | | <span>劳务人员</span> |
| | | </div> |
| | | <div class="home_total_list_item d"> |
| | | <span>{{head && head.presenceCarCount ? head.presenceCarCount : 0}}</span> |
| | | <span>{{ |
| | | head && head.presenceCarCount ? head.presenceCarCount : 0 |
| | | }}</span> |
| | | <span>在场车辆</span> |
| | | </div> |
| | | <div class="home_total_list_item e"> |
| | | <span>{{head && head.longCarCount ? head.longCarCount : 0}}</span> |
| | | <span>{{ head && head.longCarCount ? head.longCarCount : 0 }}</span> |
| | | <span>长期车辆</span> |
| | | </div> |
| | | <div class="home_total_list_item f"> |
| | | <span>{{head && head.visitorCarCount ? head.visitorCarCount : 0}}</span> |
| | | <span>{{ |
| | | head && head.visitorCarCount ? head.visitorCarCount : 0 |
| | | }}</span> |
| | | <span>预约车辆</span> |
| | | </div> |
| | | <div class="home_total_list_item g"> |
| | | <span>{{head && head.supplierCount ? head.supplierCount : 0}}</span> |
| | | <span>{{ head && head.supplierCount ? head.supplierCount : 0 }}</span> |
| | | <span>供应商</span> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="home_charts"> |
| | | <div class="home_charts_item"> |
| | | <div class="home_charts_item_label">在厂人员占比</div> |
| | | <div class="home_charts_item_label">在园人员占比</div> |
| | | <div class="home_charts_item_charts" id="chart1"></div> |
| | | </div> |
| | | <div class="home_charts_item"> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="home_table"> |
| | | <div class="home_table_head">超时预警人员({{total}})</div> |
| | | <div class="home_table_head">超时预警人员({{ total }})</div> |
| | | <div class="home_table_box"> |
| | | <el-table |
| | | :data="list" |
| | | :header-cell-style="{background: '#dcdde2', color: 'rgb(51, 51, 51)'}" |
| | | :header-cell-style="{ |
| | | background: '#dcdde2', |
| | | color: 'rgb(51, 51, 51)', |
| | | }" |
| | | border |
| | | style="width: 100%"> |
| | | <el-table-column |
| | | prop="name" |
| | | label="访客姓名"> |
| | | style="width: 100%" |
| | | > |
| | | <el-table-column prop="name" label="访客姓名"> </el-table-column> |
| | | <el-table-column prop="phone" label="访客电话"> </el-table-column> |
| | | <el-table-column prop="companyName" label="访客组织"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="phone" |
| | | label="访客电话"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="companyName" |
| | | label="访客组织"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="人员类型"> |
| | | <template slot-scope="{row}"> |
| | | <el-table-column 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="outDate" |
| | | label="授权到期时间"> |
| | | <el-table-column prop="outDate" label="授权到期时间"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="状态"> |
| | | <template slot-scope="{row}"> |
| | | <el-table-column label="状态"> |
| | | <template slot-scope="{ row }"> |
| | | <span v-if="row.outStatus === 0">未超时</span> |
| | | <span style="color: red;" v-if="row.outStatus === 1">已超时</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"> |
| | | <el-table-column prop="address" label="处理" width="80"> |
| | | <template slot-scope="scope"> |
| | | <el-button type="text" @click="departure(scope.row.id)" v-if="scope.row.outStatus === 1">离厂</el-button> |
| | | <el-button |
| | | type="text" |
| | | @click="departure(scope.row.id)" |
| | | v-if="scope.row.outStatus === 1" |
| | | >离厂</el-button |
| | | > |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | style="margin-top: 20px;" |
| | | style="margin-top: 20px" |
| | | @current-change="handleCurrentChange" |
| | | :current-page="page" |
| | | :page-size="10" |
| | | layout="total, prev, pager, next, jumper" |
| | | :total="total"> |
| | | :total="total" |
| | | > |
| | | </el-pagination> |
| | | </div> |
| | | </div> |
| | |
| | | import { body, head, timeoutPage, level } from '@/api/business/staging' |
| | | export default { |
| | | name: 'Index', |
| | | data () { |
| | | data() { |
| | | return { |
| | | head: null, |
| | | list: [], |
| | | total: 0, |
| | | data1: [], |
| | | data2: [[],[]], |
| | | data2: [[], []], |
| | | page: 1 |
| | | } |
| | | }, |
| | | created () { |
| | | created() { |
| | | this.getHeader() |
| | | this.getData() |
| | | }, |
| | | mounted () { |
| | | mounted() { |
| | | // this.getcharts2() |
| | | }, |
| | | methods: { |
| | |
| | | }) |
| | | }).catch(() => { |
| | | |
| | | }); |
| | | }) |
| | | }, |
| | | getData() { |
| | | timeoutPage({ |
| | |
| | | this.getcharts1() |
| | | }) |
| | | }, |
| | | handleCurrentChange (page) { |
| | | handleCurrentChange(page) { |
| | | this.page = page |
| | | this.getData() |
| | | }, |
| | | getcharts1 () { |
| | | getcharts1() { |
| | | const myChart = echarts.init(document.getElementById('chart1')) |
| | | // 绘制图表 |
| | | myChart.setOption({ |
| | |
| | | ] |
| | | }) |
| | | }, |
| | | getcharts2 () { |
| | | getcharts2() { |
| | | const myChart = echarts.init(document.getElementById('chart2')) |
| | | myChart.setOption({ |
| | | tooltip: { |