From ddd32e029e6a5866240d737b4cc268e33e861233 Mon Sep 17 00:00:00 2001
From: licp <lichunping@guanfang.com.cn>
Date: 星期三, 06 三月 2024 13:57:56 +0800
Subject: [PATCH] 完成设备总览和设备工具明细接口联调
---
src/components/view/a6-device-overview.vue | 206 ++++++++++++++-----------
src/components/view/a6-device-management.vue | 226 ++++++++++++++++++++-------
src/assets/api/controller.js | 2
3 files changed, 283 insertions(+), 151 deletions(-)
diff --git a/src/assets/api/controller.js b/src/assets/api/controller.js
index 0b2baf3..b514359 100644
--- a/src/assets/api/controller.js
+++ b/src/assets/api/controller.js
@@ -101,6 +101,8 @@
upDeviceParameter: "/deviceScope/upDeviceParameter", //淇敼璁惧璇︽儏鍙傛暟
authorizedPerson: "/deviceScope/authorizedPerson", //鑾峰彇鎺堟潈浜�
selectEquipmentOverview: "/deviceScope/selectEquipmentOverview", //鑾峰彇璁惧鎬昏
+ uploadFile: "/deviceScope/uploadFile", //涓婁紶鍥剧墖
+ selectDevicePrincipal: "/deviceScope/selectDevicePrincipal", //鑾峰彇璁惧璐熻矗浜�
}
const systemLog = {
diff --git a/src/components/view/a6-device-management.vue b/src/components/view/a6-device-management.vue
index df5efb9..9b41352 100644
--- a/src/components/view/a6-device-management.vue
+++ b/src/components/view/a6-device-management.vue
@@ -39,6 +39,13 @@
.el-form-item{
margin-bottom: 16px;
}
+ .picName{
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ word-break: break-all;
+ width: 120px;
+ }
</style>
<template>
@@ -53,14 +60,14 @@
<div class="search">
<div class="search_thing">
<div class="search_label">鐘舵�侊細</div>
- <el-select v-model="componentData.entity.status" placeholder="鍏ㄩ儴">
+ <el-select v-model="componentData.entity.deviceStatus" placeholder="鍏ㄩ儴">
<el-option
- v-for="item in options"
+ v-for="item in deviceStatusList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
- </el-select>
+ </el-select>
</div>
<div class="search_thing">
<div class="search_label">璁惧鍚嶇О锛�</div>
@@ -70,13 +77,13 @@
<div class="search_thing">
<div class="search_label">瑙勬牸鍨嬪彿锛�</div>
<div class="search_input"><el-input size="small" placeholder="璇疯緭鍏�" clearable
- v-model="componentData.entity.internalCode" @keyup.enter.native="refreshTable()"></el-input></div>
+ v-model="componentData.entity.specificationModel" @keyup.enter.native="refreshTable()"></el-input></div>
</div>
<div class="search_thing">
- <div class="search_label">璁惧绫诲瀷锛�</div>
- <el-select v-model="componentData.entity.type" placeholder="璇烽�夋嫨">
+ <div class="search_label">璁惧澶х被锛�</div>
+ <el-select v-model="componentData.entity.largeCategory" placeholder="璇烽�夋嫨">
<el-option
- v-for="item in options"
+ v-for="item in equipmentList"
:key="item.value"
:label="item.label"
:value="item.value">
@@ -102,11 +109,20 @@
<el-col :span="7" >
<el-col>
<!-- 鍥剧墖 -->
- <img src="https://www.baidu.com/img/bd_logo1.png" alt="" style="width:100%;height: 320px;marginBottom:16px">
+ <el-image class="img" style="width:100%;height: 320px;marginBottom:16px" :src="javaApi+'/img/'+formData.imageUpload">
+ <div slot="error" class="image-error" style="width: calc(100% -2px);
+ height: 318px;
+ border-radius: 16px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border: 1px solid #EEEEEE;">
+ <i class="el-icon-picture-outline" style="font-size:60px;color:#666666;"></i>
+ </div>
+ </el-image>
<!-- 琛ㄥ崟 -->
<el-form :label-position="labelPosition" :model="formData" label-width="90px">
<el-form-item label="璁惧鍒嗙被:" >
- <!-- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input> -->
<el-select :disabled="isUp" v-model="formData.largeCategory" placeholder="璇烽�夋嫨" size="small" style="width:100%">
<el-option
v-for="item in equipmentList"
@@ -124,11 +140,12 @@
v-model="formData.dateProduction"
type="datetime"
size="small"
+ format="yyyy-MM-dd HH:mm:ss"
+ value-format="yyyy-MM-dd HH:mm:ss"
placeholder="閫夋嫨鏃ユ湡">
</el-date-picker>
</el-form-item>
<el-form-item label="璁惧璐熻矗浜�:" >
- <!-- <el-input :disabled="isUp" v-model="formData.equipmentManager" size="small"></el-input> -->
<el-select :disabled="isUp" v-model="formData.equipmentManager" placeholder="璇烽�夋嫨" size="small" style="width:100%">
<el-option
v-for="item in responsiblePersonList"
@@ -140,7 +157,6 @@
</el-select>
</el-form-item>
<el-form-item label="琚巿鏉冧汉:" >
- <!-- <el-input :disabled="isUp" v-model="formData.authorizedPerson" size="small"></el-input> -->
<el-select :disabled="isUp" v-model="formData.authorizedPerson" size="small" multiple placeholder="璇烽�夋嫨" style="width:100%">
<el-option
v-for="item in authorizerList"
@@ -171,48 +187,47 @@
v-model="formData.calibrationDate"
type="month"
size="small"
+ format="yyyy-MM"
+ value-format="yyyy-MM"
style="width:100%"
placeholder="閫夋嫨鏈�">
</el-date-picker>
- <!-- <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input> -->
</el-form-item>
<el-form-item label="鎶ュ簾鏃堕棿:" >
<el-date-picker
style="width:100%"
:disabled="isUp"
- v-model="formData.calibrationDate"
+ v-model="formData.scrapTime"
type="datetime"
+ format="yyyy-MM-dd HH:mm:ss"
+ value-format="yyyy-MM-dd HH:mm:ss"
size="small"
placeholder="閫夋嫨鏃堕棿">
</el-date-picker>
- <!-- <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input> -->
</el-form-item>
<el-form-item label="楠屾敹璁板綍:" >
- <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input>
+ <el-input :disabled="isUp" v-model="formData.acceptanceRecords" size="small"></el-input>
</el-form-item>
- <!-- 璺熸潕缁忕悊纭涓嶈杩欎釜瀛楁 -->
- <!-- <el-form-item label="缁嗙被:" >
- <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input>
- </el-form-item> -->
<el-form-item label="鍑哄巶缂栧彿:" >
- <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input>
+ <el-input :disabled="isUp" v-model="formData.factoryNo" size="small"></el-input>
</el-form-item>
<el-form-item label="璐疆鏃ユ湡:" >
<el-date-picker
style="width:100%"
:disabled="isUp"
- v-model="formData.calibrationDate"
+ v-model="formData.acquisitionDate"
type="datetime"
size="small"
+ format="yyyy-MM-dd HH:mm:ss"
+ value-format="yyyy-MM-dd HH:mm:ss"
placeholder="閫夋嫨鏃ユ湡">
</el-date-picker>
- <!-- <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input> -->
</el-form-item>
<el-form-item label="鍑嗙‘搴﹂噺鍊�:" >
- <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input>
+ <el-input :disabled="isUp" v-model="formData.accurateMeasurement" size="small"></el-input>
</el-form-item>
<el-form-item label="澶囨敞:" >
- <el-input :disabled="isUp" v-model="formData.calibrationDate" size="small"></el-input>
+ <el-input :disabled="isUp" v-model="formData.notes" size="small"></el-input>
</el-form-item>
</el-form>
</el-col>
@@ -220,11 +235,10 @@
<el-col :span="7">
<el-form :label-position="labelPosition" :model="formData" label-width="110px" ref="ruleForm">
<el-form-item label="瑙勬牸鍨嬪彿:" >
- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
+ <el-input :disabled="isUp" v-model="formData.specificationModel" size="small"></el-input>
</el-form-item>
<el-form-item label="璁惧鐘舵��:">
- <!-- <el-input :disabled="isUp" v-model="formData.latestTraceability" size="small"></el-input> -->
- <el-select :disabled="isUp" v-model="formData.latestTraceability" placeholder="璇烽�夋嫨" size="small" style="width:100%">
+ <el-select :disabled="isUp" v-model="formData.deviceStatus" placeholder="璇烽�夋嫨" size="small" style="width:100%">
<el-option
v-for="item in deviceStatusList"
:key="item.value"
@@ -235,14 +249,15 @@
</el-select>
</el-form-item>
<el-form-item label="瀛樻斁鐐�:" >
- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
+ <el-input :disabled="isUp" v-model="formData.storagePoint" size="small"></el-input>
</el-form-item>
<el-form-item label="鏈�杩戣拷婧棩鏈�:" >
- <!-- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input> -->
<el-date-picker
style="width:100%"
:disabled="isUp"
- v-model="formData.largeCategory"
+ v-model="formData.latestTraceability"
+ format="yyyy-MM-dd HH:mm:ss"
+ value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
size="small"
placeholder="閫夋嫨鏃ユ湡">
@@ -252,37 +267,38 @@
<el-date-picker
style="width:100%"
:disabled="isUp"
- v-model="formData.largeCategory"
+ format="yyyy-MM-dd HH:mm:ss"
+ value-format="yyyy-MM-dd HH:mm:ss"
+ v-model="formData.downTime"
type="datetime"
size="small"
placeholder="閫夋嫨鏃堕棿">
</el-date-picker>
- <!-- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input> -->
</el-form-item>
<el-form-item label="缁翠慨璁板綍:" >
- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
+ <el-input :disabled="isUp" v-model="formData.maintenanceRecords" size="small"></el-input>
</el-form-item>
<el-form-item label="鐢熶骇鍘傚:" >
- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small" ></el-input>
+ <el-input :disabled="isUp" v-model="formData.manufacturer" size="small" ></el-input>
</el-form-item>
- <!-- 璺熸潕缁忕悊纭涓嶈杩欎釜瀛楁 -->
- <!-- <el-form-item label="妫�娴嬬被鍨�:" >
- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
- </el-form-item> -->
<el-form-item label="閲囪喘璐圭敤:" >
- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
+ <el-input :disabled="isUp" v-model="formData.procurementCosts" size="small"></el-input>
</el-form-item>
<el-form-item label="鏍″噯璇佷功:" >
- <el-input :disabled="isUp" v-model="formData.largeCategory" size="small"></el-input>
+ <el-input :disabled="isUp" v-model="formData.calibrationCerticate" size="small"></el-input>
</el-form-item>
<el-form-item v-if="!isUp" label="鍥剧墖:" >
<div style="border: 1px solid #DCDFE6;border-radius:4px;height:32px;lineHeight:32px;display:flex;justify-content: space-around;font-size: 13px;">
- <div v-if="formData.largeCategory">{{formData.largeCategory}}</div>
+ <div v-show="formData.imageName" class="picName">{{formData.imageName}}</div>
<el-upload
- action="https://jsonplaceholder.typicode.com/posts/"
+ :action="action"
:on-success="handleSuccessUpImg"
:show-file-list="false"
accept='image/jpg,image/jpeg,image/png'
+ :headers="headers"
+ :on-change="beforeUpload"
+ :on-error="onError"
+ ref='upload'
>
<el-button type="text" style="height:30px;paddingTop:8px">涓婁紶</el-button>
</el-upload>
@@ -294,7 +310,7 @@
<span slot="footer" class="dialog-footer">
<el-row v-if="!isUp">
<el-button @click="handleClose">鍙� 娑�</el-button>
- <el-button type="primary" @click="submitForm">纭� 瀹�</el-button>
+ <el-button type="primary" @click="submitForm" :loading="upLoad">纭� 瀹�</el-button>
</el-row>
</span>
</el-dialog>
@@ -318,12 +334,10 @@
dialogVisible: false,
componentData: {
entity: {
- largeCategory: null,
- subclass: null,
+ deviceStatus: null,
deviceName: null,
- internalCode: null,
specificationModel: null,
- manufacturer: null,
+ largeCategory: null,
orderBy: {
field: 'id',
order: 'asc'
@@ -348,7 +362,23 @@
type: 'text',
method: 'isUpdate'
}],
- tagField: {},
+ tagField: {
+ deviceStatus: {
+ select: [{
+ value: 0,
+ type: 'success',
+ label: '姝ｅ父'
+ },{
+ value: 1,
+ type: 'warning',
+ label: '鎶ュ簾'
+ },{
+ value: 2,
+ type: 'danger',
+ label: '淇濅慨'
+ }]
+ }
+ },
selectField: {},
requiredAdd:['largeCategory','subclass','deviceName','internalCode','specificationModel','manufacturer'],
requiredUp:['largeCategory','subclass','deviceName','internalCode','specificationModel','manufacturer']
@@ -357,7 +387,7 @@
upIndex: 0,
addDia: true,
addPower: true,
- //璁惧鍒楄〃
+ //璁惧绫诲瀷鍒楄〃
equipmentList:[],
// 璐熻矗浜哄垪琛�
responsiblePersonList:[],
@@ -365,12 +395,23 @@
authorizerList:[],
// 璁惧鐘舵�佸垪琛�
deviceStatusList:[],
+ upLoad:false,
}
},
+ computed: {
+ headers() {
+ return { 'token': sessionStorage.getItem('token') }
+ },
+ action(){
+ return this.javaApi+this.$api.deviceScope.uploadFile
+ }
+ },
mounted() {
this.entityCopy = this.HaveJson(this.componentData.entity)
this.getPower()
this.getAuthorizedPerson()
+ this.selectEnumByCategory()
+ this.selectDevicePrincipal()
},
methods: {
refreshTable() {
@@ -380,7 +421,6 @@
this.componentData.entity = this.HaveJson(this.entityCopy)
this.upIndex++
},
-
// 鏉冮檺鍒嗛厤
getPower(radio) {
let power = JSON.parse(sessionStorage.getItem('power'))
@@ -409,19 +449,45 @@
// 鑾峰彇鎺堟潈浜�
getAuthorizedPerson(){
this.$axios.get(this.$api.deviceScope.authorizedPerson).then(res => {
- console.log(11111,res)
let data = []
res.data.forEach(a=>{
data.push({
- label: a.laboratoryName,
- value: a.laboratoryName
+ label: a.authorizedPerson,
+ value: a.authorizedPerson
})
})
this.authorizerList = data
})
},
+ // 鑾峰彇瀛楀吀
+ selectEnumByCategory() {
+ this.$axios.post(this.$api.enums.selectEnumByCategory, {
+ category: "璁惧鐘舵��"
+ }).then(res => {
+ this.deviceStatusList = res.data
+ })
+ this.$axios.post(this.$api.enums.selectEnumByCategory, {
+ category: "璁惧鍒嗙被"
+ }).then(res => {
+ this.equipmentList = res.data
+ })
+ },
+ // 鑾峰彇璐熻矗浜哄垪琛�
+ selectDevicePrincipal(){
+ this.$axios.get(this.$api.deviceScope.selectDevicePrincipal).then(res => {
+ let data = []
+ res.data.forEach(a=>{
+ data.push({
+ label: a.equipmentManager,
+ value: a.equipmentManager
+ })
+ })
+ this.responsiblePersonList = data
+ })
+ },
handleClose(){
this.dialogVisible = false;
+ this.upLoad = false;
},
selectAllByOne(row){
this.isUp = true
@@ -429,7 +495,8 @@
this.dialogVisible = true;
//row = 鐐瑰嚮瀵瑰簲琛屽��
//澶嶅埗缁檉ormData
- this.formData=row;
+ this.formData=this.HaveJson(row);
+ this.formData.authorizedPerson=row.authorizedPerson?row.authorizedPerson.split(','):[];
},
isUpdate(row){
//淇敼 isUp 涓烘。妗堜慨鏀�
@@ -438,15 +505,56 @@
this.dialogVisible = true;
//row = 鐐瑰嚮瀵瑰簲琛屽�间竴琛屽��
//澶嶅埗缁檉ormData
- this.formData=row;
+ this.formData=this.HaveJson(row);
+ this.formData.authorizedPerson=row.authorizedPerson?row.authorizedPerson.split(','):[];
+ },
+ beforeUpload(file){
+ if (file.size > 1024*1024*10) {
+ this.$message.error('涓婁紶鏂囦欢涓嶈秴杩�10M');
+ this.$refs.upload.clearFiles()
+ return false;
+ }else{
+ return true;
+ }
+ },
+ onError(err, file, fileList) {
+ this.$message.error('涓婁紶澶辫触')
+ this.$refs.upload.clearFiles()
},
// 涓婁紶鍥剧墖鎴愬姛
- handleSuccessUpImg(response, file, fileList){
- console.log(response, file, fileList)
+ handleSuccessUpImg(response,){
+ if(response.code==200){
+ this.formData.imageUpload = response.data.url;
+ this.formData.imageName = response.data.name;
+ }
},
submitForm(){
- this.dialogVisible = false
+ this.upLoad = true;
+ let authorizedPerson = this.formData.authorizedPerson.length>0?this.formData.authorizedPerson.join(','):''
+ delete this.formData.createTime
+ delete this.formData.updateTime
+ delete this.formData.createUser
+ delete this.formData.updateUser
+ this.formData.authorizedPerson = authorizedPerson
+ this.$axios.post(this.$api.deviceScope.upDeviceParameter, this.formData, {
+ headers: {
+ 'Content-Type': 'application/json'
+ }
+ }).then(res => {
+ if (res.code === 201) {
+ this.upLoad = false
+ return
+ }
+ this.$message.success('淇敼鎴愬姛')
+ this.upLoad = false
+ this.refreshTable()
+ this.dialogVisible = false
+ }).catch(e => {
+ this.$message.error('淇敼澶辫触')
+ this.dialogVisible = false
+ this.upLoad = false
+ })
}
- }
}
+ }
</script>
diff --git a/src/components/view/a6-device-overview.vue b/src/components/view/a6-device-overview.vue
index 7c83b47..d330033 100644
--- a/src/components/view/a6-device-overview.vue
+++ b/src/components/view/a6-device-overview.vue
@@ -33,16 +33,17 @@
width: calc(100% - 40px);
height: calc(100% - 60px - 80px - 10px - 40px);
padding: 20px;
+ overflow-y: auto;
}
- ul {
+ .card {
list-style-type: none;
display: grid;
grid-template-columns: repeat(auto-fit, 375px);
- justify-content: center;
+ /* justify-content: center; */
grid-gap: 16px;
}
- ul li{
+ .card li{
width: 375px;
height: 165px;
border-radius: 8px 8px 8px 8px;
@@ -57,14 +58,14 @@
position: relative;
overflow: hidden;
}
- ul li .img{
+ .card li .img{
width: 114px;
height: 114px;
border-radius: 16px;
margin-right: 24px;
}
.list-left .list-left-info{
- line-height: 30px;
+ line-height: 36px;
display: flex;
}
.text-truncate {
@@ -131,7 +132,7 @@
<div class="search">
<div class="search_thing">
<div class="search_label">鐘舵�侊細</div>
- <el-select v-model="searchForm.status" placeholder="鍏ㄩ儴" size="small">
+ <el-select v-model="entity.deviceStatus" placeholder="鍏ㄩ儴" size="small">
<el-option
v-for="item in options"
:key="item.value"
@@ -142,18 +143,17 @@
</div>
<div class="search_thing">
<div class="search_label">璁惧鍚嶇О锛�</div>
- <div class="search_input"><el-input size="small" placeholder="璇疯緭鍏�" clearable v-model="searchForm.name"
- @keyup.enter.native="refreshTable()"></el-input></div>
+ <div class="search_input"><el-input size="small" placeholder="璇疯緭鍏�" clearable v-model="entity.deviceName"></el-input></div>
</div>
<div class="search_thing" style="padding-left: 30px;">
<el-button size="small" @click="refresh()">閲� 缃�</el-button>
- <el-button size="small" type="primary" @click="refreshTable()">鏌� 璇�</el-button>
+ <el-button size="small" type="primary" @click="currentPage= 1,list=[],finishLoding = false,refreshTable()">鏌� 璇�</el-button>
</div>
</div>
- <div class="table">
- <ul v-loading="loading" @scroll="scrollFn">
+ <div class="table" @scroll="scrollFn">
+ <ul v-loading="loading" class="card">
<li v-for="(m,i) in list" :key="i">
- <el-image class="img">
+ <el-image class="img" :src="javaApi+'/img/'+m.imageUpload">
<div slot="error" class="image-error" style="width: 112px;
height: 112px;
border-radius: 16px;
@@ -161,22 +161,26 @@
align-items: center;
justify-content: center;
border: 1px solid #EEEEEE;">
- <i class="el-icon-picture-outline"></i>
+ <i class="el-icon-picture-outline" style="font-size:30px;color:#666666;"></i>
</div>
</el-image>
<div class="list-left">
<div class="list-left-info">
<span class="label">璁惧鍚嶇О锛�</span>
- <span style="color:#3A7BFA;font-size: 16px;display: inline-block;
- width: 129px; word-break: break-all;" class="text-truncate">灏忚垶鐏垫缉娑℃贩鍚堝櫒</span>
+ <span style="color:#3A7BFA;
+ font-size: 16px;
+ display: inline-block;
+ width: 129px;
+ word-break: break-all;" class="text-truncate">{{m.deviceName?m.deviceName:'鏃�'}}</span>
</div>
<div class="list-left-info">
<span class="label">瑙勬牸鍨嬪彿锛�</span>
- <span style="color:#333333;font-size: 16px;">CASJTS-C004-01</span>
+ <span style="color:#333333;font-size: 16px;">{{m.specificationModel?m.specificationModel:'鏃�'}}</span>
</div>
<div class="list-left-info">
<span class="label">鐘舵�侊細</span>
- <el-tag :type="m.type">鏍囩浜�</el-tag>
+ <el-tag :type="m.type" v-if="m.deviceStatusName">{{m.deviceStatusName}}</el-tag>
+ <span v-else style="color:#333333;font-size: 16px;">鏃�</span>
</div>
</div>
<div class="circles" :class="m.type">
@@ -187,17 +191,17 @@
</div>
</li>
</ul>
- <div v-if="list.length<1&&!loading&&!isLoding&&!finishLoding" style="color:#909399;font-size:14px;text-align: center;margin-top:200px" >鏆傛棤鏁版嵁</div>
- <div v-if="!noMore&&list.length>0">
+ <div v-if="list.length<1&&!loading&&!isLoding" style="color:#909399;font-size:14px;text-align: center;margin-top:200px" >鏆傛棤鏁版嵁</div>
+ <div v-if="list.length>0">
<el-button
- v-show="isLoding"
+ v-if="isLoding"
type="text"
style="display: flex; margin: 0 auto; color: #909399"
- ><i class="el-icon-loading"></i
+ ><i class="el-icon-loading" style="font-size:20px"></i
></el-button>
<el-button
type="text"
- v-show="finishLoding"
+ v-if="finishLoding"
style="display: flex; margin: 0 auto; color: #909399"
>宸茬粡娌℃湁鏇村鍟</el-button
>
@@ -210,83 +214,103 @@
export default {
data() {
return {
+ entity:{
+ deviceStatus: null,
+ deviceName: null,
+ orderBy: {field: "id", order: "asc"}
+ },
options:[],
- // 鎼滅储琛ㄥ崟
- searchForm:{},
- list:[
- {
- type:'danger'
- },
- {
- type:'danger'
- },
- {
- type:'success'
- },
- {
- type:'success'
- },
- {
- type:'danger'
- },
- {
- type:'danger'
- },
- {
- type:'danger'
- },
- {
- type:'danger'
- },
- {
- type:'warning'
- },
- {
- type:'warning'
- },
- ],
- noMore: false, // 鎼滅储缁撴灉鏃犵殑灞曠ず
+ list:[],
currentPage: 1, // 褰撳墠椤�
- pageSize: 12, // 涓�椤�12鏉�
+ pageSize: 16, // 涓�椤�16鏉�
total: '',
- loading: false, // 缁勪欢loading鐨勫睍绀�,榛樿涓簍rue
+ loading: true, // 缁勪欢loading鐨勫睍绀�,榛樿涓簍rue
isLoding: false, // 鍔犺浇涓紝loading鍥炬爣,榛樿涓簍rue
finishLoding: false // 鍔犺浇瀹屾垚锛屾樉绀哄凡缁忔病鏈夋洿澶氫簡
}
},
created() {
+ this.selectEnumByCategory()
+ this.currentPage = 1;
+ this.list = [];
this.refreshTable();
- },
- mounted() {
- // window.addEventListener("scroll", this.throttle(this.scrollFn, 500));
- },
- destroyed() {
- // window.removeEventListener("scroll", this.throttle(), false);
},
methods: {
refreshTable() {
- this.loading = true
- this.isLoding = true
- this.$axios.get(this.$api.deviceScope.selectEquipmentOverview).then(res => {
- console.log(11111,res)
+ if(this.currentPage>1){
+ this.isLoding = true
+ }else{
+ this.loading = true
+ }
+ if(this.list.length==0){
+ window.addEventListener("scroll", this.throttle(this.scrollFn, 20000));
+ }
+ this.$axios.post(this.$api.deviceScope.selectDeviceParameter,{
+ page: {
+ current: this.currentPage,
+ size: this.pageSize
+ },
+ entity: this.entity
+ }, {
+ headers: {
+ 'Content-Type': 'application/json'
+ }
+ }).then(res => {
+ if(res.code==200){
+ this.total = res.data.body.total
+ let list = res.data.body.records.map(m=>{
+ switch (m.deviceStatus){
+ case '0':
+ // 姝ｅ父
+ m.type ='success'
+ break;
+ case '1':
+ // 鎶ュ簾
+ m.type ='warning'
+ break;
+ case '2':
+ // 淇濅慨
+ m.type ='danger'
+ break;
+ }
+ this.options.forEach(j=>{
+ if(m.deviceStatus==j.value){
+ m.deviceStatusName = j.label
+ }
+ })
+ return m;
+ })
+ if(list.length==0){
+ this.finishLoding = true;
+ }else{
+ if(list.length<this.pageSize){
+ this.finishLoding = true;
+ }
+ this.list = this.list.concat(list)
+ }
+ }
+ this.loading = false
+ this.isLoding = false;
})
- // allCoursesList({
- // currentPage: this.currentPage,
- // pageSize: this.pageSize,
- // keyword: this.$route.query.keywords
- // }).then((res) => {
- // if (res.data.code === 0) {
- // this.loading = false
- // this.keyWordsCoursesList = [...res.data.data.rows]
- // this.total = res.data.data.total
- // if (this.keyWordsCoursesList.length === 0) {
- // this.noMore = true;
- // }
- // }
- // });
},
refresh() {
-
+ this.currentPage= 1;
+ this.list=[];
+ this.finishLoding = false;
+ this.entity={
+ deviceStatus: null,
+ deviceName: null,
+ orderBy: {field: "id", order: "asc"}
+ };
+ this.refreshTable()
+ },
+ // 鑾峰彇瀛楀吀
+ selectEnumByCategory() {
+ this.$axios.post(this.$api.enums.selectEnumByCategory, {
+ category: "璁惧鐘舵��"
+ }).then(res => {
+ this.options = res.data
+ })
},
// 婊氬姩瑙﹀簳鍔犺浇
scrollFn() {
@@ -298,13 +322,8 @@
scrollTop + clientHeight >= scrollHeight - height &&
scrollHeight != 0
) {
- if (this.pageSize > this.total) {
- this.isLoding = false;
- this.finishLoding = true;
- window.removeEventListener("scroll", this.throttle(), false);
- }else{
- this.currentPage + 1;
- this.pageSize = this.pageSize += 12;
+ if (!this.finishLoding&&this.currentPage*this.pageSize<this.total) {
+ this.currentPage = this.currentPage + 1;
this.refreshTable();
}
} else {
@@ -325,6 +344,9 @@
}
};
},
- }
+ },
+ destroyed() {
+ window.removeEventListener("scroll", this.throttle(), false);
+ },
}
</script>
--
Gitblit v1.9.3