<template>
|
<a-modal
|
class="modelSize"
|
title="配置传感器"
|
destoryOnClose
|
:visible="visible"
|
@cancel="handleCancel"
|
@ok="handleOk"
|
okText="保存"
|
>
|
<div class="standardTable">
|
<a-table
|
:loading="loading"
|
:pagination="pagination"
|
:data-source="dataSource"
|
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: handleRowSelectChange }"
|
@change="handleTableChange"
|
:columns="columns"
|
>
|
<template slot="unitData">
|
<a-select default-value="" style="width: 120px" @change="e=>handleChangeUnit(e)">
|
<a-select-option :value="item" v-for="(item,index) in unitData" :key="index">
|
{{item}}
|
</a-select-option>
|
</a-select>
|
</template>
|
<template slot="operation" slot-scope="text, record, index">
|
<div class="editable-row-operations">
|
<span v-if="record.editable">
|
<a @click="() => save(record.key)">Save</a>
|
<a-popconfirm title="Sure to cancel?" @confirm="() => cancel(record.key)">
|
<a>Cancel</a>
|
</a-popconfirm>
|
</span>
|
<span v-else>
|
<a :disabled="editingKey !== ''" @click="() => edit(record.key)">Edit</a>
|
</span>
|
</div>
|
</template>
|
</a-table>
|
</div>
|
</a-modal>
|
</template>
|
|
<script lang="ts">
|
import * as _ from "lodash";
|
import { get, post } from "@/util/request";
|
import {
|
Vue,
|
Prop,
|
Component,
|
Emit,
|
Model,
|
Watch
|
} from "vue-property-decorator";
|
@Component({
|
components: {}
|
})
|
export default class DistribRole extends Vue {
|
@Prop({
|
type: Boolean,
|
default: false
|
})
|
private visible!: boolean;
|
|
@Prop({
|
type: Object,
|
default() {
|
return {};
|
}
|
})
|
private record!: any;
|
@Prop({
|
type: Boolean,
|
default: false
|
})
|
private loading!: boolean;
|
|
private unitData:number[]=[]
|
|
private temp:number[]=[]
|
|
private dataSource: any[] = [];
|
|
private handleChangeUnit(e){
|
console.log(e)
|
}
|
|
@Prop({
|
type: Array,
|
default: () => []
|
})
|
private selectedRows!: any[];
|
private selectedRowKeys: any[] = [];
|
private selectedRowKeysMiddle:any[]=[];//用于取消按钮，比对
|
private total: any = null;
|
private roleNames: any[] = [];
|
// private needTotalList: any[] = [];
|
|
private columns: any[] = [
|
{
|
title: "名称",
|
dataIndex: "name"
|
},
|
|
{
|
title: "键值",
|
dataIndex: "code"
|
},
|
{
|
title: "下限值",
|
dataIndex: "lower"
|
},
|
{
|
title: "上限值",
|
dataIndex: 'upper'
|
},
|
{
|
title: "单位",
|
dataIndex: 'defaultUnitKey',
|
scopedSlots: {
|
customRender: "unitData"
|
}
|
},
|
{
|
title: "描述",
|
dataIndex: 'desc'
|
},
|
{
|
title: 'operation',
|
dataIndex: 'operation',
|
scopedSlots: { customRender: 'operation' },
|
}
|
];
|
|
get pagination(): any {
|
return {
|
showSizeChanger: false,
|
showQuickJumper: false,
|
// pageSizeOptions:null,//制定每页选择多少条
|
total: this.total ? this.total : 0, //获取总数必须这样写，不然获取pagination会出错
|
pageSize: 6
|
};
|
}
|
|
private created() {
|
this.snesorData()
|
this.getUnitData()
|
}
|
@Watch("record", {
|
immediate: true,
|
deep: true
|
}) //回调，拿到数据赋值
|
private recordChange(newValue: any, oldValue: any): void {
|
|
this.selectedRowKeys=[];
|
//判断是否存在roleNames,存在的话 ，网络请求数据，
|
//比对成功，处于选中状态
|
if (newValue.roles) {
|
for (let i = 0; i < newValue.roles.length; i++) {
|
this.selectedRowKeys.push(newValue.roles[i].id);
|
}
|
}
|
|
this.selectedRowKeysMiddle=this.selectedRowKeys;
|
}
|
|
// 请求传感器数据
|
private snesorData(){
|
get("sensor/getAllSensor", {
|
current:1,
|
size:100,
|
orderType:0
|
})
|
.then(res => {
|
this.dataSource = res.data.data.manageRoles;
|
this.total = res.data.data.totalNumber;
|
// 遍历把unit单独放入变量
|
// for (let i = 0; i < res.data.data.manageRoles.length; i++) {
|
// if(res.data.data.manageRoles[i].defaultUnitKey){
|
// this.unitData.push(res.data.data.manageRoles[i].defaultUnitKey)
|
// }
|
// }
|
});
|
}
|
// 请求字典单位数据
|
private getUnitData(){
|
get("dict/data/query",{type: 'unit'}).then(res=>{
|
this.unitData = res.data.data
|
})
|
}
|
|
//取消，删除按钮
|
private handleCancel() {
|
//取消，选中的角色，要进行清除，还原
|
this.selectedRowKeys=this.selectedRowKeysMiddle
|
this.DistribRoleVisible(false);
|
}
|
DistribRoleVisible(visible: boolean): void {
|
this.$emit("update:visible", visible);
|
}
|
//保存按钮
|
private handleOk() {
|
//插入更新数据库
|
if(this.selectedRowKeys!=this.selectedRowKeysMiddle){
|
//修改数据库
|
post("account/update",{
|
accountId:this.record.id,
|
roleIds:this.selectedRowKeys,
|
order:'updateTime',
|
orderType:1
|
}).then(res=>{
|
//保存成功，组件刷新数据
|
this.$emit('updateData')
|
this.DistribRoleVisible(false);
|
}).catch(err=>{
|
console.log(err)
|
})
|
}
|
}
|
|
private cleanSelectedKeys(): void {
|
this.handleRowSelectChange([], []);
|
}
|
|
//切换页码，网络请求
|
private handleTableChange(pagination: any, filters: any, sorter: any): void {
|
get("sensor/getAllSensor", {
|
// current: pagination.current,
|
// size: 6,
|
// order:'updateTime',
|
// orderType:1
|
current:1,
|
size:100,
|
orderType:0
|
})
|
.then(res => {
|
this.dataSource = res.data.data.manageRoles;
|
});
|
}
|
|
private handleRowSelectChange(selectedRowKeys: any, selectedRows: any): void {
|
this.selectedRowKeys = selectedRowKeys;
|
}
|
|
private initTotalList(columns: any[]) {
|
const totalList: any[] = [];
|
columns.forEach((column: any) => {
|
if (column.needTotal) {
|
totalList.push({ ...column, total: 0 });
|
}
|
});
|
return totalList;
|
}
|
}
|
</script>
|
|
|
<style lang="less">
|
.standardTable {
|
:global {
|
.ant-table-pagination {
|
margin-top: 24px;
|
}
|
}
|
.tableAlert {
|
margin-bottom: 16px;
|
}
|
}
|
|
.modelSize{
|
.ant-modal-content{
|
width: 800px;
|
}
|
}
|
</style>
|
