310 lines
7.1 KiB
Vue
310 lines
7.1 KiB
Vue
|
<template>
|
|||
|
|
<view class="content">
|
|||
|
|
<VNavigationBar style="position: relative;z-index: 99;" homeHeaderPaddingTop="0" backgroundColor="#fff"
|
|||
|
|
title-color="#000" title="设备管理"></VNavigationBar>
|
|||
|
|
|
|||
|
|
<!-- 固定部分：搜索框 -->
|
|||
|
|
<view class="search_box">
|
|||
|
|
<u-search placeholder="请输入设备名称..." @clear="getlistindex()" @search="getlistindex()" :showAction="false"
|
|||
|
|
v-model="equName" searchIconColor="#427FFE"></u-search>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 固定部分：新增按钮 -->
|
|||
|
|
<view class="add-btn" @click="goadd('add')">
|
|||
|
|
<text>+ 新增设备</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 固定部分：Tab切换（横向滚动） -->
|
|||
|
|
<view class="tab-scroll-container">
|
|||
|
|
<scroll-view class="tab-scroll-view" scroll-x="true" shows-horizontal-scroll-indicator="false">
|
|||
|
|
<view class="tap-box" v-for="(item,index) in tabList" :key="index" @click="gettap(item.value)">
|
|||
|
|
<view :class="{'lan' : tapindex == item.value}">{{ item.label }}</view>
|
|||
|
|
<view class="gang" v-if="tapindex == item.value"></view>
|
|||
|
|
</view>
|
|||
|
|
</scroll-view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 滚动部分：设备列表 -->
|
|||
|
|
<view class="list-container">
|
|||
|
|
<!-- 有数据时显示列表 -->
|
|||
|
|
<view class="c-box" v-for="(item,index) in arrlist" :key="index" v-if="arrlist.length > 0">
|
|||
|
|
<view class="box-top">
|
|||
|
|
<view>{{ item.equName || '设备名称' }}</view>
|
|||
|
|
<view style="display: flex;align-items: center; justify-content: space-between; width: 25%;">
|
|||
|
|
<view style="color: #43A045;" @click="goadd('edit',item.id)">编辑</view>
|
|||
|
|
<view style="color: #FF7272;" @click="dialogToggle(item.id)">删除</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="box-hui">
|
|||
|
|
<view class="box-left">设备型号:</view>
|
|||
|
|
<view>{{ item.equModel || '' }}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="box-hui">
|
|||
|
|
<view class="box-left">设备编号:</view>
|
|||
|
|
<view>{{ item.equNumber || '' }}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="box-hui">
|
|||
|
|
<view class="box-left">检定/校准周期:</view>
|
|||
|
|
<view>{{ item.equZq || '' }}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="box-hui">
|
|||
|
|
<view class="box-left">有效期:</view>
|
|||
|
|
<view>{{ item.validTime || '' }}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="box-hui">
|
|||
|
|
<view class="box-left">检定单位:</view>
|
|||
|
|
<view>{{ item.lastUnit || '' }}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="box-hui">
|
|||
|
|
<view class="box-left">计划检定时间:</view>
|
|||
|
|
<view>{{ item.nextCheckTime || '' }}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 无数据时显示提示 -->
|
|||
|
|
<view class="empty-tips" v-if="arrlist.length === 0">
|
|||
|
|
<image src="/static/internal/empty.png" class="empty-img"></image>
|
|||
|
|
<!-- <text>暂无设备</text> -->
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<uni-popup ref="alertDialog" type="dialog">
|
|||
|
|
<uni-popup-dialog cancelText="关闭" confirmText="同意" title="通知" content="您确认要删除吗" @confirm="dialogConfirm"
|
|||
|
|
@close="dialogClose"></uni-popup-dialog>
|
|||
|
|
</uni-popup>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import config from '@/config'
|
|||
|
|
import request from '../../utils/request';
|
|||
|
|
import VNavigationBar from "@/components/VNavigationBar.vue";
|
|||
|
|
import {
|
|||
|
|
getDictByCode
|
|||
|
|
} from "../../utils/utils";
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
components: {
|
|||
|
|
VNavigationBar
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
partnerId: '',
|
|||
|
|
arrlist: [],
|
|||
|
|
pageNum: 1,
|
|||
|
|
pageSize: 20,
|
|||
|
|
totalPages: 0,
|
|||
|
|
deleteid: '',
|
|||
|
|
equName: null,
|
|||
|
|
tabList: [{
|
|||
|
|
label: "全部",
|
|||
|
|
value: "0"
|
|||
|
|
}],
|
|||
|
|
tapindex: 0,
|
|||
|
|
type: null
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad(data) {
|
|||
|
|
this.partnerId = uni.getStorageSync('partnerId')
|
|||
|
|
if (data.value) {
|
|||
|
|
this.tapindex = parseInt(data.value)
|
|||
|
|
this.type = data.value === '0' ? null : data.value
|
|||
|
|
}
|
|||
|
|
this.getlistindex()
|
|||
|
|
this.getTab()
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
// this.getlistindex()
|
|||
|
|
},
|
|||
|
|
onReachBottom() {
|
|||
|
|
if (this.pageNum >= this.totalPages) {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '没有下一页数据',
|
|||
|
|
icon: 'none'
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
this.pageNum++
|
|||
|
|
this.getlistindex()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
gettap(value) {
|
|||
|
|
this.tapindex = value
|
|||
|
|
this.type = value === '0' ? null : value
|
|||
|
|
this.getlistindex()
|
|||
|
|
},
|
|||
|
|
async getTab() {
|
|||
|
|
const data = await getDictByCode("repair_equ_type");
|
|||
|
|
console.log('data123', data)
|
|||
|
|
this.tabList = [...this.tabList, ...data];
|
|||
|
|
console.log('this.tabList', this.tabList)
|
|||
|
|
},
|
|||
|
|
dialogToggle(id) {
|
|||
|
|
this.deleteid = id
|
|||
|
|
this.$refs.alertDialog.open()
|
|||
|
|
},
|
|||
|
|
async dialogConfirm() {
|
|||
|
|
let res = await request({
|
|||
|
|
url: '/admin-api/system/equInfo/' + this.deleteid,
|
|||
|
|
method: 'delete',
|
|||
|
|
})
|
|||
|
|
if (res.code == 200) {
|
|||
|
|
this.$refs.alertDialog.close()
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'none',
|
|||
|
|
title: '删除成功'
|
|||
|
|
})
|
|||
|
|
this.getlistindex()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
dialogClose() {
|
|||
|
|
this.$refs.alertDialog.close()
|
|||
|
|
},
|
|||
|
|
goadd(type, id) {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/pages-internal/deviceManagement/informationAdd?type=' + type + '&id=' + id
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
async getlistindex() {
|
|||
|
|
let res = await request({
|
|||
|
|
url: '/admin-api/system/equInfo/list',
|
|||
|
|
method: 'get',
|
|||
|
|
data: {
|
|||
|
|
pageSize: this.pageSize,
|
|||
|
|
pageNum: this.pageNum,
|
|||
|
|
equName: this.equName,
|
|||
|
|
type: this.type,
|
|||
|
|
servicePackageId: 'weixiu'
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
if (this.pageNum != 1) {
|
|||
|
|
this.arrlist = this.arrlist.concat(res.rows)
|
|||
|
|
} else {
|
|||
|
|
this.arrlist = res.rows
|
|||
|
|
}
|
|||
|
|
let total = res.total
|
|||
|
|
this.totalPages = Math.ceil(total / this.pageSize);
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped lang="scss">
|
|||
|
|
.content {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100vh;
|
|||
|
|
background-color: white;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 固定搜索框 */
|
|||
|
|
.search_box {
|
|||
|
|
padding: 10px 15px;
|
|||
|
|
background: white;
|
|||
|
|
border-bottom: 1px solid #f5f5f5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 固定新增按钮 */
|
|||
|
|
.add-btn {
|
|||
|
|
width: 100%;
|
|||
|
|
color: #0174F6;
|
|||
|
|
text-align: center;
|
|||
|
|
padding: 10px 0;
|
|||
|
|
font-weight: bold;
|
|||
|
|
border-radius: 8px;
|
|||
|
|
margin: 10px 15px;
|
|||
|
|
width: calc(100% - 30px);
|
|||
|
|
border: 1px solid #0174F6;
|
|||
|
|
position: sticky;
|
|||
|
|
top: 50px;
|
|||
|
|
z-index: 9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* Tab横向滚动容器 */
|
|||
|
|
.tab-scroll-container {
|
|||
|
|
background: white;
|
|||
|
|
position: sticky;
|
|||
|
|
top: 100px;
|
|||
|
|
z-index: 8;
|
|||
|
|
border-bottom: 1px solid #f5f5f5;
|
|||
|
|
padding: 10px 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tab-scroll-view {
|
|||
|
|
white-space: nowrap;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 40px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tap-box {
|
|||
|
|
display: inline-block;
|
|||
|
|
min-width: 80px;
|
|||
|
|
text-align: center;
|
|||
|
|
padding: 0 10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.gang {
|
|||
|
|
height: 4px;
|
|||
|
|
background: #327DFB;
|
|||
|
|
width: 80%;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.lan {
|
|||
|
|
color: #0D2E8D;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 滚动列表容器 */
|
|||
|
|
.list-container {
|
|||
|
|
flex: 1;
|
|||
|
|
overflow-y: auto;
|
|||
|
|
padding: 0 15px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 列表项样式 */
|
|||
|
|
.c-box {
|
|||
|
|
background: #F7F8FC;
|
|||
|
|
border-radius: 10px;
|
|||
|
|
padding: 10px;
|
|||
|
|
margin-bottom: 10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.box-top {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
padding-bottom: 10px;
|
|||
|
|
border-bottom: 1px solid #eee;
|
|||
|
|
margin-bottom: 10px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.box-hui {
|
|||
|
|
display: flex;
|
|||
|
|
margin-bottom: 5px;
|
|||
|
|
color: #999;
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.box-left {
|
|||
|
|
margin-right: 10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 空列表提示 */
|
|||
|
|
.empty-tips {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
padding: 40px 0;
|
|||
|
|
color: #999;
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.empty-img {
|
|||
|
|
width: 240px;
|
|||
|
|
height: 200px;
|
|||
|
|
margin-bottom: 10px;
|
|||
|
|
}
|
|||
|
|
</style>
|