You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
323 lines
8.2 KiB
323 lines
8.2 KiB
<template>
|
|
<lay-container fluid="true" style="padding: 10px">
|
|
<lay-row space="10">
|
|
<lay-col span="24">
|
|
<lay-card>
|
|
<lay-form :model="searchObj" class="search-box">
|
|
<lay-row class="search-items">
|
|
<lay-form-item label="姓名" prop="FName">
|
|
<lay-input v-model="searchObj.FName"></lay-input>
|
|
</lay-form-item>
|
|
<lay-form-item label="手机号" prop="FPhone">
|
|
<lay-input v-model="searchObj.FPhone"></lay-input>
|
|
</lay-form-item>
|
|
<lay-form-item label="工厂" prop="FFactoryList">
|
|
<lay-select v-model="searchObj.FFactoryList">
|
|
<lay-select-option v-for="(tIdv, tIdx) in factoryList" :key="tIdx" :value="tIdv.FID"
|
|
:label="tIdv.FName"></lay-select-option>
|
|
</lay-select>
|
|
</lay-form-item>
|
|
<lay-form-item label="状态" prop="FState">
|
|
<lay-select v-model="searchObj.FState">
|
|
<lay-select-option v-for="(tIdv, tIdx) in stateList" :key="tIdx" :value="tIdv.FValue"
|
|
:label="tIdv.FName"></lay-select-option>
|
|
</lay-select>
|
|
</lay-form-item>
|
|
</lay-row>
|
|
<lay-form-item class="search-btn">
|
|
<lay-button size="sm" type="primary" @click="_clickSearch">搜索</lay-button>
|
|
<lay-button size="sm" @click="_clickReset">重置</lay-button>
|
|
</lay-form-item>
|
|
</lay-form>
|
|
<lay-table :columns="dataColumn" id="id" :dataSource="dataList" v-model:selectedKeys="selectedKeys"
|
|
:checkbox="checkbox" :default-toolbar="defaultToolbar" :page="dataList.length > 0 ? pageInfo : null"
|
|
@change="changePage">
|
|
<template v-slot:toolbar>
|
|
<lay-button size="sm" @click="_getPageList(false, true)">刷新</lay-button>
|
|
<lay-button size="sm" type="normal" @click="_changeUser()">新增</lay-button>
|
|
</template>
|
|
<template v-slot:FUser="{ data }">
|
|
{{ data.FUser }}
|
|
</template>
|
|
<template v-slot:FName="{ data }">
|
|
{{ data.FName }}
|
|
</template>
|
|
<template v-slot:FFactoryName="{ data }">
|
|
{{ data.FFactoryName }}
|
|
</template>
|
|
<template v-slot:FPhone="{ data }">
|
|
{{ data.FPhone }}
|
|
</template>
|
|
<template v-slot:FRoleName="{ data }">
|
|
{{ data.FRoleName }}
|
|
</template>
|
|
<template v-slot:FStateName="{ data }">
|
|
{{ data.FStateName }}
|
|
</template>
|
|
<template v-slot:FAddDate="{ data }">
|
|
{{ data.FAddDate }}
|
|
</template>
|
|
<template v-slot:FLoginDate="{ data }">
|
|
{{ data.FLoginDate }}
|
|
</template>
|
|
<template v-slot:operator="{ data }">
|
|
<lay-button size="xs" type="primary" @click="_changeUser(data)"> 编辑 </lay-button>
|
|
<lay-button size="xs" type="danger" @click="_deleteUser(data.FID)">删除</lay-button>
|
|
</template>
|
|
</lay-table>
|
|
</lay-card>
|
|
</lay-col>
|
|
</lay-row>
|
|
<lay-layer area="56%" v-model="showEditBox" :title="editBoxTitle">
|
|
<EditUser :userInfoObj="userInfoObj" :stateList="stateList" :factoryList="factoryList"
|
|
@cancelClick="cancelClick"></EditUser>
|
|
</lay-layer>
|
|
</lay-container>
|
|
</template>
|
|
<script>
|
|
import {
|
|
ref,
|
|
watch
|
|
} from "vue";
|
|
import {
|
|
getBasicList,
|
|
deleteDataById,
|
|
getPageList
|
|
} from "/src/api/api/common";
|
|
import {
|
|
getFactoryList
|
|
} from "/src/api/api/factory";
|
|
import {
|
|
GetPowerList,
|
|
getRoleList
|
|
} from "/src/api/api/user";
|
|
|
|
import EditUser from './components/EditUser2.vue';
|
|
import '@layui/layui-vue/es/checkbox/index.css';
|
|
export default {
|
|
components: {
|
|
EditUser
|
|
},
|
|
setup() {
|
|
let dataColumn = [{
|
|
title: "用户名",
|
|
key: "FUser"
|
|
},
|
|
{
|
|
title: "姓名",
|
|
key: "FName"
|
|
},
|
|
{
|
|
title: "权限",
|
|
key: "FRoleName"
|
|
},
|
|
{
|
|
title: "手机号",
|
|
key: "FPhone"
|
|
},
|
|
{
|
|
title: "状态",
|
|
key: "FStateName",
|
|
width: "90px"
|
|
},
|
|
{
|
|
title: "创建时间",
|
|
key: "FAddDate",
|
|
width: "126px"
|
|
},
|
|
{
|
|
title: "最后登录时间",
|
|
key: "FLoginDate",
|
|
width: "182px"
|
|
},
|
|
{
|
|
title: "操作",
|
|
key: "operator",
|
|
width: "148px"
|
|
}
|
|
];
|
|
dataColumn.forEach((item) => {
|
|
item.customSlot = item.key;
|
|
item.align = "center";
|
|
});
|
|
const selectedKeys = ref(["1"]);
|
|
const checkbox = ref(false);
|
|
const defaultToolbar = ref(true);
|
|
const showEditBox = ref(false);
|
|
const userInfoObj = ref({});
|
|
const searchObj = ref({});
|
|
const postData = ref({});
|
|
const pageInfo = ref({
|
|
total: 0,
|
|
limit: 10,
|
|
current: 1
|
|
});
|
|
const dataList = ref([]);
|
|
const stateList = ref([]);
|
|
const factoryList = ref([]);
|
|
const editBoxTitle = ref("");
|
|
const powerList = ref([]);
|
|
const roleLists = ref([]);
|
|
|
|
|
|
return {
|
|
userInfoObj,
|
|
editBoxTitle,
|
|
showEditBox,
|
|
selectedKeys,
|
|
checkbox,
|
|
defaultToolbar,
|
|
dataColumn,
|
|
dataList,
|
|
stateList,
|
|
factoryList,
|
|
pageInfo,
|
|
searchObj,
|
|
postData,
|
|
powerList,
|
|
roleLists
|
|
};
|
|
},
|
|
mounted() {
|
|
this._getBasicList();
|
|
this._getFactoryList();
|
|
|
|
this._getPowerList();
|
|
this._getRoleList();
|
|
},
|
|
created(){
|
|
this._getPageList(true);
|
|
},
|
|
methods: {
|
|
changePage(obj) {
|
|
this.pageInfo.current = obj.current;
|
|
this.pageInfo.limit = obj.limit;
|
|
this._getPageList();
|
|
},
|
|
//获取状态集合
|
|
async _getBasicList() {
|
|
this.stateList = await getBasicList(41) || [];
|
|
},
|
|
//获取工厂集合
|
|
async _getFactoryList() {
|
|
this.factoryList = await getFactoryList() || [];
|
|
},
|
|
async _getPowerList() {
|
|
this.powerList = await GetPowerList() || [];
|
|
},
|
|
//获取角色集合
|
|
async _getRoleList() {
|
|
this.roleLists = await getRoleList() || [];
|
|
},
|
|
//获取用户集合
|
|
async _getPageList(isFirst, showOk) {
|
|
//this.dataList = [];
|
|
this.pageInfo.total = 0;
|
|
if (isFirst) {
|
|
this.pageInfo.current = 1;
|
|
this.pageInfo.total = 0;
|
|
}
|
|
this.postData.FPageIndex = this.pageInfo.current;
|
|
this.postData.FPageSize = this.pageInfo.limit;
|
|
this.postData.FUserType = 1;
|
|
let result = await getPageList(this.postData, "User");
|
|
//result.Data.List = result.Data.List || [];
|
|
|
|
this._getPowerList();
|
|
result.Data.List.forEach((item) => {
|
|
let state = this.stateList.find(s => s.FValue == item.FState);
|
|
item.FStateName = state == null ? "" : state.FName;
|
|
let str = "";
|
|
var power = this.powerList.filter(function (p) {
|
|
return p.FUserID == item.FID;
|
|
});
|
|
|
|
for (let i = 0; i < power.length; i++) {
|
|
if (power[i].FRole != "" && power[i].FFactoryID != "") {
|
|
let factory = this.factoryList.find(s => s.FID == power[i].FFactoryID);
|
|
let role = this.roleLists.find(s => s.FID == power[i].FRole);
|
|
str += factory.FName + "=>" + role.FName + "\r\n";
|
|
}
|
|
}
|
|
|
|
item.FRoleName = str;
|
|
|
|
|
|
item.FLoginDate = item.FLoginDate == null ? "" : this.dateFormat(item.FLoginDate);
|
|
item.FAddDate = item.FAddDate == null ? "" : this.dateFormat(item.FAddDate).split(' ')[0];
|
|
});
|
|
this.pageInfo.total = result.Data.Total || 0;
|
|
this.dataList = result.Data.List;
|
|
},
|
|
//日期处理
|
|
dateFormat(dataStr) {
|
|
return dataStr.replace('T', ' ').split('.')[0];
|
|
},
|
|
//删除用户弹窗
|
|
_deleteUser(userId) {
|
|
let $this = this;
|
|
layer.confirm("你确定要删除此用户吗？", {
|
|
btn: [{
|
|
text: '确定',
|
|
callback: function (id) {
|
|
$this.__deleteStudent(id, userId);
|
|
}
|
|
},
|
|
{
|
|
text: '取消',
|
|
callback: function (id) {
|
|
layer.close(id);
|
|
}
|
|
}
|
|
]
|
|
});
|
|
},
|
|
//实际删除用户
|
|
async __deleteStudent(layId, userId) {
|
|
let result = await deleteDataById(userId, 'User');
|
|
layer.close(layId);
|
|
if (result && result > 0) {
|
|
layer.msg("操作成功", {
|
|
time: 1000,
|
|
icon: 1
|
|
})
|
|
} else {
|
|
layer.msg("操作失败", {
|
|
time: 1000,
|
|
icon: 2
|
|
})
|
|
}
|
|
this._getPageList(true);
|
|
},
|
|
//操作用户信息
|
|
_changeUser(userObj) {
|
|
if (userObj) this.editBoxTitle = "修改用户";
|
|
else this.editBoxTitle = "添加用户";
|
|
this.showEditBox = true;
|
|
this.userInfoObj = userObj || {};
|
|
},
|
|
cancelClick(isRefresh) {
|
|
this.showEditBox = false;
|
|
if (isRefresh) {
|
|
this._getPageList(true);
|
|
this._getPowerList();
|
|
}
|
|
},
|
|
//检索-检索
|
|
_clickSearch() {
|
|
this.postData = {};
|
|
for (let key in this.searchObj) {
|
|
let val = this.searchObj[key];
|
|
if (val != null && val != "") this.postData[key] = val;
|
|
}
|
|
this._getPageList(true);
|
|
},
|
|
//检索-重置
|
|
_clickReset() {
|
|
this.searchObj = {};
|
|
this._clickSearch();
|
|
}
|
|
}
|
|
}
|
|
</script>
|