Commit dc4dba71 authored by 姬鋆屾's avatar 姬鋆屾

推,修改无数据的统一格式并修改表格样式问题

parent 916521e1
// table-list 所需的一系列操作方法 // table-list 所需的一系列操作方法
/** /**
* formatter * formatter
* *
...@@ -10,8 +9,10 @@ ...@@ -10,8 +9,10 @@
*/ */
const formatter = (tableData, column, val) => { const formatter = (tableData, column, val) => {
const key = column.property; const key = column.property;
if(tableData.dict && tableData.dict[key]){ console.log(val);
const dict = tableData.dict[key] val = val ? val : "--";
if (tableData.dict && tableData.dict[key]) {
const dict = tableData.dict[key];
return dict[val] || val; return dict[val] || val;
} }
return val; return val;
...@@ -27,11 +28,11 @@ const formatter = (tableData, column, val) => { ...@@ -27,11 +28,11 @@ const formatter = (tableData, column, val) => {
const formatterAmount = (row, column) => { const formatterAmount = (row, column) => {
const property = column.property; const property = column.property;
const amount = row[property]; const amount = row[property];
if(!amount){ if (!amount) {
return '0.00'; return "0.00";
} }
if(amount == 0){ if (amount == 0) {
return '0.00'; return "0.00";
} }
return amount; return amount;
}; };
...@@ -46,15 +47,18 @@ const formatterAmount = (row, column) => { ...@@ -46,15 +47,18 @@ const formatterAmount = (row, column) => {
const formatterDate = (row, column) => { const formatterDate = (row, column) => {
const property = column.property; const property = column.property;
const time = row[property]; const time = row[property];
if(!time) return ''; if (!time) return "";
let date = new Date(Number(time)); let date = new Date(Number(time));
let Y = date.getFullYear() + '-'; let Y = date.getFullYear() + "-";
let M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-'; let M =
let D = panLeft(date.getDate()) + ' '; (date.getMonth() + 1 < 10
let h = panLeft(date.getHours()) + ':'; ? "0" + (date.getMonth() + 1)
let m = panLeft(date.getMinutes()) + ':'; : date.getMonth() + 1) + "-";
let D = panLeft(date.getDate()) + " ";
let h = panLeft(date.getHours()) + ":";
let m = panLeft(date.getMinutes()) + ":";
let s = panLeft(date.getSeconds()); let s = panLeft(date.getSeconds());
return Y+M+D+h+m+s; return Y + M + D + h + m + s;
}; };
/** /**
...@@ -67,16 +71,19 @@ const formatterDate = (row, column) => { ...@@ -67,16 +71,19 @@ const formatterDate = (row, column) => {
const formatterDateOnly = (row, column) => { const formatterDateOnly = (row, column) => {
const property = column.property; const property = column.property;
const time = row[property]; const time = row[property];
if(!time) return ''; if (!time) return "";
let date = new Date(Number(time)); let date = new Date(Number(time));
let Y = date.getFullYear() + '-'; let Y = date.getFullYear() + "-";
let M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-'; let M =
let D = panLeft(date.getDate()) + ' '; (date.getMonth() + 1 < 10
return Y+M+D; ? "0" + (date.getMonth() + 1)
: date.getMonth() + 1) + "-";
let D = panLeft(date.getDate()) + " ";
return Y + M + D;
}; };
function panLeft(num){ function panLeft(num) {
return num < 10 ? '0'+num : num; return num < 10 ? "0" + num : num;
} }
/** /**
...@@ -90,18 +97,18 @@ function panLeft(num){ ...@@ -90,18 +97,18 @@ function panLeft(num){
const find = (list, key, val) => { const find = (list, key, val) => {
let index = -1; let index = -1;
let data = null; let data = null;
list.forEach((item, i)=>{ list.forEach((item, i) => {
if(item[key] === val){ if (item[key] === val) {
index = i; index = i;
data = JSON.parse(JSON.stringify(item)); data = JSON.parse(JSON.stringify(item));
return; return;
} }
}) });
return { return {
index, index,
data, data,
} };
} };
/** /**
* 构造树型结构数据 * 构造树型结构数据
...@@ -112,24 +119,32 @@ const find = (list, key, val) => { ...@@ -112,24 +119,32 @@ const find = (list, key, val) => {
* @param {*} rootId 根Id 默认 0 * @param {*} rootId 根Id 默认 0
*/ */
function handleTree(data, id, parentId, children, rootId) { function handleTree(data, id, parentId, children, rootId) {
id = id || 'id' id = id || "id";
parentId = parentId || 'parentId' parentId = parentId || "parentId";
children = children || 'children' children = children || "children";
rootId = rootId || Math.min.apply(Math, data.map(item => { return item[parentId] })) || 0 rootId =
rootId ||
Math.min.apply(
Math,
data.map((item) => {
return item[parentId];
})
) ||
0;
//对源数据深度克隆 //对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data)) const cloneData = JSON.parse(JSON.stringify(data));
//循环所有项 //循环所有项
const treeData = cloneData.filter(father => { const treeData = cloneData.filter((father) => {
let branchArr = cloneData.filter(child => { let branchArr = cloneData.filter((child) => {
//返回每一项的子级数组 //返回每一项的子级数组
return father[id] === child[parentId] return father[id] === child[parentId];
}); });
branchArr.length > 0 ? father.children = branchArr : ''; branchArr.length > 0 ? (father.children = branchArr) : "";
//返回第一层 //返回第一层
return father[parentId] === rootId; return father[parentId] === rootId;
}); });
return treeData != '' ? treeData : data; return treeData != "" ? treeData : data;
}; }
export { export {
formatter, formatter,
...@@ -137,5 +152,5 @@ export { ...@@ -137,5 +152,5 @@ export {
formatterDate, formatterDate,
formatterDateOnly, formatterDateOnly,
find, find,
handleTree handleTree,
}; };
<template> <template>
<el-table <el-table
size='small' size="small"
:data="tableData" :data="tableData"
:row-key="handleRowKeyMethod" :row-key="handleRowKeyMethod"
:span-method="handleSpanMethod" :span-method="handleSpanMethod"
...@@ -8,114 +8,112 @@ ...@@ -8,114 +8,112 @@
@selection-change="handleSelectionChange" @selection-change="handleSelectionChange"
@sort-change="handleSortChange" @sort-change="handleSortChange"
@row-click="handleRowClick" @row-click="handleRowClick"
height="560"
:row-class-name="tableRowClassName" :row-class-name="tableRowClassName"
:empty-text='emptyText' :empty-text="emptyText"
border border
style="width: 100%"> style="width: 100%"
>
<el-table-column
v-for="column in columns"
:key="column.prop"
:type="column.type"
:index="handleIndexMethod"
:selectable="handleSelectableMethod"
:prop="column.prop"
:label="column.label"
:width="column.width"
:sortable="column.sortable"
:show-overflow-tooltip="column.tooltip"
:align="column.align || 'left'"
:formatter="column.formatter"
:reserve-selection="column.reserveSelection"
:subColumns="column.subColumns"
>
<el-table-column <el-table-column
v-for='column in columns' v-for="sunColumn in column.subColumns"
:key='column.prop' :key="sunColumn.prop"
:type="column.type" :type="sunColumn.type"
:index="handleIndexMethod" :prop="sunColumn.prop"
:selectable="handleSelectableMethod" :label="sunColumn.label"
:prop="column.prop" :width="sunColumn.width"
:label="column.label" :sortable="sunColumn.sortable"
:width="column.width" :align="sunColumn.align || 'left'"
:sortable="column.sortable" :formatter="sunColumn.formatter"
:show-overflow-tooltip="column.tooltip" />
:align="column.align || 'left'" </el-table-column>
:formatter='column.formatter'
:reserve-selection='column.reserveSelection'
:subColumns='column.subColumns'
>
<el-table-column
v-for='sunColumn in column.subColumns'
:key='sunColumn.prop'
:type="sunColumn.type"
:prop="sunColumn.prop"
:label="sunColumn.label"
:width="sunColumn.width"
:sortable="sunColumn.sortable"
:align="sunColumn.align || 'left'"
:formatter='sunColumn.formatter'
/>
</el-table-column>
</el-table> </el-table>
</template> </template>
<script> <script>
export default { export default {
props: { props: {
handleRowKeyMethod: { handleRowKeyMethod: {
type: Function, type: Function,
required: false, required: false,
default: row => { return row.id } default: (row) => {
return row.id;
},
}, },
handleSelectableMethod: { handleSelectableMethod: {
type: Function, type: Function,
required: false, required: false,
default: () => {} default: () => {},
}, },
handleIndexMethod: { handleIndexMethod: {
type: Function, type: Function,
required: false, required: false,
default: () => {} default: () => {},
}, },
handleSpanMethod: { handleSpanMethod: {
type: Function, type: Function,
required: false, required: false,
default: () => {} default: () => {},
}, },
handleSelectionChange: { handleSelectionChange: {
type: Function, type: Function,
required: false, required: false,
default: () => {} default: () => {},
}, },
handleRowClick: { handleRowClick: {
type: Function, type: Function,
required: false, required: false,
default: () => {} default: () => {},
}, },
handleSortChange: { handleSortChange: {
type: Function, type: Function,
required: false, required: false,
default: () => {} default: () => {},
}, },
tableRowClassName: { tableRowClassName: {
type: Function, type: Function,
required: false, required: false,
default: () => {} default: () => {},
}, },
loading: { loading: {
type: Boolean, type: Boolean,
required: false, required: false,
default: true default: true,
}, },
tableData: { tableData: {
type: Array, type: Array,
required: false, required: false,
default: () => [] default: () => [],
}, },
columns: { columns: {
type: Array, type: Array,
required: false, required: false,
default: ()=> [], default: () => [],
} },
}, },
computed: { computed: {
emptyText() { emptyText() {
return (!this.loading && !this.tableData.length) ? '暂无数据' : '加载中...' return !this.loading && !this.tableData.length ? "暂无数据" : "加载中...";
}, },
}, },
methods:{ methods: {},
},
data() { data() {
return {} return {};
} },
} };
</script> </script>
<template> <template>
<el-table <el-table
v-loading="loading" v-loading="loading"
:data="tableData" :data="tableData"
row-key="id" row-key="id"
border border
@row-click="handleRowClick" @row-click="handleRowClick"
:row-class-name="tableRowClassName" :row-class-name="tableRowClassName"
:default-expand-all="expand" :default-expand-all="expand"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }" height="560"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
>
<el-table-column
v-for="column in columns"
:key="column.prop"
:type="column.type"
:prop="column.prop"
:label="column.label"
:width="column.width"
:show-overflow-tooltip="column.tooltip"
:align="column.align || 'left'"
:formatter="column.formatter"
> >
</el-table-column>
<el-table-column </el-table>
v-for='column in columns'
:key='column.prop'
:type="column.type"
:prop="column.prop"
:label="column.label"
:width="column.width"
:show-overflow-tooltip="column.tooltip"
:align="column.align || 'left'"
:formatter='column.formatter'
>
</el-table-column>
</el-table>
</template> </template>
<script> <script>
export default { export default {
props: { props: {
handleSpanMethod: { handleSpanMethod: {
type: Function, type: Function,
required: false, required: false,
default: () => {} default: () => {},
}, },
handleRowClick: { handleRowClick: {
type: Function, type: Function,
required: false, required: false,
default: () => {} default: () => {},
}, },
tableRowClassName: { tableRowClassName: {
type: Function, type: Function,
required: false, required: false,
default: () => {} default: () => {},
}, },
loading: { loading: {
type: Boolean, type: Boolean,
required: false, required: false,
default: true default: true,
}, },
expand: { expand: {
type: Boolean, type: Boolean,
required: false, required: false,
default: true default: true,
}, },
tableData: { tableData: {
type: Array, type: Array,
required: false, required: false,
default: () => [] default: () => [],
}, },
columns: { columns: {
type: Array, type: Array,
required: false, required: false,
default: ()=> [], default: () => [],
} },
}, },
computed: { computed: {
emptyText() { emptyText() {
return (!this.loading && !this.tableData.length) ? '暂无数据' : '加载中...' return !this.loading && !this.tableData.length ? "暂无数据" : "加载中...";
}, },
}, },
data() { data() {
return {} return {};
} },
} };
</script> </script>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data="tableData" :config="tableConfig"> <LayoutTable :data="tableData" :config="tableConfig">
<el-button <el-button
slot="table-head-left2" slot="table-head-left2"
style="margin-left: 10px" style="margin-left: 10px"
icon="el-icon-tickets" icon="el-icon-tickets"
size="mini" size="mini"
@click="handleImport" @click="handleImport"
>导入</el-button> >导入</el-button
<el-button >
slot="table-head-left2" <el-button
style="margin-left: 10px" slot="table-head-left2"
icon="el-icon-tickets" style="margin-left: 10px"
size="mini" icon="el-icon-tickets"
@click="doExport" size="mini"
:disabled="isExport" @click="doExport"
>导出</el-button> :disabled="isExport"
</LayoutTable> >导出</el-button
>
</LayoutTable>
<!-- 设备管理导入对话框 --> <!-- 设备管理导入对话框 -->
<el-dialog <el-dialog
:title="upload.title" :title="upload.title"
:visible.sync="upload.open" :visible.sync="upload.open"
width="400px" width="400px"
append-to-body append-to-body
> >
<el-upload <el-upload
ref="upload" ref="upload"
:limit="1" :limit="1"
accept=".xlsx, .xls" accept=".xlsx, .xls"
:headers="upload.headers" :headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport" :action="upload.url + '?updateSupport=' + upload.updateSupport"
:disabled="upload.isUploading" :disabled="upload.isUploading"
:on-progress="handleFileUploadProgress" :on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess" :on-success="handleFileSuccess"
:auto-upload="false" :auto-upload="false"
drag drag
> >
<i class="el-icon-upload"></i> <i class="el-icon-upload"></i>
<div class="el-upload__text"> <div class="el-upload__text">
将文件拖到此处,或 将文件拖到此处,或
<em>点击上传</em> <em>点击上传</em>
</div> </div>
<div class="el-upload__tip" slot="tip"> <div class="el-upload__tip" slot="tip">
<el-checkbox <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的数据
v-model="upload.updateSupport" <el-link
/>是否更新已经存在的数据 type="primary"
<el-link type="primary" style="font-size: 14px" @click="downloadTemplate" style="font-size: 14px"
>下载模板</el-link @click="downloadTemplate"
> >下载模板</el-link
</div> >
<div class="el-upload__tip" style="color: red" slot="tip"> </div>
提示:仅允许导入“xls”或“xlsx”格式文件! <div class="el-upload__tip" style="color: red" slot="tip">
</div> 提示:仅允许导入“xls”或“xlsx”格式文件!
</el-upload> </div>
<div slot="footer" class="dialog-footer"> </el-upload>
<el-button type="primary" @click="submitFileForm">确 定</el-button> <div slot="footer" class="dialog-footer">
<el-button @click="upload.open = false">取 消</el-button> <el-button type="primary" @click="submitFileForm">确 定</el-button>
</div> <el-button @click="upload.open = false">取 消</el-button>
</el-dialog> </div>
</el-dialog>
<drawer-show ref="drawerform" @ok="getData" /> <drawer-show ref="drawerform" @ok="getData" />
</div> </div>
</template> </template>
<script> <script>
/** 表单弹出框模式需引入 */ /** 表单弹出框模式需引入 */
import drawerShow from "./drawershow"; import drawerShow from "./drawershow";
import table from "@/assets/mixins/table"; import table from "@/assets/mixins/table";
export default { export default {
name: "DeviceList", name: "DeviceList",
components: { components: {
drawerShow drawerShow,
}, },
mixins: [table], mixins: [table],
created() { created() {
console.log("route",this.$route) console.log("route", this.$route);
this.changePath("/device") this.changePath("/device");
this.query = Object.assign({}, this.query, {productCode:"dzmp"}); this.query = Object.assign({}, this.query, { productCode: "dzmp" });
},
methods: {
/** 导入 */
handleImport() {
this.upload.title = "设备管理导入";
this.upload.open = true;
},
/** 下载模板操作 */
downloadTemplate() {
this.isExport = true;
this.$download("/device/downloadTemplate", {}, { type: "excel" })
.then(() => (this.isExport = false))
.catch((error) => {
this.isExport = false;
this.$message.error(error.message);
});
},
/** 文件上传中处理 */
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
},
/** 文件上传成功处理 */
handleFileSuccess(response, file, fileList) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
this.getData();
},
/** 提交上传文件 */
submitFileForm() {
this.$refs.upload.submit();
},
/** 导出Excel */
doExport() {
this.isExport = true;
this.$download(
"/device/exportExcel",
{
idList: this.selection,
}, },
methods: { { type: "excel" }
/** 导入 */ )
handleImport() { .then(() => (this.isExport = false))
this.upload.title = "设备管理导入"; .catch((error) => {
this.upload.open = true; this.isExport = false;
}, this.$message.error(error.message);
/** 下载模板操作 */ });
downloadTemplate() { },
this.isExport = true; /** 重写新增方法 */
this.$download("/device/downloadTemplate", {}, { type: "excel" }) toAdd(row) {
.then(() => (this.isExport = false)) this.$refs.drawerform.add(row);
.catch((error) => { },
this.isExport = false; /** 重写编辑方法 */
this.$message.error(error.message); toEdit(row) {
}); this.$refs.drawerform.edit(row);
}, },
/** 文件上传中处理 */ /** 重写查看方法 */
handleFileUploadProgress(event, file, fileList) { toView(row) {
this.upload.isUploading = true; this.$refs.drawerform.view(row);
}, },
/** 文件上传成功处理 */
handleFileSuccess(response, file, fileList) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
this.getData();
},
/** 提交上传文件 */
submitFileForm() {
this.$refs.upload.submit();
},
/** 导出Excel */
doExport() {
this.isExport = true;
this.$download("/device/exportExcel", {
"idList": this.selection,
}, { type: "excel" }).then(() => this.isExport = false).catch(error => {
this.isExport = false;
this.$message.error(error.message);
});
},
/** 重写新增方法 */
toAdd(row) {
this.$refs.drawerform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.drawerform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.drawerform.view(row);
},
activeDevice(row) { activeDevice(row) {
this.$post("/device/active", { this.$post("/device/active", {
deviceCode: row.deviceCode, deviceCode: row.deviceCode,
}) })
.then((res) => { .then((res) => {
if (res.code == 1) { if (res.code == 1) {
this.$message.success("激活设备成功!"); this.$message.success("激活设备成功!");
this.getData(); this.getData();
} }
}) })
.catch((error) => { .catch((error) => {
this.$message.error(error.message); this.$message.error(error.message);
}); });
}, },
// 操作菜单状态 // 操作菜单状态
changeStatus(row, column) { changeStatus(row, column) {
return ( return (
<device-switch <device-switch
confirm confirm
url="/device/enable" url="/device/enable"
row={row} row={row}
onChange={this.statusChange} onChange={this.statusChange}
value={this.tableData.data} value={this.tableData.data}
onInput={(data) => { onInput={(data) => {
this.tableData.data = data; this.tableData.data = data;
}} }}
/> />
); );
}, },
statusChange() { statusChange() {
this.$store.dispatch('login'); this.$store.dispatch("login");
},
},
data() {
return {
// 用户导入参数
upload: {
// 是否显示弹出层(设备管理导入)
open: false,
// 弹出层标题(设备管理导入)
title: "导入设备管理数据",
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的数据
updateSupport: 0,
// 上传的地址
url: "/office/device/importData",
},
isExport: false,
config: {
search: [
{
name: "deviceName",
type: "text",
label: "设备名称",
fuzzy: true,
}, },
],
columns: [
{ type: "selection", width: 60 },
{ type: "index", label: "序号", width: 50 },
}, {
data() { label: "设备名称",
return { prop: "deviceName",
// 用户导入参数 formatter: (row) => (row.deviceName ? row.deviceName : "--"),
upload: { },
// 是否显示弹出层(设备管理导入)
open: false,
// 弹出层标题(设备管理导入)
title: "导入设备管理数据",
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的数据
updateSupport: 0,
// 上传的地址
url: "/office/device/importData",
},
isExport: false,
config: {
search: [
{
name: "deviceName",
type: "text",
label: "设备名称",
fuzzy: true
},
],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{label: "设备名称", prop: "deviceName"},
{label: "所属房间", prop: "roomId", formatter: this.formatter},
{ label: "所属房间", prop: "roomId", formatter: this.formatter },
{label: "设备编码", prop: "deviceCode"}, {
label: "设备编码",
prop: "deviceCode",
formatter: (row) => (row.deviceCode ? row.deviceCode : "--"),
},
{label: "MAC地址", prop: "deviceMac"}, {
label: "MAC地址",
prop: "deviceMac",
formatter: (row) => (row.deviceMac ? row.deviceMac : "--"),
},
{label: "设备位置", prop: "deviceAddr"}, {
label: "设备位置",
prop: "deviceAddr",
formatter: (row) => (row.deviceAddr ? row.deviceAddr : "--"),
},
{label: "联系电话", prop: "leadingOfficialTelephone"}, {
label: "联系电话",
prop: "leadingOfficialTelephone",
formatter: (row) =>
row.leadingOfficialTelephone
? row.leadingOfficialTelephone
: "--",
},
{label: "设备状态 ", prop: "deviceStatus",formatter: this.formatter}, {
label: "设备状态 ",
prop: "deviceStatus",
formatter: this.formatter,
},
{ {
prop: "enabled", prop: "enabled",
align: "center", align: "center",
label: "启用/停用", label: "启用/停用",
width: 100, width: 100,
formatter: this.changeStatus, formatter: this.changeStatus,
}, },
{ {
label: "操作", label: "操作",
width: 240, width: 240,
formatter: row => { formatter: (row) => {
return ( return (
<div> <div>
<span> </span> <span> </span>
{row.deviceStatus === 0 ? ( {row.deviceStatus === 0 ? (
<el-button <el-button
size="mini" size="mini"
type="text" type="text"
icon="el-icon-open" icon="el-icon-open"
onClick={() => { onClick={() => {
this.activeDevice(row); this.activeDevice(row);
}} }}
> >
激活 激活
</el-button> </el-button>
) : ( ) : (
"" ""
)} )}
<span> </span> <span> </span>
<table-buttons <table-buttons
noAdd noAdd
row={row} row={row}
onEdit={this.toEdit} onEdit={this.toEdit}
onView={this.toView} onView={this.toView}
onDel={this.toDel} onDel={this.toDel}
/> />
</div> </div>
); );
} },
} },
] ],
} },
};
}
}; };
},
};
</script> </script>
<template> <template>
<layout-view> <layout-view>
<el-descriptions :title="title" :column="column" :size="size" :colon="false" border> <el-descriptions
<template slot="title"> :title="title"
<i class="el-icon-tickets"></i> :column="column"
基本详细信息 :size="size"
</template> :colon="false"
<template slot="extra"> border
<el-button type="primary" @click="$router.go(-1)" size="small">返回</el-button> >
</template> <template slot="title">
<el-descriptions-item label="设备名称" label-class-name="labelClass" content-class-name="contentClass"> <i class="el-icon-tickets"></i>
{{form.deviceName}} 基本详细信息
</el-descriptions-item> </template>
<el-descriptions-item label="所属房间id" label-class-name="labelClass" content-class-name="contentClass"> <template slot="extra">
{{form.roomId}} <el-button type="primary" @click="$router.go(-1)" size="small"
</el-descriptions-item> >返回</el-button
<el-descriptions-item label="所属房间名称" label-class-name="labelClass" content-class-name="contentClass"> >
{{form.roomName}} </template>
</el-descriptions-item> <el-descriptions-item
<el-descriptions-item label="设备编码,SN码等,默认为MAC地址" label-class-name="labelClass" content-class-name="contentClass"> label="设备名称"
{{form.deviceCode}} label-class-name="labelClass"
</el-descriptions-item> content-class-name="contentClass"
<el-descriptions-item label="设备的MAC地址" label-class-name="labelClass" content-class-name="contentClass"> >
{{form.deviceMac}} {{ form.deviceName ? form.deviceName : "--" }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="站点Id,来源基础服务平台" label-class-name="labelClass" content-class-name="contentClass"> <el-descriptions-item
{{form.siteId}} label="所属房间id"
</el-descriptions-item> label-class-name="labelClass"
<el-descriptions-item label="站点编号,来源基础服务平台" label-class-name="labelClass" content-class-name="contentClass"> content-class-name="contentClass"
{{form.siteCode}} >
</el-descriptions-item> {{ form.roomId ? form.roomId : "--" }}
<el-descriptions-item label="站点名称" label-class-name="labelClass" content-class-name="contentClass"> </el-descriptions-item>
{{form.siteName}} <el-descriptions-item
</el-descriptions-item> label="所属房间名称"
<el-descriptions-item label="产品编码" label-class-name="labelClass" content-class-name="contentClass"> label-class-name="labelClass"
{{form.productCode}} content-class-name="contentClass"
</el-descriptions-item> >
<el-descriptions-item label="产品名称" label-class-name="labelClass" content-class-name="contentClass"> {{ form.roomName ? form.roomName : "--" }}
{{form.productName}} </el-descriptions-item>
</el-descriptions-item> <el-descriptions-item
<el-descriptions-item label="设备生产厂商名称" label-class-name="labelClass" content-class-name="contentClass"> label="设备编码,SN码等,默认为MAC地址"
{{form.deviceFirmname}} label-class-name="labelClass"
</el-descriptions-item> content-class-name="contentClass"
<el-descriptions-item label="分辨率" label-class-name="labelClass" content-class-name="contentClass"> >
{{ util_formatters("resolution", form.resolution) }} {{ form.deviceCode ? form.deviceCode : "--" }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="所属楼栋" label-class-name="labelClass" content-class-name="contentClass"> <el-descriptions-item
{{form.deviceInBuilding}} label="设备的MAC地址"
</el-descriptions-item> label-class-name="labelClass"
<el-descriptions-item label="所属楼层" label-class-name="labelClass" content-class-name="contentClass"> content-class-name="contentClass"
{{form.deviceInFloor}} >
</el-descriptions-item> {{ form.deviceMac ? form.deviceMac : "--" }}
<el-descriptions-item label="保修期至" label-class-name="labelClass" content-class-name="contentClass"> </el-descriptions-item>
{{ util_formatterDate(form.defectsLiabilityPeriod)}} <el-descriptions-item
</el-descriptions-item> label="站点Id,来源基础服务平台"
<el-descriptions-item label="负责人" label-class-name="labelClass" content-class-name="contentClass"> label-class-name="labelClass"
{{form.leadingOfficial}} content-class-name="contentClass"
</el-descriptions-item> >
<el-descriptions-item label="设备位置" label-class-name="labelClass" content-class-name="contentClass"> {{ form.siteId ? form.siteId : "--" }}
{{form.deviceAddr}} </el-descriptions-item>
</el-descriptions-item> <el-descriptions-item
<el-descriptions-item label="联系电话" label-class-name="labelClass" content-class-name="contentClass"> label="站点编号,来源基础服务平台"
{{form.leadingOfficialTelephone}} label-class-name="labelClass"
</el-descriptions-item> content-class-name="contentClass"
<el-descriptions-item label="设备图片" label-class-name="labelClass" content-class-name="contentClass"> >
{{form.devicePhotoPath}} {{ form.siteCode ? form.siteCode : "--" }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="设备访问ip" label-class-name="labelClass" content-class-name="contentClass"> <el-descriptions-item
{{form.ip}} label="站点名称"
</el-descriptions-item> label-class-name="labelClass"
<el-descriptions-item label="中心设备编码" label-class-name="labelClass" content-class-name="contentClass"> content-class-name="contentClass"
{{form.centernum}} >
</el-descriptions-item> {{ form.siteName ? form.siteName : "--" }}
<el-descriptions-item label="端口" label-class-name="labelClass" content-class-name="contentClass"> </el-descriptions-item>
{{form.port}} <el-descriptions-item
</el-descriptions-item> label="产品编码"
<el-descriptions-item label="设备状态 " label-class-name="labelClass" content-class-name="contentClass"> label-class-name="labelClass"
{{ util_formatters("deviceStatus", form.deviceStatus) }} content-class-name="contentClass"
</el-descriptions-item> >
<el-descriptions-item label="启用状态 " label-class-name="labelClass" content-class-name="contentClass"> {{ form.productCode ? form.productCode : "--" }}
{{ util_formatters("enabled", form.enabled) }} </el-descriptions-item>
</el-descriptions-item> <el-descriptions-item
<el-descriptions-item label="备注" label-class-name="labelClass" content-class-name="contentClass"> label="产品名称"
{{form.deviceRemark}} label-class-name="labelClass"
</el-descriptions-item> content-class-name="contentClass"
<el-descriptions-item label="最近上线时间" label-class-name="labelClass" content-class-name="contentClass"> >
{{ util_formatterDate(form.onlineTime)}} {{ form.productName ? form.productName : "--" }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="最近离线时间" label-class-name="labelClass" content-class-name="contentClass"> <el-descriptions-item
{{ util_formatterDate(form.offlineTime)}} label="设备生产厂商名称"
</el-descriptions-item> label-class-name="labelClass"
</el-descriptions> content-class-name="contentClass"
>
</layout-view> {{ form.deviceFirmname ? form.deviceFirmname : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="分辨率"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{
form.resolution
? util_formatters("resolution", form.resolution)
: "--"
}}
</el-descriptions-item>
<el-descriptions-item
label="所属楼栋"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.deviceInBuilding ? form.deviceInBuilding : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="所属楼层"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.deviceInFloor ? form.deviceInFloor : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="保修期至"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{
form.defectsLiabilityPeriod
? util_formatterDate(form.defectsLiabilityPeriod)
: "--"
}}
</el-descriptions-item>
<el-descriptions-item
label="负责人"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.leadingOfficial ? form.leadingOfficial : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="设备位置"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.deviceAddr ? form.deviceAddr : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="联系电话"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{
form.leadingOfficialTelephone ? form.leadingOfficialTelephone : "--"
}}
</el-descriptions-item>
<el-descriptions-item
label="设备图片"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.devicePhotoPath ? form.devicePhotoPath : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="设备访问ip"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.ip ? form.ip : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="中心设备编码"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.centernum ? form.centernum : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="端口"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.port ? form.port : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="设备状态 "
label-class-name="labelClass"
content-class-name="contentClass"
>
{{
form.deviceStatus
? util_formatters("deviceStatus", form.deviceStatus)
: "--"
}}
</el-descriptions-item>
<el-descriptions-item
label="启用状态 "
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.enabled ? util_formatters("enabled", form.enabled) : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="备注"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.deviceRemark ? form.deviceRemark : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="最近上线时间"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.onlineTime ? util_formatterDate(form.onlineTime) : "--" }}
</el-descriptions-item>
<el-descriptions-item
label="最近离线时间"
label-class-name="labelClass"
content-class-name="contentClass"
>
{{ form.offlineTime ? util_formatterDate(form.offlineTime) : "--" }}
</el-descriptions-item>
</el-descriptions>
</layout-view>
</template> </template>
<script> <script>
import view from "@/assets/mixins/view"; import view from "@/assets/mixins/view";
export default { export default {
mixins: [view], mixins: [view],
components: { components: {},
}, methods: {},
methods: { data() {
return {
}, size: "small",
data() { column: 2,
return { toString: [
size:"small", "resolution",
column:2, "deviceInBuilding",
toString:[ "deviceInFloor",
"resolution", "deviceStatus",
"deviceInBuilding", "enabled",
"deviceInFloor", ],
"deviceStatus", toArrays: [],
"enabled", toDate: [],
], };
toArrays: [ },
};
],
toDate: [
]
}
}
}
</script> </script>
<style lang="less"> <style lang="less">
.labelClass{ .labelClass {
width: 200px; width: 200px;
} }
.el-descriptions__body{ .el-descriptions__body {
margin-left: 5px; margin-left: 5px;
margin-right: 5px; margin-right: 5px;
color: #606266; color: #606266;
background-color: #FFF; background-color: #fff;
} }
.contentClass{ .contentClass {
width: 600px; width: 600px;
} }
</style> </style>
\ No newline at end of file
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data="tableData" :config="tableConfig"> <LayoutTable :data="tableData" :config="tableConfig">
<el-button <el-button
slot="table-head-left2" slot="table-head-left2"
style="margin-left: 10px" style="margin-left: 10px"
icon="el-icon-tickets" icon="el-icon-tickets"
size="mini" size="mini"
@click="handleImport" @click="handleImport"
>导入</el-button> >导入</el-button
<el-button >
slot="table-head-left2" <el-button
style="margin-left: 10px" slot="table-head-left2"
icon="el-icon-tickets" style="margin-left: 10px"
size="mini" icon="el-icon-tickets"
@click="doExport" size="mini"
:disabled="isExport" @click="doExport"
>导出</el-button> :disabled="isExport"
</LayoutTable> >导出</el-button
>
</LayoutTable>
<!-- 设备管理导入对话框 --> <!-- 设备管理导入对话框 -->
<el-dialog <el-dialog
:title="upload.title" :title="upload.title"
:visible.sync="upload.open" :visible.sync="upload.open"
width="400px" width="400px"
append-to-body append-to-body
> >
<el-upload <el-upload
ref="upload" ref="upload"
:limit="1" :limit="1"
accept=".xlsx, .xls" accept=".xlsx, .xls"
:headers="upload.headers" :headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport" :action="upload.url + '?updateSupport=' + upload.updateSupport"
:disabled="upload.isUploading" :disabled="upload.isUploading"
:on-progress="handleFileUploadProgress" :on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess" :on-success="handleFileSuccess"
:auto-upload="false" :auto-upload="false"
drag drag
> >
<i class="el-icon-upload"></i> <i class="el-icon-upload"></i>
<div class="el-upload__text"> <div class="el-upload__text">
将文件拖到此处,或 将文件拖到此处,或
<em>点击上传</em> <em>点击上传</em>
</div> </div>
<div class="el-upload__tip" slot="tip"> <div class="el-upload__tip" slot="tip">
<el-checkbox <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的数据
v-model="upload.updateSupport" <el-link
/>是否更新已经存在的数据 type="primary"
<el-link type="primary" style="font-size: 14px" @click="downloadTemplate" style="font-size: 14px"
>下载模板</el-link @click="downloadTemplate"
> >下载模板</el-link
</div> >
<div class="el-upload__tip" style="color: red" slot="tip"> </div>
提示:仅允许导入“xls”或“xlsx”格式文件! <div class="el-upload__tip" style="color: red" slot="tip">
</div> 提示:仅允许导入“xls”或“xlsx”格式文件!
</el-upload> </div>
<div slot="footer" class="dialog-footer"> </el-upload>
<el-button type="primary" @click="submitFileForm">确 定</el-button> <div slot="footer" class="dialog-footer">
<el-button @click="upload.open = false">取 消</el-button> <el-button type="primary" @click="submitFileForm">确 定</el-button>
</div> <el-button @click="upload.open = false">取 消</el-button>
</el-dialog> </div>
</el-dialog>
<drawer-show ref="drawerform" @ok="getData" /> <drawer-show ref="drawerform" @ok="getData" />
</div> </div>
</template> </template>
<script> <script>
/** 表单弹出框模式需引入 */ /** 表单弹出框模式需引入 */
import drawerShow from "./drawershow"; import { formatter } from "../../assets/utils/table";
import table from "@/assets/mixins/table"; import drawerShow from "./drawershow";
export default { import table from "@/assets/mixins/table";
name: "DeviceList", export default {
components: { name: "DeviceList",
drawerShow components: {
}, drawerShow,
mixins: [table], },
created() { mixins: [table],
created() {},
methods: {
/** 导入 */
handleImport() {
this.upload.title = "设备管理导入";
this.upload.open = true;
},
/** 下载模板操作 */
downloadTemplate() {
this.isExport = true;
this.$download("/device/downloadTemplate", {}, { type: "excel" })
.then(() => (this.isExport = false))
.catch((error) => {
this.isExport = false;
this.$message.error(error.message);
});
},
/** 文件上传中处理 */
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
},
/** 文件上传成功处理 */
handleFileSuccess(response, file, fileList) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
this.getData();
},
/** 提交上传文件 */
submitFileForm() {
this.$refs.upload.submit();
},
/** 导出Excel */
doExport() {
this.isExport = true;
this.$download(
"/device/exportExcel",
{
idList: this.selection,
}, },
methods: { { type: "excel" }
/** 导入 */ )
handleImport() { .then(() => (this.isExport = false))
this.upload.title = "设备管理导入"; .catch((error) => {
this.upload.open = true; this.isExport = false;
}, this.$message.error(error.message);
/** 下载模板操作 */ });
downloadTemplate() { },
this.isExport = true; /** 重写新增方法 */
this.$download("/device/downloadTemplate", {}, { type: "excel" }) toAdd(row) {
.then(() => (this.isExport = false)) this.$refs.drawerform.add(row);
.catch((error) => { },
this.isExport = false; /** 重写编辑方法 */
this.$message.error(error.message); toEdit(row) {
}); this.$refs.drawerform.edit(row);
}, },
/** 文件上传中处理 */ /** 重写查看方法 */
handleFileUploadProgress(event, file, fileList) { toView(row) {
this.upload.isUploading = true; this.$refs.drawerform.view(row);
}, },
/** 文件上传成功处理 */ },
handleFileSuccess(response, file, fileList) { data() {
this.upload.open = false; return {
this.upload.isUploading = false; // 用户导入参数
this.$refs.upload.clearFiles(); upload: {
this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true }); // 是否显示弹出层(设备管理导入)
this.getData(); open: false,
}, // 弹出层标题(设备管理导入)
/** 提交上传文件 */ title: "导入设备管理数据",
submitFileForm() { // 是否禁用上传
this.$refs.upload.submit(); isUploading: false,
}, // 是否更新已经存在的数据
/** 导出Excel */ updateSupport: 0,
doExport() { // 上传的地址
this.isExport = true; url: "/m/device/importData",
this.$download("/device/exportExcel", { },
"idList": this.selection, isExport: false,
}, { type: "excel" }).then(() => this.isExport = false).catch(error => { config: {
this.isExport = false; search: [],
this.$message.error(error.message); columns: [
}); { type: "selection", width: 60 },
}, { type: "index", label: "序号", width: 50 },
/** 重写新增方法 */
toAdd(row) {
this.$refs.drawerform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.drawerform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.drawerform.view(row);
},
}, {
data() { label: "设备名称",
return { prop: "deviceName",
// 用户导入参数 formatter: (row) => (row.deviceName ? row.deviceName : "--"),
upload: { },
// 是否显示弹出层(设备管理导入)
open: false,
// 弹出层标题(设备管理导入)
title: "导入设备管理数据",
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的数据
updateSupport: 0,
// 上传的地址
url: "/m/device/importData",
},
isExport: false,
config: {
search: [
],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{label: "设备名称", prop: "deviceName"},
{label: "所属房间id", prop: "roomId", formatter: this.formatter}, { label: "所属房间id", prop: "roomId", formatter: this.formatter },
{label: "所属房间名称", prop: "roomName"}, {
label: "所属房间名称",
prop: "roomName",
formatter: (row) => (row.roomName ? row.roomName : "--"),
},
{label: "设备编码,SN码等,默认为MAC地址", prop: "deviceCode"}, {
label: "设备编码,SN码等,默认为MAC地址",
prop: "deviceCode",
formatter: (row) => (row.deviceCode ? row.deviceCode : "--"),
},
{label: "设备的MAC地址", prop: "deviceMac"}, {
label: "设备的MAC地址",
prop: "deviceMac",
formatter: (row) => (row.deviceMac ? row.deviceMac : "--"),
},
{label: "设备位置", prop: "deviceAddr"}, {
label: "设备位置",
prop: "deviceAddr",
formatter: (row) => (row.deviceAddr ? row.deviceAddr : "--"),
},
{label: "联系电话", prop: "leadingOfficialTelephone"}, {
label: "联系电话",
prop: "leadingOfficialTelephone",
formatter: (row) =>
row.leadingOfficialTelephone
? row.leadingOfficialTelephone
: "--",
},
{label: "设备状态 ", prop: "deviceStatus",formatter: this.formatter}, {
label: "设备状态 ",
prop: "deviceStatus",
formatter: this.formatter,
},
{label: "启用状态 ", prop: "enabled",formatter: this.formatter}, { label: "启用状态 ", prop: "enabled", formatter: this.formatter },
{label: "创建用户", prop: "createUserId", formatter: this.formatter}, {
{ label: "创建用户",
label: "操作", prop: "createUserId",
width: 240, formatter: this.formatter,
formatter: row => { },
return ( {
<table-buttons noAdd row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} /> label: "操作",
); width: 240,
} formatter: (row) => {
} return (
] <table-buttons
} noAdd
}; row={row}
} onEdit={this.toEdit}
onView={this.toView}
onDel={this.toDel}
/>
);
},
},
],
},
}; };
</script> },
\ No newline at end of file };
</script>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data="tableData" :config="tableConfig"> <LayoutTable :data="tableData" :config="tableConfig">
<el-button <el-button
slot="table-head-left2" slot="table-head-left2"
style="margin-left: 10px" style="margin-left: 10px"
icon="el-icon-tickets" icon="el-icon-tickets"
size="mini" size="mini"
@click="handleImport" @click="handleImport"
>导入</el-button> >导入</el-button
<el-button >
slot="table-head-left2" <el-button
style="margin-left: 10px" slot="table-head-left2"
icon="el-icon-tickets" style="margin-left: 10px"
size="mini" icon="el-icon-tickets"
@click="doExport" size="mini"
:disabled="isExport" @click="doExport"
>导出</el-button> :disabled="isExport"
</LayoutTable> >导出</el-button
>
</LayoutTable>
<!-- 设备管理导入对话框 --> <!-- 设备管理导入对话框 -->
<el-dialog <el-dialog
:title="upload.title" :title="upload.title"
:visible.sync="upload.open" :visible.sync="upload.open"
width="400px" width="400px"
append-to-body append-to-body
> >
<el-upload <el-upload
ref="upload" ref="upload"
:limit="1" :limit="1"
accept=".xlsx, .xls" accept=".xlsx, .xls"
:headers="upload.headers" :headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport" :action="upload.url + '?updateSupport=' + upload.updateSupport"
:disabled="upload.isUploading" :disabled="upload.isUploading"
:on-progress="handleFileUploadProgress" :on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess" :on-success="handleFileSuccess"
:auto-upload="false" :auto-upload="false"
drag drag
> >
<i class="el-icon-upload"></i> <i class="el-icon-upload"></i>
<div class="el-upload__text"> <div class="el-upload__text">
将文件拖到此处,或 将文件拖到此处,或
<em>点击上传</em> <em>点击上传</em>
</div> </div>
<div class="el-upload__tip" slot="tip"> <div class="el-upload__tip" slot="tip">
<el-checkbox <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的数据
v-model="upload.updateSupport" <el-link
/>是否更新已经存在的数据 type="primary"
<el-link type="primary" style="font-size: 14px" @click="downloadTemplate" style="font-size: 14px"
>下载模板</el-link @click="downloadTemplate"
> >下载模板</el-link
</div> >
<div class="el-upload__tip" style="color: red" slot="tip"> </div>
提示:仅允许导入“xls”或“xlsx”格式文件! <div class="el-upload__tip" style="color: red" slot="tip">
</div> 提示:仅允许导入“xls”或“xlsx”格式文件!
</el-upload> </div>
<div slot="footer" class="dialog-footer"> </el-upload>
<el-button type="primary" @click="submitFileForm">确 定</el-button> <div slot="footer" class="dialog-footer">
<el-button @click="upload.open = false">取 消</el-button> <el-button type="primary" @click="submitFileForm">确 定</el-button>
</div> <el-button @click="upload.open = false">取 消</el-button>
</el-dialog> </div>
</el-dialog>
<drawer-show ref="drawerform" @ok="getData" /> <drawer-show ref="drawerform" @ok="getData" />
</div> </div>
</template> </template>
<script> <script>
/** 表单弹出框模式需引入 */ /** 表单弹出框模式需引入 */
import drawerShow from "./drawershow"; import drawerShow from "./drawershow";
import table from "@/assets/mixins/table"; import table from "@/assets/mixins/table";
export default { export default {
name: "DeviceList", name: "DeviceList",
components: { components: {
drawerShow drawerShow,
}, },
mixins: [table], mixins: [table],
created() { created() {
console.log("route",this.$route) console.log("route", this.$route);
this.changePath("/device") this.changePath("/device");
this.query = Object.assign({}, this.query, {productCode:"hysdzmp"}); this.query = Object.assign({}, this.query, { productCode: "hysdzmp" });
},
methods: {
/** 导入 */
handleImport() {
this.upload.title = "设备管理导入";
this.upload.open = true;
},
/** 下载模板操作 */
downloadTemplate() {
this.isExport = true;
this.$download("/device/downloadTemplate", {}, { type: "excel" })
.then(() => (this.isExport = false))
.catch((error) => {
this.isExport = false;
this.$message.error(error.message);
});
},
/** 文件上传中处理 */
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
},
/** 文件上传成功处理 */
handleFileSuccess(response, file, fileList) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
this.getData();
},
/** 提交上传文件 */
submitFileForm() {
this.$refs.upload.submit();
},
/** 导出Excel */
doExport() {
this.isExport = true;
this.$download(
"/device/exportExcel",
{
idList: this.selection,
}, },
methods: { { type: "excel" }
/** 导入 */ )
handleImport() { .then(() => (this.isExport = false))
this.upload.title = "设备管理导入"; .catch((error) => {
this.upload.open = true; this.isExport = false;
}, this.$message.error(error.message);
/** 下载模板操作 */ });
downloadTemplate() { },
this.isExport = true; /** 重写新增方法 */
this.$download("/device/downloadTemplate", {}, { type: "excel" }) toAdd(row) {
.then(() => (this.isExport = false)) this.$refs.drawerform.add(row);
.catch((error) => { },
this.isExport = false; /** 重写编辑方法 */
this.$message.error(error.message); toEdit(row) {
}); this.$refs.drawerform.edit(row);
}, },
/** 文件上传中处理 */ /** 重写查看方法 */
handleFileUploadProgress(event, file, fileList) { toView(row) {
this.upload.isUploading = true; this.$refs.drawerform.view(row);
}, },
/** 文件上传成功处理 */ activeDevice(row) {
handleFileSuccess(response, file, fileList) { this.$post("/device/active", {
this.upload.open = false; deviceCode: row.deviceCode,
this.upload.isUploading = false; })
this.$refs.upload.clearFiles(); .then((res) => {
this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true }); if (res.code == 1) {
this.getData(); this.$message.success("激活设备成功!");
}, this.getData();
/** 提交上传文件 */ }
submitFileForm() { })
this.$refs.upload.submit(); .catch((error) => {
}, this.$message.error(error.message);
/** 导出Excel */ });
doExport() { },
this.isExport = true; // 操作菜单状态
this.$download("/device/exportExcel", { changeStatus(row, column) {
"idList": this.selection, return (
}, { type: "excel" }).then(() => this.isExport = false).catch(error => { <device-switch
this.isExport = false; confirm
this.$message.error(error.message); url="/device/enable"
}); row={row}
}, onChange={this.statusChange}
/** 重写新增方法 */ value={this.tableData.data}
toAdd(row) { onInput={(data) => {
this.$refs.drawerform.add(row); this.tableData.data = data;
}, }}
/** 重写编辑方法 */ />
toEdit(row) { );
this.$refs.drawerform.edit(row); },
}, statusChange() {
/** 重写查看方法 */ this.$store.dispatch("login");
toView(row) { },
this.$refs.drawerform.view(row); },
}, data() {
activeDevice(row) { return {
this.$post("/device/active", { // 用户导入参数
deviceCode: row.deviceCode, upload: {
}) // 是否显示弹出层(设备管理导入)
.then((res) => { open: false,
if (res.code == 1) { // 弹出层标题(设备管理导入)
this.$message.success("激活设备成功!"); title: "导入设备管理数据",
this.getData(); // 是否禁用上传
} isUploading: false,
}) // 是否更新已经存在的数据
.catch((error) => { updateSupport: 0,
this.$message.error(error.message); // 上传的地址
}); url: "/office/device/importData",
}, },
// 操作菜单状态 isExport: false,
changeStatus(row, column) { config: {
return ( search: [
<device-switch {
confirm name: "deviceName",
url="/device/enable" type: "text",
row={row} label: "设备名称",
onChange={this.statusChange} fuzzy: true,
value={this.tableData.data}
onInput={(data) => {
this.tableData.data = data;
}}
/>
);
}, },
statusChange() { ],
this.$store.dispatch('login'); columns: [
}, { type: "selection", width: 60 },
{ type: "index", label: "序号", width: 50 },
},
data() {
return {
// 用户导入参数
upload: {
// 是否显示弹出层(设备管理导入)
open: false,
// 弹出层标题(设备管理导入)
title: "导入设备管理数据",
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的数据
updateSupport: 0,
// 上传的地址
url: "/office/device/importData",
},
isExport: false,
config: {
search: [
{
name: "deviceName",
type: "text",
label: "设备名称",
fuzzy: true
},
],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{label: "设备名称", prop: "deviceName"},
{label: "所属房间", prop: "roomId", formatter: this.formatter}, {
label: "设备名称",
prop: "deviceName",
formatter: (row) => (row.deviceName ? row.deviceName : "--"),
},
{ label: "所属房间", prop: "roomId", formatter: this.formatter },
{label: "设备编码", prop: "deviceCode"}, {
label: "设备编码",
prop: "deviceCode",
formatter: (row) => (row.deviceCode ? row.deviceCode : "--"),
},
{label: "MAC地址", prop: "deviceMac"}, {
label: "MAC地址",
prop: "deviceMac",
formatter: (row) => (row.deviceMac ? row.deviceMac : "--"),
},
{label: "设备位置", prop: "deviceAddr"}, {
label: "设备位置",
prop: "deviceAddr",
formatter: (row) => (row.deviceAddr ? row.deviceAddr : "--"),
},
{label: "联系电话", prop: "leadingOfficialTelephone"}, {
label: "联系电话",
prop: "leadingOfficialTelephone",
formatter: (row) =>
row.leadingOfficialTelephone
? row.leadingOfficialTelephone
: "--",
},
{label: "设备状态 ", prop: "deviceStatus",formatter: this.formatter}, {
label: "设备状态 ",
prop: "deviceStatus",
formatter: this.formatter,
},
{label: "启用状态 ", prop: "enabled",formatter: this.formatter}, { label: "启用状态 ", prop: "enabled", formatter: this.formatter },
{ {
label: "操作", label: "操作",
width: 240, width: 240,
formatter: row => { formatter: (row) => {
return ( return (
<div> <div>
<span> </span> <span> </span>
{row.deviceStatus === 0 ? ( {row.deviceStatus === 0 ? (
<el-button <el-button
size="mini" size="mini"
type="text" type="text"
icon="el-icon-open" icon="el-icon-open"
onClick={() => { onClick={() => {
this.activeDevice(row); this.activeDevice(row);
}} }}
> >
激活 激活
</el-button> </el-button>
) : ( ) : (
"" ""
)} )}
<span> </span> <span> </span>
<table-buttons <table-buttons
noAdd noAdd
row={row} row={row}
onEdit={this.toEdit} onEdit={this.toEdit}
onView={this.toView} onView={this.toView}
onDel={this.toDel} onDel={this.toDel}
/> />
</div> </div>
); );
} },
} },
] ],
} },
};
}
}; };
},
};
</script> </script>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data="tableData" notAdd notDel :config="tableConfig"> <LayoutTable :data="tableData" notAdd notDel :config="tableConfig">
</LayoutTable> </LayoutTable>
<drawer-show ref="drawerform" @ok="getData" />
<drawer-show ref="drawerform" @ok="getData" /> </div>
</div>
</template> </template>
<script> <script>
/** 表单弹出框模式需引入 */ /** 表单弹出框模式需引入 */
import drawerShow from "./drawershow"; import drawerShow from "./drawershow";
import table from "@/assets/mixins/table"; import table from "@/assets/mixins/table";
export default { export default {
name: "GocomeRecordList", name: "GocomeRecordList",
components: { components: {
drawerShow drawerShow,
}, },
mixins: [table], mixins: [table],
created() { created() {},
}, methods: {
methods: { /** 重写新增方法 */
/** 重写新增方法 */ toAdd(row) {
toAdd(row) { this.$refs.drawerform.add(row);
this.$refs.drawerform.add(row); },
}, /** 重写编辑方法 */
/** 重写编辑方法 */ toEdit(row) {
toEdit(row) { this.$refs.drawerform.edit(row);
this.$refs.drawerform.edit(row); },
}, /** 重写查看方法 */
/** 重写查看方法 */ toView(row) {
toView(row) { this.$refs.drawerform.view(row);
this.$refs.drawerform.view(row); },
}, },
data() {
}, return {
data() { config: {
return { search: [
config: { {
search: [ name: "userName",
{ type: "text",
name: "userName", label: "用户名称",
type: "text", fuzzy: true,
label: "用户名称", },
fuzzy: true {
}, name: "afterStatus",
{ type: "text",
name: "afterStatus", label: "状态",
type: "text", },
label: "状态" {
}, name: "createTimeStart",
{ type: "date",
name: "createTimeStart", label: "创建时间",
type: "date", },
label: "创建时间" {
},{ name: "createTimeEnd",
name: "createTimeEnd", type: "date",
type: "date", label: "结束时间",
label: "结束时间" },
} ],
], columns: [
columns: [ { type: "selection", width: 60 },
{type: "selection", width: 60}, { type: "index", label: "序号", width: 50 },
{type: "index",label: "序号",width: 50},
{label: "用户名称", prop: "userName"},
{label: "电话", prop: "phone"}, {
label: "用户名称",
prop: "userName",
formatter: (row) => (row.userName ? row.userName : "--"),
},
{label: "所属部门", prop: "deptName"}, {
label: "电话",
prop: "phone",
formatter: (row) => (row.phone ? row.phone : "--"),
},
{label: "所属房间名称", prop: "roomName"}, {
label: "所属部门",
prop: "deptName",
formatter: (row) => (row.deptName ? row.deptName : "--"),
},
{label: "修改前状态", prop: "beforeStatus"}, {
label: "所属房间名称",
prop: "roomName",
formatter: (row) => (row.roomName ? row.roomName : "--"),
},
{label: "修改后状态", prop: "afterStatus"}, {
label: "修改前状态",
prop: "beforeStatus",
formatter: (row) => (row.beforeStatus ? row.beforeStatus : "--"),
},
{label: "修改时间", prop: "createTime", formatter: this.formatterDate}, {
label: "修改后状态",
prop: "afterStatus",
formatter: (row) => (row.afterStatus ? row.afterStatus : "--"),
},
] {
} label: "修改时间",
}; prop: "createTime",
} formatter: this.formatterDate,
},
],
},
}; };
},
};
</script> </script>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data="tableData" :config="tableConfig"> <LayoutTable :data="tableData" :config="tableConfig"> </LayoutTable>
</LayoutTable>
<drawer-show ref="drawerform" @ok="getData" />
<drawer-show ref="drawerform" @ok="getData"/>
</div> </div>
</template> </template>
...@@ -17,11 +15,10 @@ import moment from "moment/moment"; ...@@ -17,11 +15,10 @@ import moment from "moment/moment";
export default { export default {
name: "MettingRecordList", name: "MettingRecordList",
components: { components: {
drawerShow drawerShow,
}, },
mixins: [table], mixins: [table],
created() { created() {},
},
methods: { methods: {
/** 重写新增方法 */ /** 重写新增方法 */
toAdd(row) { toAdd(row) {
...@@ -43,158 +40,177 @@ export default { ...@@ -43,158 +40,177 @@ export default {
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning", type: "warning",
}) })
.then(() => { .then(() => {
that that
.$post("/metting/record/delete?id=" + id, {}) .$post("/metting/record/delete?id=" + id, {})
.then((res) => { .then((res) => {
// 更新数据 // 更新数据
if (res && res.code == 1) { if (res && res.code == 1) {
that.getData(); that.getData();
that.afterDel(id); that.afterDel(id);
} }
}) })
.catch((error) => { .catch((error) => {
that.$message.error(error.message); that.$message.error(error.message);
});
})
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
}); });
})
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
}); });
} });
},
,
toFinish(row) { toFinish(row) {
this.loading = true; this.loading = true;
this.$post("/metting/record/save", { this.$post("/metting/record/save", {
id: row.id, meetStatus: 2, id: row.id,
meetStatus: 2,
}) })
.then((res) => { .then((res) => {
if (res && res.code === 1) { if (res && res.code === 1) {
this.$message.success("结束成功!"); this.$message.success("结束成功!");
this.getData(); this.getData();
this.loading = false; this.loading = false;
} }
}) })
.catch((error) => { .catch((error) => {
this.$message.error(error.message); this.$message.error(error.message);
}); });
} },
}, },
data() { data() {
return { return {
config: { config: {
search: [ { search: [
name: "meetName", {
type: "text", name: "meetName",
label: "会议名称", type: "text",
fuzzy: true label: "会议名称",
}, fuzzy: true,
},
{ {
name: "meetStatus", name: "meetStatus",
type: "select", type: "select",
label: "会议状态" label: "会议状态",
}, },
{ {
name: "meetDateStart", name: "meetDateStart",
type: "date", type: "date",
label: "会议开始日期" label: "会议开始日期",
},{ },
{
name: "meetDateEnd", name: "meetDateEnd",
type: "date", type: "date",
label: "会议结束日期" label: "会议结束日期",
} },
], ],
columns: [ columns: [
{type: "selection", width: 60}, { type: "selection", width: 60 },
{type: "index", label: "序号", width: 50}, { type: "index", label: "序号", width: 50 },
{label: "会议名称", prop: "meetName"}, {
{label: "开会房间", prop: "roomName"}, label: "会议名称",
prop: "meetName",
formatter: (row) => (row.meetName ? row.meetName : "--"),
},
{
label: "开会房间",
prop: "roomName",
formatter: (row) => (row.roomName ? row.roomName : "--"),
},
{ {
label: "开会日期", prop: "meetDate", label: "开会日期",
prop: "meetDate",
formatter: (row) => { formatter: (row) => {
let meetDate = moment(row.meetDate).format('YYYY-MM-DD'); let meetDate = moment(row.meetDate).format("YYYY-MM-DD");
return ( return <span>{meetDate}</span>;
<span>{meetDate}</span>
);
}, },
}, },
{ {
label: "开始时间", prop: "meetTimeStart", label: "开始时间",
prop: "meetTimeStart",
formatter: (row) => { formatter: (row) => {
let meetTimeStart = moment(row.meetTimeStart).format('HH:mm'); let meetTimeStart = moment(row.meetTimeStart).format("HH:mm");
let meetTimeEnd = moment(row.meetTimeEnd).format('HH:mm'); let meetTimeEnd = moment(row.meetTimeEnd).format("HH:mm");
return ( return (
<span>{meetTimeStart}~{meetTimeEnd}</span> <span>
{meetTimeStart}~{meetTimeEnd}
</span>
); );
} },
},
{
label: "开会部门",
prop: "meetDeptName",
formatter: (row) => (row.meetDeptName ? row.meetDeptName : "--"),
}, },
{label: "开会部门", prop: "meetDeptName"},
{label: "结束方式", prop: "finishMethod", formatter: this.formatter}, {
label: "结束方式",
prop: "finishMethod",
formatter: this.formatter,
},
{label: "会议状态", prop: "meetStatus", formatter: this.formatter}, { label: "会议状态", prop: "meetStatus", formatter: this.formatter },
{ {
label: "操作", label: "操作",
width: 240, width: 240,
formatter: row => { formatter: (row) => {
let editButton = ( let editButton = (
<el-button <el-button
size="small" size="small"
type="text" type="text"
icon="el-icon-edit" icon="el-icon-edit"
onClick={() => { onClick={() => {
this.toEdit(row); this.toEdit(row);
}} }}
> >
编辑 编辑
</el-button> </el-button>
); );
let viewButton = ( let viewButton = (
<el-button <el-button
size="small" size="small"
type="text" type="text"
icon="el-icon-view" icon="el-icon-view"
onClick={() => { onClick={() => {
this.toView(row); this.toView(row);
}} }}
> >
查看 查看
</el-button> </el-button>
); );
let delButton = ( let delButton = (
<el-button <el-button
size="small" size="small"
type="text" type="text"
icon="el-icon-delete" icon="el-icon-delete"
onClick={() => { onClick={() => {
this.toDel(row.id); this.toDel(row.id);
}} }}
> >
删除 删除
</el-button> </el-button>
); );
let finishButton = ( let finishButton = (
<el-button <el-button
size="small" size="small"
type="text" type="text"
icon="el-icon-document" icon="el-icon-document"
onClick={() => { onClick={() => {
this.toFinish(row); this.toFinish(row);
}} }}
> >
结束 结束
</el-button> </el-button>
); );
let listButtons = []; let listButtons = [];
if (row.meetStatus === 0) { if (row.meetStatus === 0) {
...@@ -208,11 +224,11 @@ export default { ...@@ -208,11 +224,11 @@ export default {
listButtons.push(viewButton); listButtons.push(viewButton);
} }
return <div>{listButtons}</div>; return <div>{listButtons}</div>;
} },
} },
] ],
} },
}; };
} },
}; };
</script> </script>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data="tableData" :config="tableConfig"> <LayoutTable :data="tableData" :config="tableConfig"> </LayoutTable>
</LayoutTable>
<drawer-show ref="drawerform" @ok="getData" />
<drawer-show ref="drawerform" @ok="getData" /> </div>
</div>
</template> </template>
<script> <script>
/** 表单弹出框模式需引入 */ /** 表单弹出框模式需引入 */
import drawerShow from "./drawershow"; import drawerShow from "./drawershow";
import table from "@/assets/mixins/table"; import table from "@/assets/mixins/table";
export default { export default {
name: "RoomList", name: "RoomList",
components: { components: {
drawerShow drawerShow,
}, },
mixins: [table], mixins: [table],
created() { created() {},
}, methods: {
methods: { renderTable(tableData) {
renderTable(tableData) { return (
return ( <el-table stripe data={tableData} class="total-table">
<el-table stripe data={tableData} class="total-table"> {this.columnSet.map((item) => this.renderTableColumn(item))}
{this.columnSet.map((item) => this.renderTableColumn(item))} </el-table>
</el-table> );
); },
}, renderTableColumn(options) {
renderTableColumn(options) { return (
return ( <el-table-column
<el-table-column prop={options.prop}
prop={options.prop} label={options.label}
label={options.label} width={options.width}
width={options.width} formatter={options.formatter}
formatter={options.formatter} ></el-table-column>
> );
</el-table-column> },
); /** 重写新增方法 */
toAdd(row) {
this.$refs.drawerform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.drawerform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.drawerform.view(row);
},
},
data() {
return {
/** 子表列元素 */
columnSet: [
{ label: "设备编码", prop: "deviceCode", width: 150 },
{ label: "设备名称", prop: "deviceName", width: 150 },
],
config: {
search: [
{
name: "userName",
type: "text",
label: "房间名称",
fuzzy: true,
}, },
/** 重写新增方法 */ ],
toAdd(row) { columns: [
this.$refs.drawerform.add(row); { type: "selection", width: 60 },
}, { type: "index", label: "序号", width: 50 },
/** 重写编辑方法 */
toEdit(row) {
this.$refs.drawerform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.drawerform.view(row);
},
},
data() {
return {
/** 子表列元素 */
columnSet:[
{label: "设备编码", prop: "deviceCode", width: 150},
{label: "设备名称", prop: "deviceName", width: 150}
],
config: {
search: [
{
name: "userName",
type: "text",
label: "房间名称",
fuzzy: true
},
],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{label: "房间名称", prop: "roomName"}, {
label: "房间名称",
prop: "roomName",
formatter: (row) => (row.roomName ? row.roomName : "--"),
},
{label: "房间编码", prop: "roomCode"}, {
label: "房间编码",
prop: "roomCode",
formatter: (row) => (row.roomCode ? row.roomCode : "--"),
},
{label: "房间类型", prop: "roomType",formatter: this.formatter}, { label: "房间类型", prop: "roomType", formatter: this.formatter },
{label: "绑定设备", {
width: 120, label: "绑定设备",
prop: "subColumns", width: 120,
formatter: (row) => { prop: "subColumns",
let widthsize = this.columnSet.reduce((pre, cur) => { formatter: (row) => {
return pre + Number(cur.width); let widthsize = this.columnSet.reduce((pre, cur) => {
}, 50); return pre + Number(cur.width);
return ( }, 50);
<el-popover placement="right" width={widthsize} trigger="click"> return (
{this.renderTable(row.roomDeviceList)} <el-popover placement="right" width={widthsize} trigger="click">
<el-button type="text" slot="reference">详细</el-button> {this.renderTable(row.roomDeviceList)}
</el-popover> <el-button type="text" slot="reference">
); 详细
}, </el-button>
}, </el-popover>
);
},
},
{label: "员工人数", prop: "countPerson", formatter: this.formatter}, { label: "员工人数", prop: "countPerson", formatter: this.formatter },
{ {
label: "操作", label: "操作",
width: 240, width: 240,
formatter: row => { formatter: (row) => {
return ( return (
<table-buttons noAdd row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} /> <table-buttons
); noAdd
} row={row}
} onEdit={this.toEdit}
] onView={this.toView}
} onDel={this.toDel}
}; />
} );
},
},
],
},
}; };
},
};
</script> </script>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data="tableData" :config="tableConfig"> <LayoutTable :data="tableData" :config="tableConfig"> </LayoutTable>
</LayoutTable>
<drawer-show ref="drawerform" @ok="getData" />
<drawer-show ref="drawerform" @ok="getData" /> </div>
</div>
</template> </template>
<script> <script>
/** 表单弹出框模式需引入 */ /** 表单弹出框模式需引入 */
import drawerShow from "./drawershow"; import drawerShow from "./drawershow";
import table from "@/assets/mixins/table"; import table from "@/assets/mixins/table";
export default { export default {
name: "RoomWorkmanList", name: "RoomWorkmanList",
components: { components: {
drawerShow drawerShow,
}, },
mixins: [table], mixins: [table],
created() { created() {},
}, methods: {
methods: { /** 重写新增方法 */
/** 重写新增方法 */ toAdd(row) {
toAdd(row) { this.$refs.drawerform.add(row);
this.$refs.drawerform.add(row); },
}, /** 重写编辑方法 */
/** 重写编辑方法 */ toEdit(row) {
toEdit(row) { this.$refs.drawerform.edit(row);
this.$refs.drawerform.edit(row); },
}, /** 重写查看方法 */
/** 重写查看方法 */ toView(row) {
toView(row) { this.$refs.drawerform.view(row);
this.$refs.drawerform.view(row); },
}, },
data() {
}, return {
data() { config: {
return { search: [],
config: { columns: [
search: [ { type: "selection", width: 60 },
], { type: "index", label: "序号", width: 50 },
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{label: "房间名称", prop: "roomName"}, {
label: "房间名称",
prop: "roomName",
formatter: (row) => (row.roomName ? row.roomName : "--"),
},
{label: "工作人员名称", prop: "workmanName"}, {
label: "工作人员名称",
prop: "workmanName",
formatter: (row) => (row.workmanName ? row.workmanName : "--"),
},
{label: "创建用户", prop: "createUserId", formatter: this.formatter}, {
{ label: "创建用户",
label: "操作", prop: "createUserId",
width: 240, formatter: this.formatter,
formatter: row => { },
return ( {
<table-buttons noAdd row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} /> label: "操作",
); width: 240,
} formatter: (row) => {
} return (
] <table-buttons
} noAdd
}; row={row}
} onEdit={this.toEdit}
onView={this.toView}
onDel={this.toDel}
/>
);
},
},
],
},
}; };
</script> },
\ No newline at end of file };
</script>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data="tableData" notAdd notDel :config="tableConfig" /> <LayoutTable :data="tableData" notAdd notDel :config="tableConfig" />
</div> </div>
</template> </template>
...@@ -26,36 +25,41 @@ export default { ...@@ -26,36 +25,41 @@ export default {
}, },
], ],
columns: [ columns: [
{ type: "index", label: "序号",align:"center", width: 50 }, { type: "index", label: "序号", align: "center", width: 50 },
{ {
prop: "userName", prop: "userName",
label: "用户名称", label: "用户名称",
align: "center", align: "center",
formatter: (row) => (row.userName ? row.userName : "--"),
}, },
{ {
prop: "loginName", prop: "loginName",
label: "用户登录名", label: "用户登录名",
align: "center", align: "center",
formatter: (row) => (row.loginName ? row.loginName : "--"),
}, },
{ {
prop: "requestUrl", prop: "requestUrl",
label: "请求地址", label: "请求地址",
align: "center", align: "center",
formatter: (row) => (row.requestUrl ? row.requestUrl : "--"),
}, },
{ {
prop: "content", prop: "content",
label: "操作内容", label: "操作内容",
align: "center", align: "center",
formatter: (row) => (row.content ? row.content : "--"),
}, },
{ {
prop: "ip", prop: "ip",
label: "操作IP地址", label: "操作IP地址",
align: "center", align: "center",
formatter: (row) => (row.ip ? row.ip : "--"),
}, },
{ {
......
<template> <template>
<div className="page"> <div className="page">
<el-card> <el-card>
<LayoutTable notPagination ref="layoutTable" :data="tableData" :config="tableConfig"/> <LayoutTable
notPagination
ref="layoutTable"
:data="tableData"
:config="tableConfig"
/>
</el-card> </el-card>
<dialog-show ref="dialogform" @ok="getData"/> <dialog-show ref="dialogform" @ok="getData" />
</div> </div>
</template> </template>
<script> <script>
import {handleTree} from "@/assets/utils/table"; import { handleTree } from "@/assets/utils/table";
import Treeselect from "@riophae/vue-treeselect"; import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css"; import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import table from "@/assets/mixins/table"; import table from "@/assets/mixins/table";
...@@ -17,15 +22,15 @@ import dialogShow from "./dialogshow"; ...@@ -17,15 +22,15 @@ import dialogShow from "./dialogshow";
export default { export default {
name: "Menu", name: "Menu",
mixins: [table], mixins: [table],
components: {Treeselect, dialogShow}, components: { Treeselect, dialogShow },
created() { created() {
this.query={"page":1,"size":-1} this.query = { page: 1, size: -1 };
}, },
methods: { methods: {
afterRender(data) { afterRender(data) {
data.data = handleTree(data.data, "id", "parentId"); data.data = handleTree(data.data, "id", "parentId");
this.menuOptions = data.data; this.menuOptions = data.data;
this.$refs.layoutTable.showType = "treetable" this.$refs.layoutTable.showType = "treetable";
}, },
handleUp(data) { handleUp(data) {
...@@ -46,17 +51,17 @@ export default { ...@@ -46,17 +51,17 @@ export default {
id: id, id: id,
type: type, type: type,
}) })
.then((res) => { .then((res) => {
if (res && res.code && res.code == 1) { if (res && res.code && res.code == 1) {
this.getData() this.getData();
this.loading = false;
this.$message.success("更新排序成功!");
}
})
.catch((error) => {
this.loading = false; this.loading = false;
this.$message.error(error.message); this.$message.success("更新排序成功!");
}); }
})
.catch((error) => {
this.loading = false;
this.$message.error(error.message);
});
}, },
handleAdd(row) { handleAdd(row) {
...@@ -70,17 +75,17 @@ export default { ...@@ -70,17 +75,17 @@ export default {
/** 重写编辑方法 */ /** 重写编辑方法 */
toEdit(row) { toEdit(row) {
this.loading = true; this.loading = true;
this.$post(this.pageInfo.exclude, {id: row.id}) this.$post(this.pageInfo.exclude, { id: row.id })
.then((res) => { .then((res) => {
if (res && res.code && res.code == 1) { if (res && res.code && res.code == 1) {
this.menuOptions = handleTree(res.data.data); this.menuOptions = handleTree(res.data.data);
this.$refs.dialogform.edit(row, this.menuOptions); this.$refs.dialogform.edit(row, this.menuOptions);
this.loading = false; this.loading = false;
} }
}) })
.catch((error) => { .catch((error) => {
this.$message.error(error.message); this.$message.error(error.message);
}) });
}, },
/** 重写查看方法 */ /** 重写查看方法 */
toView(row) { toView(row) {
...@@ -89,145 +94,146 @@ export default { ...@@ -89,145 +94,146 @@ export default {
// 展示菜单图标 // 展示菜单图标
showIcon(row, column) { showIcon(row, column) {
return <i class={'el-icon-'+row.imgPath}></i> return <i class={"el-icon-" + row.imgPath}></i>;
}, },
handleStatus(row){ handleStatus(row) {
if(row.status==1){ if (row.status == 1) {
this.$post("/menu/change/status", {id:row.id,status:0}) this.$post("/menu/change/status", { id: row.id, status: 0 })
.then(res => { .then((res) => {
if(res.code==1){ if (res.code == 1) {
row.status=0; row.status = 0;
} }
}) })
.catch(error => { .catch((error) => {
this.$message.error(error.message); this.$message.error(error.message);
}) });
}else{ } else {
this.$post("/menu/change/status", {id:row.id,status:1}) this.$post("/menu/change/status", { id: row.id, status: 1 })
.then(res => { .then((res) => {
if(res.code==1){ if (res.code == 1) {
row.status=1; row.status = 1;
} }
}) })
.catch(error => { .catch((error) => {
this.$message.error(error.message); this.$message.error(error.message);
}) });
} }
}, },
}, },
data() { data() {
return { return {
value: '1', value: "1",
config: { config: {
isshowTabPane:true, isshowTabPane: true,
/** 树表是否默认展开 */ /** 树表是否默认展开 */
expand: false, expand: false,
showType: "treetable", showType: "treetable",
search: [], search: [],
columns: [ columns: [
{ {
type: 'selection', type: "selection",
width: 60, width: 60,
}, },
{ {
prop: 'id', prop: "id",
label: 'ID', label: "ID",
width: 120, width: 120,
formatter: (row) => (row.id ? row.id : "--"),
}, },
{ {
prop: 'name', prop: "name",
label: '名称', label: "名称",
width: 160, width: 160,
formatter: (row) => (row.name ? row.name : "--"),
}, },
{ {
prop: 'imgPath', prop: "imgPath",
label: '图标', label: "图标",
width: 50, width: 50,
formatter: this.showIcon, formatter: this.showIcon,
}, },
{ {
prop: 'authType', prop: "authType",
label: '权限类型', label: "权限类型",
formatter: this.formatter, formatter: this.formatter,
}, },
{ {
prop: 'parentId', prop: "parentId",
label: '父ID', label: "父ID",
formatter: (row) => (row.parentId ? row.parentId : "--"),
}, },
{ {
prop: 'url', prop: "url",
label: '地址', label: "地址",
formatter: (row) => (row.url ? row.url : "--"),
}, },
{ {
prop: 'status', prop: "status",
label: '状态', label: "状态",
width: 100, width: 100,
formatter: row => { formatter: (row) => {
return ( return (
<el-switch <el-switch
value={row.status+""} value={row.status + ""}
active-color="#13ce66" active-color="#13ce66"
inactive-color="#ff4949" inactive-color="#ff4949"
active-value='1' active-value="1"
inactive-value='0' inactive-value="0"
onChange={() => { onChange={() => {
this.handleStatus(row); this.handleStatus(row);
}} }}
> ></el-switch>
</el-switch>
); );
} },
}, },
{ {
label: "操作", label: "操作",
width: 280, width: 280,
formatter: row => { formatter: (row) => {
return ( return (
<div> <div>
<el-link <el-link
style="margin-right:5px;margin-left:5px" style="margin-right:5px;margin-left:5px"
icon="el-icon-top" icon="el-icon-top"
onClick={() => { onClick={() => {
this.handleUp(row); this.handleUp(row);
}} }}
></el-link> ></el-link>
<el-link <el-link
style="margin-right:5px;margin-left:5px" style="margin-right:5px;margin-left:5px"
icon="el-icon-bottom" icon="el-icon-bottom"
onClick={() => { onClick={() => {
this.handleDown(row); this.handleDown(row);
}} }}
></el-link>
></el-link> <el-button
size="mini"
<el-button type="text"
size="mini" icon="el-icon-edit-outline"
type="text" onClick={() => {
icon="el-icon-edit-outline" this.handleAdd(row);
onClick={() => { }}
this.handleAdd(row); >
}} 新增
> </el-button>
新增 <table-buttons
</el-button> noAdd
<table-buttons noView
noAdd row={row}
noView onEdit={this.toEdit}
row={row} onView={this.toView}
onEdit={this.toEdit} onDel={this.toDel}
onView={this.toView} />
onDel={this.toDel} </div>
/>
</div>
); );
} },
} },
] ],
} },
}; };
} },
}; };
</script> </script>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data='tableData' :config='tableConfig' /> <LayoutTable :data="tableData" :config="tableConfig" />
<dialog-show ref="dialogform" @ok="getData" /> <dialog-show ref="dialogform" @ok="getData" />
</div> </div>
</template> </template>
<script> <script>
import table from '@/assets/mixins/table'; import table from "@/assets/mixins/table";
import dialogShow from "./dialogshow"; import dialogShow from "./dialogshow";
export default { export default {
mixins: [table], mixins: [table],
components: {dialogShow }, components: { dialogShow },
methods: { methods: {
// 新增 // 新增
toAdd(row) { toAdd(row) {
...@@ -21,92 +21,102 @@ export default { ...@@ -21,92 +21,102 @@ export default {
this.$refs.dialogform.edit(row); this.$refs.dialogform.edit(row);
}, },
// 查看 // 查看
toView(row,) { toView(row) {
this.$refs.dialogform.view(row); this.$refs.dialogform.view(row);
}, },
}, },
data() { data() {
return { return {
config: { config: {
search: [ search: [
{ {
name: 'name', name: "name",
type: 'text', type: "text",
label: '参数名称', label: "参数名称",
}, },
], ],
columns: [ columns: [
{ type: "selection",reserveSelection:true, width: 60 }, { type: "selection", reserveSelection: true, width: 60 },
{ type: "index", label: "序号",align:"center", width: 50 }, { type: "index", label: "序号", align: "center", width: 50 },
{ {
prop: 'name', prop: "name",
label: '参数名称', label: "参数名称",
formatter: (row) => (row.name ? row.name : "--"),
}, },
{ {
prop: 'firstOrganize', prop: "firstOrganize",
label: '一级组织', label: "一级组织",
formatter: (row) => (row.firstOrganize ? row.firstOrganize : "--"),
}, },
{ {
prop: 'secondOrganize', prop: "secondOrganize",
label: '二级组织', label: "二级组织",
formatter: (row) =>
row.secondOrganize ? row.secondOrganize : "--",
}, },
{ {
prop: 'paramKey', prop: "paramKey",
label: '参数键', label: "参数键",
formatter: (row) => (row.paramKey ? row.paramKey : "--"),
}, },
{ {
prop: 'paramValue', prop: "paramValue",
label: '参数值', label: "参数值",
formatter: (row) => (row.paramValue ? row.paramValue : "--"),
// formatter: this.util_short('paramValue', 20) // formatter: this.util_short('paramValue', 20)
}, },
{ {
prop: 'validStatus', prop: "validStatus",
label: '有效状态', label: "有效状态",
width: 70, width: 70,
formatter: this.formatter formatter: this.formatter,
}, },
{ {
prop: 'modStatus', prop: "modStatus",
label: '修改状态', label: "修改状态",
width: 100, width: 100,
formatter: this.formatter formatter: this.formatter,
}, },
{ {
prop: 'displayType', prop: "displayType",
label: '展现类型', label: "展现类型",
width: 100, width: 100,
formatter: this.formatter formatter: this.formatter,
}, },
{ {
prop: 'remark', prop: "remark",
label: '备注', label: "备注",
formatter: (row) => (row.remark ? row.remark : "--"),
}, },
{ {
label: '操作', label: "操作",
width: 260, width: 260,
formatter: (row)=> { formatter: (row) => {
return ( return (
<table-buttons noAdd row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} /> <table-buttons
) noAdd
row={row}
onEdit={this.toEdit}
onView={this.toView}
onDel={this.toDel}
/>
);
}, },
}, },
], ],
}, },
} };
} },
} };
</script> </script>
<style lang="css"> <style lang="css">
.el-tooltip__popper{ .el-tooltip__popper {
display: inline-block; display: inline-block;
max-width: 80%; max-width: 80%;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: normal ; white-space: normal;
line-height: 18px; line-height: 18px;
cursor: pointer; cursor: pointer;
} }
</style> </style>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data='tableData' :config='tableConfig' /> <LayoutTable :data="tableData" :config="tableConfig" />
<dialog-show ref="dialogform" @ok="getData" /> <dialog-show ref="dialogform" @ok="getData" />
</div> </div>
</template> </template>
<script> <script>
import table from '@/assets/mixins/table'; import table from "@/assets/mixins/table";
import dialogShow from "./dialogshow"; import dialogShow from "./dialogshow";
export default { export default {
mixins: [table], mixins: [table],
components: { components: {
dialogShow, dialogShow,
}, },
methods: { methods: {
...@@ -32,56 +32,62 @@ export default { ...@@ -32,56 +32,62 @@ export default {
config: { config: {
search: [ search: [
{ {
name: 'name', name: "name",
type: 'text', type: "text",
label: '资源名称', label: "资源名称",
}, },
{ {
name: 'authType', name: "authType",
type: 'select', type: "select",
label: '权限类型', label: "权限类型",
}, },
], ],
columns: [ columns: [
{ type: "selection",reserveSelection:true, width: 60 }, { type: "selection", reserveSelection: true, width: 60 },
{ type: "index", label: "序号",align:"center", width: 50 }, { type: "index", label: "序号", align: "center", width: 50 },
// { // {
// prop: 'id', // prop: 'id',
// label: 'ID', // label: 'ID',
// }, // },
{ {
prop: 'name', prop: "name",
label: '名称', label: "名称",
formatter: (row) => (row.name ? row.name : "--"),
}, },
{ {
prop: 'url', prop: "url",
label: '资源', label: "资源",
formatter: (row) => (row.url ? row.url : "--"),
}, },
{ {
prop: 'authType', prop: "authType",
label: '认证类型', label: "认证类型",
formatter: this.formatter, formatter: this.formatter,
}, },
// { // {
// prop: 'userType', // prop: 'userType',
// label: '用户类型', // label: '用户类型',
// width: 100, // width: 100,
// formatter: this.formatter, // formatter: this.formatter,
// }, // },
{ {
label: '操作', label: "操作",
witdh: 120, witdh: 120,
formatter: (row)=> { formatter: (row) => {
return ( return (
<table-buttons noView row={row} onEdit={this.toEdit} onDel={this.toDel} /> <table-buttons
) noView
row={row}
onEdit={this.toEdit}
onDel={this.toDel}
/>
);
}, },
}, },
], ],
}, },
} };
} },
} };
</script> </script>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data="tableData" :config="tableConfig" /> <LayoutTable :data="tableData" :config="tableConfig" />
<dialog-show ref="dialogform" @ok="getData" /> <dialog-show ref="dialogform" @ok="getData" />
<el-dialog title="分配权限" :visible.sync="auth.visible"> <el-dialog title="分配权限" :visible.sync="auth.visible">
<el-form :model="auth.form"> <el-form :model="auth.form">
...@@ -158,7 +158,7 @@ import table from "@/assets/mixins/table"; ...@@ -158,7 +158,7 @@ import table from "@/assets/mixins/table";
import dialogShow from "./dialogshow"; import dialogShow from "./dialogshow";
export default { export default {
mixins: [table], mixins: [table],
components: { dialogShow }, components: { dialogShow },
created() {}, created() {},
methods: { methods: {
beforeRender(data) { beforeRender(data) {
...@@ -186,7 +186,7 @@ export default { ...@@ -186,7 +186,7 @@ export default {
return this.allResources; return this.allResources;
} }
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
this.$post("/resource/list", {size: -1}) this.$post("/resource/list", { size: -1 })
.then(({ data }) => { .then(({ data }) => {
resolve(this.groupByAuth(data.data)); resolve(this.groupByAuth(data.data));
}) })
...@@ -224,8 +224,8 @@ export default { ...@@ -224,8 +224,8 @@ export default {
getRoleAuths(id) { getRoleAuths(id) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
this.$post("/role/auth/list", { this.$post("/role/auth/list", {
"roleId": id, roleId: id,
"size": -1, size: -1,
}) })
.then(({ data }) => { .then(({ data }) => {
const result = data.data.map((i) => i.resourceId); const result = data.data.map((i) => i.resourceId);
...@@ -240,7 +240,7 @@ export default { ...@@ -240,7 +240,7 @@ export default {
this.auth.form.resourceIdList = this.auth.checkList this.auth.form.resourceIdList = this.auth.checkList
.filter((i) => typeof i === "number") .filter((i) => typeof i === "number")
.join(","); .join(",");
await this.$post("/role/auth/distributionSource", this.auth.form); await this.$post("/role/auth/distributionSource", this.auth.form);
this.auth.visible = false; this.auth.visible = false;
this.auth.form = this.initForm(); this.auth.form = this.initForm();
this.$message.success("操作成功"); this.$message.success("操作成功");
...@@ -255,7 +255,7 @@ export default { ...@@ -255,7 +255,7 @@ export default {
// return this.allUsers; // return this.allUsers;
// } // }
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
this.$post("/user/list", { size: -1 }) this.$post("/user/list", { size: -1 })
.then(({ data }) => { .then(({ data }) => {
resolve(data.data); resolve(data.data);
}) })
...@@ -281,10 +281,10 @@ export default { ...@@ -281,10 +281,10 @@ export default {
async getUsersoo(userTypeIdVal, loginNameVal, realNameVal) { async getUsersoo(userTypeIdVal, loginNameVal, realNameVal) {
const query = { const query = {
"size": -1, size: -1,
"userType": userTypeIdVal, userType: userTypeIdVal,
"loginName": loginNameVal, loginName: loginNameVal,
"realName": realNameVal, realName: realNameVal,
}; };
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
this.$post("/user/list", query) this.$post("/user/list", query)
...@@ -336,8 +336,8 @@ export default { ...@@ -336,8 +336,8 @@ export default {
getRoleUsers(id) { getRoleUsers(id) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
this.$post("/role/user/list", { this.$post("/role/user/list", {
"roleId": id, roleId: id,
"size": -1, size: -1,
}) })
.then(({ data }) => { .then(({ data }) => {
const result = data.data const result = data.data
...@@ -380,8 +380,8 @@ export default { ...@@ -380,8 +380,8 @@ export default {
async saveUser() { async saveUser() {
try { try {
//this.user.form.userIdList = this.user.checkList.join(","); //this.user.form.userIdList = this.user.checkList.join(",");
this.user.form.userIdList = this.user.checkList this.user.form.userIdList = this.user.checkList;
await this.$post("/role/user/distributionUser", this.user.form,); await this.$post("/role/user/distributionUser", this.user.form);
this.user.visible = false; this.user.visible = false;
this.user.form = this.initForm(); this.user.form = this.initForm();
this.$message.success("操作成功"); this.$message.success("操作成功");
...@@ -445,19 +445,20 @@ export default { ...@@ -445,19 +445,20 @@ export default {
type: "text", type: "text",
label: "角色名", label: "角色名",
}, },
], ],
columns: [ columns: [
{ type: "selection",reserveSelection:true, width: 60 }, { type: "selection", reserveSelection: true, width: 60 },
{ type: "index", label: "序号",align:"center", width: 50 }, { type: "index", label: "序号", align: "center", width: 50 },
{ {
prop: "name", prop: "name",
label: "角色名", label: "角色名",
formatter: (row) => (row.name ? row.name : "--"),
}, },
{ {
prop: "remark", prop: "remark",
label: "备注", label: "备注",
formatter: (row) => (row.remark ? row.remark : "--"),
}, },
// { // {
// prop: "roleType", // prop: "roleType",
...@@ -470,7 +471,7 @@ export default { ...@@ -470,7 +471,7 @@ export default {
label: "创建时间", label: "创建时间",
formatter: this.formatterDate, formatter: this.formatterDate,
}, },
{ {
label: "操作", label: "操作",
witdh: 120, witdh: 120,
...@@ -483,16 +484,15 @@ export default { ...@@ -483,16 +484,15 @@ export default {
onEdit={this.toEdit} onEdit={this.toEdit}
onDel={this.toDel} onDel={this.toDel}
/>{" "} />{" "}
<el-button
<el-button icon="el-icon-share"
icon="el-icon-share" size="mini"
size="mini" type="text"
type="text" onClick={() => this.setAuth(row)}
onClick={() => this.setAuth(row)} >
> 分配权限
分配权限 </el-button>
</el-button> {/*
{/*
<el-button <el-button
icon="el-icon-goods" icon="el-icon-goods"
size="mini" size="mini"
...@@ -547,5 +547,3 @@ export default { ...@@ -547,5 +547,3 @@ export default {
margin-top: 20px; margin-top: 20px;
} }
</style> </style>
...@@ -41,23 +41,26 @@ export default { ...@@ -41,23 +41,26 @@ export default {
}, },
], ],
columns: [ columns: [
{ type: "selection", reserveSelection: true, width: 60 },
{ type: "selection",reserveSelection:true, width: 60 }, { type: "index", label: "序号", align: "center", width: 50 },
{ type: "index", label: "序号",align:"center", width: 50 },
{ {
prop: "name", prop: "name",
label: "任务名称", label: "任务名称",
align: "center", align: "center",
formatter: (row) => (row.name ? row.name : "--"),
}, },
{ {
prop: "excuteHost", prop: "excuteHost",
label: "执行主机", label: "执行主机",
align: "center", align: "center",
formatter: (row) => (row.excuteHost ? row.excuteHost : "--"),
}, },
{ {
prop: "excuteContainer", prop: "excuteContainer",
label: "执行容器", label: "执行容器",
align: "center", align: "center",
formatter: (row) =>
row.excuteContainer ? row.excuteContainer : "--",
}, },
{ {
prop: "excuteStrategy", prop: "excuteStrategy",
...@@ -69,6 +72,8 @@ export default { ...@@ -69,6 +72,8 @@ export default {
prop: "lastExcuteHost", prop: "lastExcuteHost",
label: "最后执行主机", label: "最后执行主机",
align: "center", align: "center",
formatter: (row) =>
row.lastExcuteHost ? row.lastExcuteHost : "--",
}, },
{ {
prop: "lastExcuteTime", prop: "lastExcuteTime",
...@@ -103,5 +108,3 @@ export default { ...@@ -103,5 +108,3 @@ export default {
}, },
}; };
</script> </script>
...@@ -110,8 +110,8 @@ export default { ...@@ -110,8 +110,8 @@ export default {
getRoleUsers(id) { getRoleUsers(id) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
this.$post("/role/user/list", { this.$post("/role/user/list", {
"userId": id, userId: id,
"size": -1, size: -1,
}) })
.then(({ data }) => { .then(({ data }) => {
const result = data.data const result = data.data
...@@ -152,22 +152,25 @@ export default { ...@@ -152,22 +152,25 @@ export default {
}, },
config: { config: {
columns: [ columns: [
{ type: "selection",reserveSelection:true, width: 60 }, { type: "selection", reserveSelection: true, width: 60 },
{ type: "index", label: "序号",align:"center", width: 50 }, { type: "index", label: "序号", align: "center", width: 50 },
{ {
prop: "loginName", prop: "loginName",
label: "登录名称", label: "登录名称",
align: "center", align: "center",
formatter: (row) => (row.loginName ? row.loginName : "--"),
}, },
{ {
prop: "realName", prop: "realName",
label: "用户名称", label: "用户名称",
align: "center", align: "center",
formatter: (row) => (row.realName ? row.realName : "--"),
}, },
{ {
prop: "mobile", prop: "mobile",
label: "手机号码", label: "手机号码",
align: "center", align: "center",
formatter: (row) => (row.mobile ? row.mobile : "--"),
}, },
{ {
prop: "roleIds", prop: "roleIds",
...@@ -237,5 +240,3 @@ export default { ...@@ -237,5 +240,3 @@ export default {
}, },
}; };
</script> </script>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data='tableData' :config='tableConfig' notAdd notDel /> <LayoutTable :data="tableData" :config="tableConfig" notAdd notDel />
</div> </div>
</template> </template>
<script> <script>
import table from '@/assets/mixins/table'; import table from "@/assets/mixins/table";
export default { export default {
mixins: [table], mixins: [table],
methods: { methods: {},
},
data() { data() {
return { return {
config: { config: {
columns: [ columns: [
{ {
type: 'selection', type: "selection",
width: 60, width: 60,
}, },
{ {
prop: 'id', prop: "id",
label: 'ID', label: "ID",
width: 60, width: 60,
formatter: (row) => (row.id ? row.id : "--"),
}, },
{ {
prop: 'code', prop: "code",
label: '验证码', label: "验证码",
formatter: (row) => (row.code ? row.code : "--"),
}, },
{ {
prop: 'url', prop: "url",
label: '校验地址', label: "校验地址",
formatter: (row) => (row.url ? row.url : "--"),
}, },
{ {
prop: 'mobile', prop: "mobile",
label: '手机号码', label: "手机号码",
formatter: (row) => (row.mobile ? row.mobile : "--"),
}, },
{ {
prop: 'email', prop: "email",
label: '校验邮箱', label: "校验邮箱",
formatter: (row) => (row.email ? row.email : "--"),
}, },
{ {
prop: 'type', prop: "type",
label: '校验方式', label: "校验方式",
width: 130, width: 130,
formatter: this.formatter, formatter: this.formatter,
}, },
{ {
prop: 'sessionId', prop: "sessionId",
label: '会话ID' label: "会话ID",
formatter: (row) => (row.sessionId ? row.sessionId : "--"),
}, },
{ {
prop: 'ip', prop: "ip",
label: 'IP地址' label: "IP地址",
formatter: (row) => (row.ip ? row.ip : "--"),
}, },
{ {
prop: 'createTime', prop: "createTime",
label: '创建时间' label: "创建时间",
formatter: (row) => (row.createTime ? row.createTime : "--"),
}, },
{ {
prop: 'lapseTime', prop: "lapseTime",
label: '失效时间' label: "失效时间",
formatter: (row) => (row.lapseTime ? row.lapseTime : "--"),
}, },
{ {
label: '操作', label: "操作",
formatter: (row)=> { formatter: (row) => {
return ( return (
<table-buttons row={row} onEdit={this.toEdit} onDel={this.toDel} /> <table-buttons
) row={row}
onEdit={this.toEdit}
onDel={this.toDel}
/>
);
}, },
}, },
], ],
search: [ search: [
{ {
name: 'mobile', name: "mobile",
type: 'text', type: "text",
label: '手机号码', label: "手机号码",
}, },
] ],
}, },
};
} },
} };
}
</script> </script>
<template> <template>
<div class="page"> <div class="page">
<LayoutTable :data="tableData" :config="tableConfig"> <LayoutTable :data="tableData" :config="tableConfig">
<!-- <el-button <!-- <el-button
slot="table-head-left2" slot="table-head-left2"
style="margin-left: 10px" style="margin-left: 10px"
icon="el-icon-tickets" icon="el-icon-tickets"
...@@ -16,250 +16,286 @@ ...@@ -16,250 +16,286 @@
@click="doExport" @click="doExport"
:disabled="isExport" :disabled="isExport"
>导出</el-button>--> >导出</el-button>-->
</LayoutTable> </LayoutTable>
<!-- 工作人员导入对话框 --> <!-- 工作人员导入对话框 -->
<el-dialog <el-dialog
:title="upload.title" :title="upload.title"
:visible.sync="upload.open" :visible.sync="upload.open"
width="400px" width="400px"
append-to-body append-to-body
> >
<el-upload <el-upload
ref="upload" ref="upload"
:limit="1" :limit="1"
accept=".xlsx, .xls" accept=".xlsx, .xls"
:headers="upload.headers" :headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport" :action="upload.url + '?updateSupport=' + upload.updateSupport"
:disabled="upload.isUploading" :disabled="upload.isUploading"
:on-progress="handleFileUploadProgress" :on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess" :on-success="handleFileSuccess"
:auto-upload="false" :auto-upload="false"
drag drag
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
将文件拖到此处,或
<em>点击上传</em>
</div>
<div class="el-upload__tip" slot="tip">
<el-checkbox
v-model="upload.updateSupport"
/>是否更新已经存在的数据
<el-link type="primary" style="font-size: 14px" @click="downloadTemplate"
>下载模板</el-link
>
</div>
<div class="el-upload__tip" style="color: red" slot="tip">
提示:仅允许导入“xls”或“xlsx”格式文件!
</div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">确 定</el-button>
<el-button @click="upload.open = false">取 消</el-button>
</div>
</el-dialog>
<el-dialog
:title="user.title"
:visible.sync="user.open"
width="400px"
append-to-body
> >
<el-form label-width="80px"> <i class="el-icon-upload"></i>
<el-form-item label="新密码"> <div class="el-upload__text">
<el-input v-model="newPwd"></el-input> 将文件拖到此处,或
</el-form-item> <em>点击上传</em>
</div>
</el-form> <div class="el-upload__tip" slot="tip">
<div slot="footer" class="dialog-footer"> <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的数据
<el-button type="primary" @click="submitUserForm">确 定</el-button> <el-link
<el-button @click="user.open = false">取 消</el-button> type="primary"
style="font-size: 14px"
@click="downloadTemplate"
>下载模板</el-link
>
</div>
<div class="el-upload__tip" style="color: red" slot="tip">
提示:仅允许导入“xls”或“xlsx”格式文件!
</div> </div>
</el-dialog> </el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">确 定</el-button>
<el-button @click="upload.open = false">取 消</el-button>
</div>
</el-dialog>
<drawer-show ref="drawerform" @ok="getData" /> <el-dialog
</div> :title="user.title"
:visible.sync="user.open"
width="400px"
append-to-body
>
<el-form label-width="80px">
<el-form-item label="新密码">
<el-input v-model="newPwd"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitUserForm">确 定</el-button>
<el-button @click="user.open = false">取 消</el-button>
</div>
</el-dialog>
<drawer-show ref="drawerform" @ok="getData" />
</div>
</template> </template>
<script> <script>
/** 表单弹出框模式需引入 */ /** 表单弹出框模式需引入 */
import drawerShow from "./drawershow"; import drawerShow from "./drawershow";
import table from "@/assets/mixins/table"; import table from "@/assets/mixins/table";
export default { export default {
name: "WorkmanList", name: "WorkmanList",
components: { components: {
drawerShow drawerShow,
}, },
mixins: [table], mixins: [table],
created() { created() {},
methods: {
/** 导入 */
handleImport() {
this.upload.title = "工作人员导入";
this.upload.open = true;
},
/** 下载模板操作 */
downloadTemplate() {
this.isExport = true;
this.$download("/workman/downloadTemplate", {}, { type: "excel" })
.then(() => (this.isExport = false))
.catch((error) => {
this.isExport = false;
this.$message.error(error.message);
});
},
/** 文件上传中处理 */
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
},
/** 文件上传成功处理 */
handleFileSuccess(response, file, fileList) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
this.getData();
},
/** 提交上传文件 */
submitFileForm() {
this.$refs.upload.submit();
},
/** 导出Excel */
doExport() {
this.isExport = true;
this.$download(
"/workman/exportExcel",
{
idList: this.selection,
}, },
methods: { { type: "excel" }
/** 导入 */ )
handleImport() { .then(() => (this.isExport = false))
this.upload.title = "工作人员导入"; .catch((error) => {
this.upload.open = true; this.isExport = false;
}, this.$message.error(error.message);
/** 下载模板操作 */ });
downloadTemplate() { },
this.isExport = true; /** 重写新增方法 */
this.$download("/workman/downloadTemplate", {}, { type: "excel" }) toAdd(row) {
.then(() => (this.isExport = false)) this.$refs.drawerform.add(row);
.catch((error) => { },
this.isExport = false; /** 重写编辑方法 */
this.$message.error(error.message); toEdit(row) {
}); this.$refs.drawerform.edit(row);
}, },
/** 文件上传中处理 */ /** 重写查看方法 */
handleFileUploadProgress(event, file, fileList) { toView(row) {
this.upload.isUploading = true; this.$refs.drawerform.view(row);
}, },
/** 文件上传成功处理 */
handleFileSuccess(response, file, fileList) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
this.getData();
},
/** 提交上传文件 */
submitFileForm() {
this.$refs.upload.submit();
},
/** 导出Excel */
doExport() {
this.isExport = true;
this.$download("/workman/exportExcel", {
"idList": this.selection,
}, { type: "excel" }).then(() => this.isExport = false).catch(error => {
this.isExport = false;
this.$message.error(error.message);
});
},
/** 重写新增方法 */
toAdd(row) {
this.$refs.drawerform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.drawerform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.drawerform.view(row);
},
handleChangePwd(row) { handleChangePwd(row) {
this.user.title = "修改密码"; this.user.title = "修改密码";
this.loginName=row.loginName; this.loginName = row.loginName;
this.newPwd=null; this.newPwd = null;
this.user.open = true; this.user.open = true;
}, },
submitUserForm() { submitUserForm() {
this.$post("/workman/change/password", { this.$post("/workman/change/password", {
loginName: this.loginName, loginName: this.loginName,
newPwd: this.newPwd newPwd: this.newPwd,
}) })
.then((res) => { .then((res) => {
if (res.code == 1) { if (res.code == 1) {
this.$message.success("批量更新大厅设备成功!"); this.$message.success("批量更新大厅设备成功!");
this.user.open = false; this.user.open = false;
this.getData(); this.getData();
} }
}) })
.catch((error) => { .catch((error) => {
this.$message.error(error.message); this.$message.error(error.message);
}); });
}, },
},
data() {
return {
loginName: null,
newPwd: null,
// 用户导入参数
upload: {
// 是否显示弹出层(工作人员导入)
open: false,
// 弹出层标题(工作人员导入)
title: "导入工作人员数据",
// 是否禁用上传
isUploading: false,
// 是否更新已经存在的数据
updateSupport: 0,
// 上传的地址
url: "/m/workman/importData",
},
user: {
// 是否显示弹出层(工作人员导入)
open: false,
// 弹出层标题(工作人员导入)
title: "修改密码",
},
isExport: false,
config: {
search: [],
columns: [
{ type: "selection", width: 60 },
{ type: "index", label: "序号", width: 50 },
}, {
data() { label: "照片",
return { prop: "photoPath",
loginName:null, formatter: (row) => {
newPwd:null, return row.photoPath != "" ? (
// 用户导入参数 <el-image
upload: { style="width: 70px; height: 70px"
// 是否显示弹出层(工作人员导入) src={row.photoPath}
open: false, preview-src-list={[row.photoPath]}
// 弹出层标题(工作人员导入) ></el-image>
title: "导入工作人员数据", ) : (
// 是否禁用上传 "--"
isUploading: false, );
// 是否更新已经存在的数据 },
updateSupport: 0, },
// 上传的地址
url: "/m/workman/importData",
},
user: {
// 是否显示弹出层(工作人员导入)
open: false,
// 弹出层标题(工作人员导入)
title: "修改密码",
},
isExport: false,
config: {
search: [
],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{label: "照片", prop: "photoPath",formatter: (row) => {
return row.photoPath != "" ? (
<el-image
style="width: 70px; height: 70px"
src={row.photoPath}
preview-src-list={[row.photoPath]}
></el-image>
) : (
"--"
);
},},
{label: "姓名", prop: "name"},
{label: "所属部门", prop: "deptName"},
{label: "所属房间", prop: "roomName"},
{label: "职位", prop: "userPost"},
{label: "电话", prop: "phone"}, {
{label: "手机", prop: "mobile"}, label: "姓名",
prop: "name",
formatter: (row) => (row.name ? row.name : "--"),
},
{
label: "所属部门",
prop: "deptName",
formatter: (row) => (row.deptName ? row.deptName : "--"),
},
{label: "工作状态", prop: "workStatus"}, {
label: "所属房间",
prop: "roomName",
formatter: (row) => (row.roomName ? row.roomName : "--"),
},
{ {
label: "操作", label: "职位",
width: 240, prop: "userPost",
formatter: row => { formatter: (row) => (row.userPost ? row.userPost : "--"),
return ( },
<div>
<table-buttons noAdd row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
<span> </span> {
<el-button label: "电话",
type="text" prop: "phone",
size="mini" formatter: (row) => (row.phone ? row.phone : "--"),
onClick={() => this.handleChangePwd(row)} },
> {
修改密码 label: "手机",
</el-button> prop: "mobile",
formatter: (row) => (row.mobile ? row.mobile : "--"),
},
{
label: "工作状态",
prop: "workStatus",
formatter: (row) => (row.workStatus ? row.workStatus : "--"),
},
</div> {
label: "操作",
width: 240,
formatter: (row) => {
return (
<div>
<table-buttons
noAdd
row={row}
onEdit={this.toEdit}
onView={this.toView}
onDel={this.toDel}
/>
); <span> </span>
} <el-button
} type="text"
] size="mini"
} onClick={() => this.handleChangePwd(row)}
}; >
} 修改密码
</el-button>
</div>
);
},
},
],
},
}; };
},
};
</script> </script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment