199 lines
5.6 KiB
Vue
199 lines
5.6 KiB
Vue
<template>
|
|
<el-container>
|
|
<el-header>
|
|
<div class="left-panel">
|
|
<div class="right-panel-search">
|
|
<el-button
|
|
type="primary"
|
|
icon="el-icon-refresh"
|
|
@click="syncData"
|
|
:loading="syncLoading"
|
|
>同步</el-button
|
|
>
|
|
</div>
|
|
</div>
|
|
</el-header>
|
|
<el-main class="nopadding">
|
|
<scTable
|
|
ref="table"
|
|
:apiObj="apiObj"
|
|
:params="apiParams"
|
|
row-key="id"
|
|
@selection-change="selectionChange"
|
|
stripe
|
|
>
|
|
<el-table-column label="序号" type="index" width="50"></el-table-column>
|
|
<el-table-column label="id" prop="id" min-width="90"></el-table-column>
|
|
<el-table-column
|
|
label="mac"
|
|
prop="code"
|
|
min-width="90"
|
|
></el-table-column>
|
|
<el-table-column label="电量" prop="third_info" min-width="90">
|
|
<template #default="scope">
|
|
<span v-if="scope.row.third_info"
|
|
>{{ scope.row.third_info.battery }}%</span
|
|
>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="状态" prop="third_info" min-width="90">
|
|
<template #default="scope">
|
|
<span
|
|
v-if="
|
|
scope.row.third_info && scope.row.third_info.workStatus === 0
|
|
"
|
|
><el-tag>运动</el-tag></span
|
|
>
|
|
<span
|
|
v-else-if="
|
|
scope.row.third_info && scope.row.third_info.workStatus === 2
|
|
"
|
|
><el-tag type="warning">静止</el-tag></span
|
|
>
|
|
<span v-else><el-tag type="warning">静止</el-tag></span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="在线" prop="third_info" min-width="90">
|
|
<template #default="scope">
|
|
<span v-if="scope.row.third_info.online"><el-tag type="success">在线</el-tag></span>
|
|
<span v-else><el-tag type="warning">离线</el-tag></span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="绑定对象" prop="employee" min-width="90">
|
|
<template #default="scope">
|
|
<span v-if="scope.row.employee">{{scope.row.employee_.name}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" fixed="right" align="center" width="180">
|
|
<template #default="scope">
|
|
<el-button-group>
|
|
<el-button
|
|
v-if="scope.row.employee !== null"
|
|
text
|
|
type="warning"
|
|
size="small"
|
|
@click="handleBindBlt(20, scope.row)"
|
|
>解绑</el-button
|
|
>
|
|
<el-button
|
|
v-else
|
|
text
|
|
type="primary"
|
|
size="small"
|
|
@click="handleBindBlt(10, scope.row)"
|
|
>绑定</el-button
|
|
>
|
|
</el-button-group>
|
|
</template>
|
|
</el-table-column>
|
|
</scTable>
|
|
</el-main>
|
|
</el-container>
|
|
<el-Dialog
|
|
title="绑定定位卡"
|
|
v-model="showBindBlt"
|
|
destroy-on-close
|
|
@closed="closeDrawer"
|
|
>
|
|
<el-form ref="dialogForm" :model="form" label-width="120px">
|
|
<!-- <el-form-item label="卡号">
|
|
{{ form.blt }}
|
|
</el-form-item> -->
|
|
<el-form-item label="mac">
|
|
{{ bindBltMac }}
|
|
</el-form-item>
|
|
<el-form-item label="绑定员工" v-if="dis==false">
|
|
<el-input
|
|
v-model="form.employee_name"
|
|
style="width:200px"
|
|
disabled
|
|
></el-input>
|
|
<ehsUserSelect :multiple="false" @submit="getEmployee"/>
|
|
</el-form-item>
|
|
</el-form>
|
|
<template #footer>
|
|
<el-button v-if="form.type === 10" type="primary" @click="submitBindBlt"
|
|
>绑定</el-button
|
|
>
|
|
<el-button v-if="form.type === 20" type="primary" @click="submitBindBlt"
|
|
>解绑</el-button
|
|
>
|
|
<el-button @click="showBindBlt = false">取消</el-button>
|
|
</template>
|
|
</el-Dialog>
|
|
</template>
|
|
<script>
|
|
import channelView from "./vchannel_view";
|
|
export default {
|
|
name: "blt",
|
|
components: {
|
|
channelView,
|
|
},
|
|
data() {
|
|
return {
|
|
syncLoading: false,
|
|
apiObj: this.$API.third.tdevice.list,
|
|
apiParams: {
|
|
type: 30,
|
|
},
|
|
selection: [],
|
|
search: {
|
|
keyword: null,
|
|
},
|
|
dis: false,
|
|
showBindBlt: false,
|
|
employeeList: [],
|
|
bindBltMac: "",
|
|
form: {
|
|
type: 10,
|
|
blt: "",
|
|
employee: null,
|
|
},
|
|
};
|
|
},
|
|
mounted() {
|
|
},
|
|
methods: {
|
|
//表格选择后回调事件
|
|
selectionChange(selection) {
|
|
this.selection = selection;
|
|
},
|
|
//同步
|
|
async syncData() {
|
|
this.syncLoading = true;
|
|
var res = await this.$API.third.tdevice.bltSync.req({});
|
|
this.$refs.table.refresh();
|
|
this.syncLoading = false;
|
|
},
|
|
getEmployee(data) {
|
|
this.form.employee=data.employee;
|
|
this.form.employee_name=data.name
|
|
},
|
|
handleBindBlt(type, row) {
|
|
this.dis = false;
|
|
this.form.blt = row.id;
|
|
this.form.code = row.code;
|
|
this.bindBltMac = row.code;
|
|
this.form.type = type;
|
|
if (type === 20) {
|
|
this.dis = true;
|
|
this.form.employee = row.employee;
|
|
}
|
|
this.showBindBlt = true;
|
|
},
|
|
submitBindBlt() {
|
|
let that = this
|
|
let form = {
|
|
code: this.form.code,
|
|
type: this.form.type,
|
|
employee: this.form.employee
|
|
}
|
|
that.$API.third.tdevice.bltBind.req(form).then((res) => {
|
|
this.showBindBlt = false;
|
|
that.$refs.table.refresh();
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|