|
|
@@ -0,0 +1,279 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+
|
|
|
+ <div v-if="isPercentage" class="percentage" style="width: 210px;height: 90px;background: #fff;position: fixed;bottom: 0;left: 0;z-index: 9999999999999;">
|
|
|
+ <h4 style="padding-left: 10px;line-height: 0;">导出进度:</h4>
|
|
|
+ <el-progress style="padding-left: 10px;" :text-inside="true" :stroke-width="26" :percentage="percentage" />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="filter-container">
|
|
|
+ <el-date-picker ref="inputDatetime" v-model="getdataListParm.parammaps.inputDatetime" class="inputDatetime" type="datetimerange" style="width: 280px;top:-3px;" format="yyyy-MM-dd" value-format="yyyy-MM-dd" range-separator="至" start-placeholder="时间" end-placeholder="时间" :picker-options="pickerOptions" />
|
|
|
+ <el-select v-model="getdataListParm.parammaps.pastureId" placeholder="牧场" class="filter-item" style="width: 120px;" @change="changePastureName">
|
|
|
+ <el-option v-for="item in findAllPasture" :key="item.id" :label="item.name" :value="item.id" />
|
|
|
+ </el-select>
|
|
|
+ <el-select v-model="getdataListParm.parammaps.departmentId" clearable placeholder="部门" class="filter-item" style="width: 120px;" @change="changePastureName">
|
|
|
+ <el-option v-for="item in findAllDepart" :key="item.id" :label="item.name" :value="item.id" />
|
|
|
+ </el-select>
|
|
|
+
|
|
|
+ <el-input v-model="getdataListParm.parammaps.eqName" placeholder="请输入设备名称" style="width: 200px;" class="filter-item" />
|
|
|
+ <el-input v-model="getdataListParm.parammaps.eqCode" placeholder="请输入设备内部编号" style="width: 200px;" class="filter-item" />
|
|
|
+
|
|
|
+
|
|
|
+ <el-button v-waves class="filter-item" type="primary" icon="el-icon-search" @click="form_search">搜索</el-button>
|
|
|
+
|
|
|
+ <el-button class="filter-item" type="success" icon="el-icon-download" style="" @click="handleDownload">导出</el-button>
|
|
|
+
|
|
|
+
|
|
|
+ <el-table
|
|
|
+ :key="tableKey"
|
|
|
+ v-loading="listLoading"
|
|
|
+ element-loading-text="给我一点时间"
|
|
|
+ :data="list"
|
|
|
+ border
|
|
|
+ fit
|
|
|
+ highlight-current-row
|
|
|
+ style="width: 100%;"
|
|
|
+ :row-style="rowStyle"
|
|
|
+ :cell-style="cellStyle"
|
|
|
+ class="elTable"
|
|
|
+ :max-height="myHeight"
|
|
|
+ >
|
|
|
+ <el-table-column label="序号" align="center" type="index" width="50px">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span>{{ scope.$index + (pageNum-1) * pageSize + 1 }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="日期" align="center" prop="date" />
|
|
|
+ <el-table-column label="运营中心" align="center" prop="center" />
|
|
|
+ <el-table-column label="大区" align="center" prop="region" />
|
|
|
+ <el-table-column label="牧场" align="center" prop="pastureName" />
|
|
|
+ <el-table-column label="部门" align="center" prop="departmentName" />
|
|
|
+ <el-table-column label="设备类别" align="center" prop="eqClass" />
|
|
|
+ <el-table-column label="设备名称" align="center" prop="eqName" />
|
|
|
+ <el-table-column label="设备内部编号" align="center" prop="eqCode" />
|
|
|
+ <el-table-column label="物联网编码" align="center" prop="license" />
|
|
|
+ <el-table-column label="规格" align="center" prop="specification" />
|
|
|
+ <el-table-column label="品牌" align="center" prop="brand" />
|
|
|
+ <el-table-column label="用途" align="center" prop="purpose" />
|
|
|
+ <el-table-column label="购置日期" align="center" prop="purchaseDate" />
|
|
|
+ <el-table-column label="入场时间" align="center" prop="entranceDate" />
|
|
|
+ <el-table-column label="报废时间" align="center" prop="leaveDate" />
|
|
|
+ <el-table-column label="标准工作时长" align="center" prop="duration" />
|
|
|
+ <el-table-column label="时长" align="center" prop="hour" />
|
|
|
+ </el-table>
|
|
|
+ <pagination v-show="total>=0" :total="total" :page.sync="getdataListParm.offset" :limit.sync="getdataListParm.pagecount" @pagination="get_table_data" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+// 引入
|
|
|
+import { GetDataByName, GetDataByNames, getRecuData, GetAccount,getJson } from '@/api/common'
|
|
|
+import waves from '@/directive/waves'
|
|
|
+
|
|
|
+import { parseTime, json2excel, sortChange } from '@/utils/index.js'
|
|
|
+import Pagination from '@/components/Pagination'
|
|
|
+import TreeSelect from '@/components/TreeSelect'
|
|
|
+import Cookies from 'js-cookie'
|
|
|
+export default {
|
|
|
+ name: 'Vehiclerunningtime',
|
|
|
+ components: { Pagination, TreeSelect },
|
|
|
+ directives: { waves },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ findAllPasture: [], findAllDepart: [],
|
|
|
+ requestParams: [
|
|
|
+ { name: 'findAllPasture', offset: 0, pagecount: 0, returntype: 'Map', parammaps: { 'id': Cookies.get('pastureid') }}
|
|
|
+ ],
|
|
|
+ getDepartParam: { name: 'findAllDepart1', offset: 0, pagecount: 0, parammaps: { 'pastureId': Cookies.get('pastureid'), 'eId': Cookies.get('employeid') }},
|
|
|
+
|
|
|
+ tableKey: 0,
|
|
|
+ list: [],
|
|
|
+
|
|
|
+ selectData: '',
|
|
|
+ pickerMinDate: '',
|
|
|
+ pickerRange:3600 * 1000 * 24 * 60,
|
|
|
+ pickerOptions: {
|
|
|
+ // onPick:({maxDate,minDate }) => {
|
|
|
+ // if (minDate && this.pickerMinDate) {
|
|
|
+ // this.pickerMinDate = null
|
|
|
+ // } else if (minDate) {
|
|
|
+ // this.pickerMinDate = minDate.getTime()
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ // disabledDate: (time) => {
|
|
|
+ // if (this.pickerMinDate) {
|
|
|
+ // return (time.getTime() > (this.pickerMinDate + this.pickerRange)) ||(time.getTime() < (this.pickerMinDate - this.pickerRange))
|
|
|
+ // }
|
|
|
+ // return false
|
|
|
+ // },
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ total: 0,
|
|
|
+ listLoading: true,
|
|
|
+ getdataListParm: {
|
|
|
+ name: 'startStopRecord', page: 1, offset: 1, pagecount: 10, returntype: 'Map',inputDatetime: [parseTime(new Date().getTime() - 30 * 24 * 60 * 60 * 1000, '{y}-{m}-{d}'), parseTime(new Date().getTime() - 24 * 60 * 60 * 1000, '{y}-{m}-{d}')],
|
|
|
+ parammaps: { pastureId: parseInt(Cookies.get('pastureid')), pastureName: Cookies.get('pasturename'), departmentId: '', eqClassId: '', eqName: '',eqCode:'',startTime: "",
|
|
|
+ endTime: "",departmentId: "" ,inputDatetime: [parseTime(new Date().getTime() - 30 * 24 * 60 * 60 * 1000, '{y}-{m}-{d}'), parseTime(new Date().getTime() - 24 * 60 * 60 * 1000, '{y}-{m}-{d}')], page: 1, offset: 1, pagecount: 10,}
|
|
|
+ },
|
|
|
+ requestParam: { name: 'insertAsset', offset: 0, pagecount: 0, parammaps: {}}, statueReason: false,
|
|
|
+ downLoadParm: {},
|
|
|
+ downLoadList: [],
|
|
|
+ pageNum: 0,
|
|
|
+ pageSize: 0,
|
|
|
+ isPercentage: false,
|
|
|
+ percentage: 1,
|
|
|
+ isokDisable: false,
|
|
|
+ rowStyle: { maxHeight: 50 + 'px', height: 45 + 'px' },
|
|
|
+ cellStyle: { padding: 0 + 'px' },
|
|
|
+ myHeight:document.documentElement.clientHeight - 85- 150
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.get_select_list()
|
|
|
+ this.get_table_data()
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ get_select_list() {
|
|
|
+ GetDataByNames(this.requestParams).then(response => {
|
|
|
+ if (response.data.list !== null) {
|
|
|
+ this.findAllPasture = response.data.findAllPasture.list
|
|
|
+ this.getDepartDownList()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getDepartDownList() {
|
|
|
+ GetDataByName(this.getDepartParam).then(response => {
|
|
|
+ this.findAllDepart = response.data.list
|
|
|
+ })
|
|
|
+ },
|
|
|
+ changePastureName(item) {
|
|
|
+ this.getDepartParam.parammaps.pastureId = this.findAllPasture.find(obj => obj.name == item).id
|
|
|
+ this.getdataListParm.parammaps.departmentId = ''
|
|
|
+ this.getDepartDownList()
|
|
|
+ },
|
|
|
+ get_table_data() {
|
|
|
+ this.listLoading = true
|
|
|
+ // console.log(this.findAllPasture.find(obj => obj.name == this.getdataListParm.parammaps.pastureName).id,'===')
|
|
|
+ if (this.getdataListParm.parammaps.pastureName == '现代牧业') {
|
|
|
+ // this.getdataListParm.parammaps.pastureName = ''
|
|
|
+ this.getdataListParm.parammaps.pastureId = ''
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.getdataListParm.parammaps.inputDatetime == null) {
|
|
|
+ this.getdataListParm.parammaps.startTime = ''
|
|
|
+ this.getdataListParm.parammaps.endTime = ''
|
|
|
+ } else {
|
|
|
+ this.getdataListParm.parammaps.startTime = parseTime(this.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
|
|
|
+ this.getdataListParm.parammaps.endTime = parseTime(this.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
|
|
|
+ }
|
|
|
+ this.getdataListParm.parammaps.offset = this.getdataListParm.offset
|
|
|
+ this.getdataListParm.parammaps.pagecount = this.getdataListParm.pagecount
|
|
|
+ this.getdataListParm.parammaps.page = this.getdataListParm.page
|
|
|
+ let url = '/authdata/vehicle/list'
|
|
|
+ let data = '?pastureId='+ this.getdataListParm.parammaps.pastureId
|
|
|
+ + '&startTime=' + this.getdataListParm.parammaps.startTime
|
|
|
+ + '&endTime=' + this.getdataListParm.parammaps.endTime
|
|
|
+ + '&offset=' + this.getdataListParm.offset
|
|
|
+ + '&pagecount=' + this.getdataListParm.pagecount
|
|
|
+ + '&eqCode=' + this.getdataListParm.parammaps.eqCode
|
|
|
+ + '&eqName=' + this.getdataListParm.parammaps.eqName
|
|
|
+ + '&departmentId=' + this.getdataListParm.parammaps.departmentId
|
|
|
+ getJson(url,data).then(response => {
|
|
|
+ console.log('table数据', response.data.vehicle)
|
|
|
+ if (response.data.list !== null) {
|
|
|
+ this.list = response.data.vehicle
|
|
|
+ this.pageNum = response.data.offset
|
|
|
+ this.pageSize = response.data.pagecount
|
|
|
+ } else {
|
|
|
+ this.list = []
|
|
|
+ }
|
|
|
+ this.total = response.data.count
|
|
|
+ setTimeout(() => {
|
|
|
+ this.listLoading = false
|
|
|
+ }, 100)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ form_search() {
|
|
|
+ this.listLoading = true
|
|
|
+ this.getdataListParm.offset = 1
|
|
|
+ this.get_table_data()
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ handleDownload() {
|
|
|
+ this.$alert('车辆运行时间正在导出中，请勿刷新或离开本页面，若导出时间过长，建议缩小导出数据范围重新导出', {})
|
|
|
+ this.isPercentage = true
|
|
|
+ this.percentage = 1
|
|
|
+ var timer = setInterval(() => {
|
|
|
+ this.percentage += 5
|
|
|
+ if (this.percentage > 95) {
|
|
|
+ this.percentage = 99
|
|
|
+ clearInterval(timer)
|
|
|
+ }
|
|
|
+ this.percentage = this.percentage
|
|
|
+ }, 1000)
|
|
|
+ let url = '/authdata/vehicle/list'
|
|
|
+ let data = '?pastureId='+ this.getdataListParm.parammaps.pastureId
|
|
|
+ + '&startTime=' + this.getdataListParm.parammaps.startTime
|
|
|
+ + '&endTime=' + this.getdataListParm.parammaps.endTime
|
|
|
+ + '&offset=0'
|
|
|
+ + '&pagecount=' + this.total
|
|
|
+ + '&eqCode=' + this.getdataListParm.parammaps.eqCode
|
|
|
+ + '&eqName=' + this.getdataListParm.parammaps.eqName
|
|
|
+ + '&departmentId=' + this.getdataListParm.parammaps.departmentId
|
|
|
+ getJson(url,data).then(response => {
|
|
|
+ this.downLoadList = response.data.vehicle
|
|
|
+ if (response.data.vehicle !== '') {
|
|
|
+ this.percentage = 99
|
|
|
+ setTimeout(() => {
|
|
|
+ this.isPercentage = false
|
|
|
+ }, 2000)
|
|
|
+ }
|
|
|
+ const elecExcelDatas = [
|
|
|
+ {
|
|
|
+ tHeader: ['日期','运营中心','大区','牧场','部门','设备类别','设备名称','设备内部编号','物联网编码','规格','品牌','用途','购置日期','入场时间','报废时间','标准工作时长','时长'],
|
|
|
+ filterVal: ['date','center','region','pastureName','departmentName','eqClass','eqName','eqCode','license','specification','brand','purpose','purchaseDate','entranceDate','leaveDate','duration','hour' ],
|
|
|
+ tableDatas: this.downLoadList,
|
|
|
+ sheetName: '车辆运行时间'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ json2excel(elecExcelDatas, '车辆运行时间', true, 'xlsx')
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .el-autocomplete-suggestion li{
|
|
|
+ padding:0 3px!important;
|
|
|
+ }
|
|
|
+ .el-table .warning-row {
|
|
|
+ background: oldlace;
|
|
|
+ }
|
|
|
+ .el-table .success-row {
|
|
|
+ background: #f0f9eb;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+<style lang="scss">
|
|
|
+ .upkeepgrade .el-form-item__label{
|
|
|
+ line-height: 20px;
|
|
|
+ }
|
|
|
+ .inputDatetime .el-range-separator{
|
|
|
+ padding: 0;
|
|
|
+ margin: 0 10px;
|
|
|
+ }
|
|
|
+ .el-radio__label{
|
|
|
+ padding-left: 2px !important;
|
|
|
+ }
|
|
|
+ .typeSelect span .el-popover__reference .el-input--suffix {
|
|
|
+ top:-3px;
|
|
|
+ .el-input__inner{
|
|
|
+ height:40px !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
