<template>
|
<view class="template-job tn-safe-area-inset-bottom tn-skeleton">
|
|
<!-- 顶部自定义导航 -->
|
<tn-nav-bar fixed style="position: absolute;z-index: 999999999;" alpha customBack>
|
<view slot="right" class='tn-custom-nav-bar__back' @click="goBack">
|
|
<text style="margin-right: 20px;">新增</text>
|
<!-- <text class='tn-icon add'></text> -->
|
</view>
|
<!-- <text class="title_linespan" @click="goAchor">基站</text> -->
|
<text v-if="isAchor==false" class="title_linespan" style="margin-left: 10px;" @click="goAchor">标签管理</text>
|
<text v-else class="title_linespan" style="margin-left: 10px;" @click="goTag">标签管理</text>
|
</tn-nav-bar>
|
|
<view v-show="lock==false" class="page-wrap u-skeleton">
|
<view style="display: flex;width: 50%;left: 5%"
|
:style="{display:'flex', top: topheight+'px',position: 'absolute',width: '50%',left: '5%'}">
|
|
<view style="color: #00aaff;">在线：{{online}}</view>
|
<view style="color: #00aaff;margin-left: 20px;">离线：{{offline}}</view>
|
</view>
|
<data-list :width="width" class="data-list" ref="list" @load="handleLoad" @refresh="handleRefresh"
|
style="margin-top: 100px;">
|
|
<view v-for="(item, index) in list" :key="index">
|
<tn-button shape="icon" class="tn-icon-edit" style="position: absolute;left: 85%;" size="lg"
|
@click="editClick(item,index)"></tn-button>
|
<view style="display: flex;margin-bottom: 10px;" class="flex flex-direction">
|
<u-badge v-if="item.online==1" style="margin-top: 8px;margin-right: 8px;" :isDot="true"
|
type="success"></u-badge>
|
<u-badge v-else style="margin-top: 8px;margin-right: 8px;" :isDot="true" type="info"></u-badge>
|
<view>编号:{{item.tagid}}</view>
|
<view style="margin-left: 20px;">名称:{{item.personname}}</view>
|
<!-- <view v-if="item.ponline==1" style="margin-left: 20px;">在线</view>
|
<view v-else style="margin-left: 20px;">离线</view> -->
|
<view style="margin-left: 20px;">
|
版本:{{item.version==null ? '未知' : item.version}}</view>
|
<!-- <view style="margin-left: 20px;">电量:{{item.ppower}}%</view> -->
|
</view>
|
<view style="display: flex;margin-left: 14px;margin-bottom: 10px;">
|
<view style="color: #5e5e5e;">标签类型:{{item.type}}</view>
|
<!-- <view style="margin-left: 14px;color: #5e5e5e;">{{item.psex}}</view> -->
|
<view style="margin-left: 14px;color: #5e5e5e;">部门:{{item.department}}</view>
|
</view>
|
<view style="display: flex;margin-left: 14px;margin-bottom: 10px;">
|
<view style="color: #5e5e5e;">提醒标签:{{item.mestagid}}</view>
|
<!-- <view style="margin-left: 14px;color: #5e5e5e;">{{item.psex}}</view> -->
|
<view style="margin-left: 14px;color: #5e5e5e;">联动闭锁:{{item.bisuoid}}</view>
|
</view>
|
<view style="display: flex;margin-left: 14px;margin-bottom: 10px;">
|
<view style="color: #5e5e5e;">加密:{{item.encryption}}</view>
|
<!-- <view style="margin-left: 14px;color: #5e5e5e;">{{item.psex}}</view> -->
|
<view style="margin-left: 14px;color: #5e5e5e;">差分数据源:{{item.rtcm}}</view>
|
</view>
|
<view style="margin-left: 14px;margin-bottom: 10px;color: #5e5e5e;">时间:{{item.addtime}}</view>
|
<u-line style="margin-left: 14px;margin-bottom: 10px;"></u-line>
|
</view>
|
</data-list>
|
</view>
|
<u-modal style="position: absolute;z-index: 99999999999999;" buttonReverse confirmText="保存" cancelText="取消"
|
:show="showpopup" @cancel="cancelmodal" @confirm="submitForm" ref="uModal" :showCancelButton="true"
|
:closeOnClickOverlay="true">
|
<!-- <tn-popup v-model="showpopup" mode="bottom" closeBtn>
|
<view class="page-wrap u-skeleton"> -->
|
<!-- <view class="item-wrap"> -->
|
<!-- <view style="max-height: 300px; overflow-y: auto;"> -->
|
<tn-form>
|
<tn-form-item label="编号:" :labelWidth="labelWidth">
|
<tn-input :disabled="disabled" v-model="form.tagid" inputAlign="right"
|
placeholder="请输入编号"></tn-input>
|
</tn-form-item>
|
<tn-form-item label="名称:" :labelWidth="labelWidth">
|
<tn-input v-model="form.personname" inputAlign="right" placeholder="请输入名称"></tn-input>
|
</tn-form-item>
|
<tn-form-item label="加密:" :labelWidth="labelWidth">
|
<!-- <tn-input v-model="form.encryption" inputAlign="right" placeholder="请输入内容"></tn-input> -->
|
<tn-input v-model="form.encryption" type="select" @click="show6 = true" placeholder="请选择是否加密" />
|
<tn-action-sheet :list="encryptionList" v-model="show6" @click="encryptionCallback"></tn-action-sheet>
|
</tn-form-item>
|
<tn-form-item label="持有类型:" :labelWidth="labelWidth">
|
<tn-input v-model="form.type" type="select" @click="show3 = true" placeholder="请选择类型" />
|
<tn-action-sheet :list="typeList" v-model="show3" @click="typeCallback"></tn-action-sheet>
|
</tn-form-item>
|
<tn-form-item label="标签类型:" :labelWidth="labelWidth">
|
<tn-input v-model="form.baoliu1" type="select" @click="show2 = true" placeholder="请选择类型" />
|
<tn-action-sheet :list="holdtypeList" v-model="show2" @click="holdtypeCallback"></tn-action-sheet>
|
</tn-form-item>
|
|
<tn-form-item label="关联部门:" :labelWidth="labelWidth">
|
<tn-input v-model="form.department" type="select" @click="show1 = true" placeholder="请选择关联部门" />
|
<tn-action-sheet :list="bumenList" v-model="show1" @click="bymenCallback"></tn-action-sheet>
|
</tn-form-item>
|
|
<tn-form-item label="提醒标签:" :labelWidth="labelWidth">
|
<u-badge v-if="tixingonlie==1 && form.mestagid!=''" :isDot="true" type="success"></u-badge>
|
<u-badge v-else-if="tixingonlie==0 && form.mestagid!=''" :isDot="true" type="info"></u-badge>
|
|
<tn-input v-model="form.mestagid" type="select" @click="show4 = true" placeholder="请选择提醒标签" />
|
<tn-action-sheet :list="tixinglist" v-model="show4" @click="tixingCallback"></tn-action-sheet>
|
<!-- <tn-input v-model="form.mestagid" inputAlign="right" placeholder="请输入提醒标签"></tn-input> -->
|
</tn-form-item>
|
|
<tn-form-item label="联动闭锁:" :labelWidth="labelWidth">
|
<u-badge v-if="bisuoonlie==1 && form.mestagid!=''" :isDot="true" type="success"></u-badge>
|
<u-badge v-else-if="tixingonlie==0 && form.mestagid!=''" :isDot="true" type="info"></u-badge>
|
<!-- <tn-input v-model="form.bisuoid" inputAlign="right" placeholder="请输入联动闭锁"></tn-input> -->
|
<tn-input v-model="form.bisuoid" type="select" @click="show5 = true" placeholder="请选择联动闭锁" />
|
<tn-action-sheet :list="bisuolist" v-model="show5" @click="bisuoCallback"></tn-action-sheet>
|
</tn-form-item>
|
|
</tn-form>
|
<!-- </view> -->
|
<!-- </view>
|
<button style="margin-top: 20px;" type="primary" @click="submitForm">保存围栏</button> -->
|
</u-modal>
|
<!-- </tn-popup> -->
|
<tn-skeleton :show="showSkeleton"></tn-skeleton>
|
<successCom ref="refSuccess"></successCom>
|
</view>
|
</template>
|
|
<script>
|
import successCom from '@/components/success.vue'
|
|
import {
|
minLogin
|
} from '@/js/minLogin.js'
|
import {
|
findbisuo,
|
findtixing,
|
saveper,
|
updateper,
|
findbumen,
|
findTag
|
} from '@/config/api.js';
|
import {
|
pagesEquipment
|
} from '@/js/pages/equipment.js'
|
export default {
|
mixins: [minLogin, pagesEquipment],
|
components: {
|
successCom
|
},
|
data() {
|
return {
|
show5: false,
|
show4: false,
|
show3: false,
|
show2: false,
|
labelWidth: 200,
|
show1: false,
|
disabled: false,
|
show6: false,
|
encryptionList: [{
|
text: '是'
|
},
|
|
{
|
text: '否'
|
}
|
],
|
typeList: [{
|
text: '手持标签'
|
},
|
|
{
|
text: '车载标签'
|
},
|
|
{
|
text: '高精度工卡'
|
},
|
{
|
text: '提醒标签'
|
},
|
{
|
text: '闭锁装置'
|
}
|
],
|
holdtypeList: [{
|
text: '工作负责人'
|
},
|
|
{
|
text: '专责监护人'
|
},
|
|
{
|
text: '登高作业人'
|
},
|
{
|
text: '一般作业人'
|
},
|
{
|
text: '吊车'
|
},
|
{
|
text: '斗臂车'
|
},
|
|
{
|
text: '挖掘机'
|
}, {
|
text: '泵车'
|
}, {
|
text: '一般车辆'
|
},
|
|
],
|
|
showpopup: false,
|
form: {
|
baoliu1: '',
|
tagid: '',
|
encryption:'',
|
personname: '',
|
department: '',
|
type: '',
|
mestagid: '',
|
company: '',
|
alterPerson: '',
|
perCompany: '',
|
bisuoid: ''
|
},
|
width: '40%',
|
online: 0,
|
offline: 0,
|
isAchor: false,
|
warnindex: 0,
|
warlist: {},
|
lock: false,
|
keyword: '',
|
pageNo: 1,
|
pageSize: 10,
|
imgStyle: {
|
width: '100px',
|
height: '1000px',
|
borderRadius: '50%'
|
},
|
showSkeleton: true,
|
options: [{
|
text: '删除',
|
style: {
|
backgroundColor: '#F93737',
|
}
|
}, ],
|
bumenList: [],
|
tixinglist: [],
|
tixingonlie: '',
|
bisuoonlie: '',
|
bisuolist: [],
|
boxKey: 0,
|
scrollHeight: 500,
|
topheight: 0,
|
paddingTop: 60,
|
emitDate: 'indexHome',
|
show: false,
|
time: '',
|
list: [],
|
total: 0,
|
options1: [{
|
text: '删除',
|
style: {
|
backgroundColor: '#F93737'
|
}
|
}]
|
}
|
},
|
computed: {
|
countList() {
|
let num = 0;
|
for (let i in this.list) {
|
num += this.list[i].fQty;
|
}
|
return num;
|
}
|
},
|
mounted() {
|
this.findbisuoall()
|
this.findbumenall()
|
this.findtixingall()
|
this.topheight = this.vuex_custom_bar_height + 15
|
setTimeout(() => {
|
this.showSkeleton = false
|
}, 1000)
|
this.scrollHeight = this.screenHeight - 282;
|
|
setTimeout(() => {
|
this.paddingTop = this.vuex_padding_top
|
this.paddingTop += 5
|
}, 400)
|
|
},
|
methods: {
|
cancelmodal() {
|
this.showpopup = false
|
},
|
//保存围栏
|
submitForm() {
|
if (this.disabled == true) {
|
//修改
|
this.form.company = this.company
|
this.form.percompany = this.company
|
this.form.alterPerson = this.vuex_user
|
|
updateper(this.form).then((res) => {
|
|
|
// if (res.code == 0) {
|
|
// }
|
this.$refs.refSuccess.showBox({
|
type: 'success',
|
txt: "修改成功"
|
});
|
this.showpopup = false
|
setTimeout(() => {
|
this.handleRefresh({
|
page: 1,
|
size: this.pageSize
|
}, () => {
|
// 可以在这里处理加载完成后的逻辑
|
});
|
}, 1000)
|
|
|
})
|
} else {
|
//新增
|
if (this.form.mestagid == '') {
|
this.form.mestagid = '-1'
|
}
|
if (this.form.bisuoid == '') {
|
this.form.bisuoid = '-1'
|
}
|
this.form.company = this.company
|
this.form.percompany = this.company
|
this.form.alterPerson = this.vuex_user
|
|
saveper(this.form).then((res) => {
|
console.log(res);
|
// if (res.code == 0) {
|
this.$refs.refSuccess.showBox({
|
type: 'success',
|
txt: "保存成功"
|
});
|
this.showpopup = false
|
this.handleRefresh({
|
page: 1,
|
size: this.pageSize
|
}, () => {
|
// 可以在这里处理加载完成后的逻辑
|
});
|
// }
|
|
})
|
}
|
},
|
goBack() {
|
this.showpopup = true
|
this.disabled = false
|
this.form.personname = ''
|
this.form.encryption = ''
|
this.form.tagid = ''
|
this.form.department = ''
|
this.form.mestagid = ''
|
this.form.type = ''
|
this.form.bisuoid = ''
|
this.form.baoliu1 = ''
|
},
|
|
|
findbisuoall() {
|
if (this.vuex_is_login) {
|
const params = {
|
company: this.company,
|
juese: uni.getStorageSync('juese'),
|
}
|
findbisuo(params).then((res) => {
|
console.log(res);
|
if (res.code == 0) {
|
this.bisuolist = res.data.map(item => ({
|
value: item.online,
|
text: item.tagid
|
}));
|
}
|
|
})
|
}
|
|
},
|
|
findtixingall() {
|
if (this.vuex_is_login) {
|
const params = {
|
company: this.company,
|
juese: uni.getStorageSync('juese'),
|
}
|
findtixing(params).then((res) => {
|
console.log(res);
|
if (res.code == 0) {
|
this.tixinglist = res.data.map(item => ({
|
value: item.online,
|
text: item.tagid
|
}));
|
// } else {
|
// this.$refs.refSuccess.showBox({
|
// type: 'error',
|
// txt: res.msg
|
// });
|
}
|
})
|
}
|
|
},
|
|
findbumenall() {
|
if (this.vuex_is_login) {
|
const params = {
|
company: this.company,
|
juese: uni.getStorageSync('juese'),
|
}
|
findbumen(params).then((res) => {
|
console.log(res);
|
if (res.code == 0) {
|
this.bumenList = res.data.map(item => ({
|
value: item.name,
|
text: item.name
|
}));
|
// } else {
|
// this.$refs.refSuccess.showBox({
|
// type: 'error',
|
// txt: res.msg
|
// });
|
}
|
})
|
}
|
|
},
|
bymenCallback(index) {
|
console.log(this.bumenList);
|
this.form.department = this.bumenList[index].text;
|
},
|
bisuoCallback(index) {
|
console.log(this.bisuolist);
|
this.form.bisuoid = this.bisuolist[index].text;
|
this.bisuoonlie = this.bisuolist[index].value;
|
},
|
tixingCallback(index) {
|
console.log(this.tixinglist);
|
this.form.mestagid = this.tixinglist[index].text;
|
this.tixingonlie = this.tixinglist[index].value;
|
},
|
typeCallback(index) {
|
this.form.type = this.typeList[index].text;
|
},
|
encryptionCallback(index) {
|
this.form.encryption = this.encryptionList[index].text;
|
},
|
|
holdtypeCallback(index) {
|
this.form.baoliu1 = this.holdtypeList[index].text;
|
},
|
editClick(e, i) {
|
this.editindex = i
|
this.showpopup = true
|
this.disabled = true
|
this.form.personname = e.personname
|
this.form.encryption = e.encryption
|
|
this.form.tagid = e.tagid
|
this.form.department = e.department
|
this.form.mestagid = e.mestagid
|
this.form.type = e.type
|
this.form.bisuoid = e.bisuoid
|
this.form.baoliu1 = e.baoliu1
|
|
},
|
goAchor() {
|
this.isAchor = false
|
this.$emit('goAchor');
|
},
|
goTag() {
|
this.isAchor = true
|
},
|
|
// 模拟请求加载数据
|
handleLoad(data, callback) {
|
const params = {
|
current: data.page,
|
size: data.size,
|
company: this.company,
|
juese: uni.getStorageSync('juese'),
|
}
|
if (this.vuex_is_login) {
|
findTag(params).then((res) => {
|
console.log(res);
|
this.online = res.online
|
this.offline = res.offline
|
if (res.code == 0) {
|
let list = [];
|
setTimeout(() => {
|
let list = [];
|
for (var i = 0; i < res.data.records.length; i++) {
|
list.push(res.data.records[i]);
|
}
|
this.list = [...this.list, ...list];
|
callback({
|
list: this.list,
|
total: res.data.total
|
});
|
}, 1500);
|
}
|
})
|
} else {
|
callback({
|
list: [],
|
total: 0
|
});
|
}
|
},
|
handleSearch(data, callback) {
|
const params = {
|
current: 1,
|
size: 10,
|
juese: uni.getStorageSync('juese'),
|
company: this.company,
|
}
|
if (this.vuex_is_login) {
|
findTag(params).then((res) => {
|
|
this.online = res.online
|
this.offline = res.offline
|
this.list = []
|
if (res.code == 0) {
|
let list = [];
|
setTimeout(() => {
|
let list = [];
|
for (var i = 0; i < res.data.records.length; i++) {
|
list.push(res.data.records[i]);
|
}
|
this.list = [...this.list, ...list];
|
callback({
|
list: this.list,
|
total: res.data.total
|
});
|
}, 1500);
|
}
|
})
|
}
|
},
|
// 模拟请求数据刷新
|
handleRefresh(data, callback) {
|
const params = {
|
current: data.page,
|
size: data.size,
|
objectid: data.objectid,
|
juese: uni.getStorageSync('juese'),
|
company: this.company,
|
}
|
if (this.vuex_is_login) {
|
findTag(params).then((res) => {
|
this.online = res.online
|
this.offline = res.offline
|
if (res.code == 0) {
|
let list = [];
|
setTimeout(() => {
|
let list = [];
|
for (var i = 0; i < res.data.records.length; i++) {
|
list.push(res.data.records[i]);
|
}
|
this.list = []
|
this.list = [...this.list, ...list];
|
callback({
|
list: this.list,
|
total: res.data.total
|
});
|
}, 1500);
|
}
|
})
|
}
|
},
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
/* 鼠标未悬浮时效果设置 */
|
.title_linespan {
|
font-size: 17px;
|
font-weight: bold;
|
color: #000000
|
}
|
|
/* 鼠标悬浮后的设置 */
|
.title_linespan:hover {
|
font-size: 17px;
|
font-weight: bold;
|
color: #00aaff;
|
text-decoration: underline;
|
}
|
|
.modal-btn {
|
position: absolute;
|
left: 75%;
|
}
|
|
.modal-btn::before {
|
content: "\2022";
|
/* Unicode 字符编码表示的圆点 */
|
color: #5f5f5f;
|
/* 可以设置圆点的颜色，这里是红色 */
|
// margin-right: 5px; /* 可以设置圆点与文字之间的距离 */
|
/* 如果需要更大的圆点，可以使用下面的属性 */
|
font-size: 20px;
|
/* 设置圆点的大小 */
|
}
|
|
.modal-btn2 {
|
position: absolute;
|
left: 75%;
|
}
|
|
.modal-btn2::before {
|
content: "\2022";
|
/* Unicode 字符编码表示的圆点 */
|
color: #00aa00;
|
/* 可以设置圆点的颜色，这里是红色 */
|
// margin-right: 5px; /* 可以设置圆点与文字之间的距离 */
|
/* 如果需要更大的圆点，可以使用下面的属性 */
|
font-size: 20px;
|
/* 设置圆点的大小 */
|
}
|
|
.page-wrap {
|
height: 100%;
|
padding-top: 45px;
|
padding-left: 30rpx;
|
padding-right: 30rpx;
|
|
.test-view {
|
height: 300rpx;
|
}
|
|
.navbar-content {
|
width: 100%;
|
display: flex;
|
padding: 30rpx;
|
align-items: center;
|
justify-content: space-between;
|
}
|
|
.u-icon {
|
margin-left: 30rpx;
|
}
|
|
.item-wrap {
|
display: flex;
|
margin: 10rpx;
|
padding: 30rpx;
|
align-items: center;
|
border-radius: 16rpx;
|
box-shadow: 0rpx 8rpx 16rpx rgba(0, 0, 0, 0.11);
|
|
.avatar {
|
width: 150rpx;
|
height: 150rpx;
|
margin-right: 30rpx;
|
border-radius: 16rpx;
|
background-color: #c0c0c0;
|
}
|
|
.item {
|
// width: 100rpx;
|
height: 30rpx;
|
margin-bottom: 10rpx;
|
border-radius: 16rpx;
|
background-color: #c8c7cc;
|
}
|
|
}
|
}
|
</style>
|
