FactorySystemWeb/src/views/System/components/EditUser.vue

<template>
	<lay-form :model="userInfo" style="max-width:96%; margin:30px 0;" ref="layFormRef">
		<lay-form-item label="用户名" prop="FUser" required>
			<lay-input v-model="userInfo.FUser"></lay-input>
		</lay-form-item>
		<lay-form-item label="密码" prop="FPassword" required>
			<lay-input v-model="userInfo.FPassword" type="password"></lay-input>
		</lay-form-item>
		<lay-form-item label="姓名" prop="FName" required>
			<lay-input v-model="userInfo.FName"></lay-input>
		</lay-form-item>
		<lay-form-item label="工厂" prop="FFactoryID" required>
			<lay-select v-model="userInfo.FFactoryID" required>
				<lay-select-option v-for="(fIdv,fIdx) in factoryLists" key="fIdx" :value="fIdv.FID+''"
					:label="fIdv.FName +' - '+ fIdv.FCode"></lay-select-option>
			</lay-select>
		</lay-form-item>
		<lay-form-item label="角色" prop="FRoleID">
			<lay-select v-model="userInfo.FRoleID" required>
				<lay-select-option v-for="(rIdv,rIdx) in roleLists" key="rIdx" :value="rIdv.FID+''" :label="rIdv.FName">
				</lay-select-option>
			</lay-select>
		</lay-form-item>
		<lay-form-item label="手机号" prop="FPhone">
			<lay-input v-model="userInfo.FPhone"></lay-input>
		</lay-form-item>
		<lay-form-item label="状态" prop="FState" required>
			<view required v-for="(sIdv,sIdx) in stateLists" key="sIdx">
				<lay-radio v-model="userInfo.FState" name="FState" :value="sIdv.FValue">{{ sIdv.FName }}</lay-radio>
			</view>
		</lay-form-item>
		<lay-form-item>
			<lay-button type="normal" @click="submitClick">{{ userInfo.FID ? "修改" : "新增" }}</lay-button>
			<lay-button @click="cancelClick">取消</lay-button>
		</lay-form-item>
	</lay-form>
</template>

<script>
	import {
		ref,
		reactive
	} from 'vue';
	import {
		updateDataInfo,
		insertDataInfo
	} from "/src/api/api/common";
	import {
		getRoleList
	} from "/src/api/api/user";

	export default {
		setup() {
			const userInfo = ref({});
			const stateLists = ref([]);
			const factoryLists = ref([]);
			const roleLists = ref([]);

			return {
				userInfo,
				stateLists,
				factoryLists,
				roleLists
			}
		},
		props: {
			userInfoObj: {
				type: Object,
				default: () => {},
			},
			stateList: {
				type: Array,
				default: () => [],
			},
			factoryList: {
				type: Array,
				default: () => [],
			}
		},
		mounted() {
			this.factoryLists = JSON.parse(JSON.stringify(this.factoryList));
			this.stateLists = JSON.parse(JSON.stringify(this.stateList));

			let userInfo = JSON.parse(JSON.stringify(this.userInfoObj));
			userInfo.FUser = userInfo.FUser || " ";
			userInfo.FPassword = userInfo.FPassword || "123456";
			userInfo.FName = userInfo.FName || " ";
			userInfo.FFactoryID = (userInfo.FFactoryID || " ") + "";
			userInfo.FState = (userInfo.FState || "1") + "";
			userInfo.FRoleID = (userInfo.FRoleID || "") + "";
			this._getRoleList();
			this.userInfo = userInfo;
			console.log(userInfo)
		},
		methods: {
			//获取角色集合
			async _getRoleList() {
				this.roleLists = await getRoleList() || [];
			},
			cancelClick() {
				this.$emit('cancelClick', false);
			},
			async submitClick() {
				this.userInfo.FUser = this.userInfo.FUser.trim();
				this.userInfo.FPassword = this.userInfo.FPassword.trim();
				this.userInfo.FName = this.userInfo.FName.trim();
				this.userInfo.FFactoryID = this.userInfo.FFactoryID.trim();
				this.userInfo.FRoleID = this.userInfo.FRoleID || -1;
				let role = this.roleLists.find(s => s.FID == this.userInfo.FRoleID);
				this.userInfo.FRoleName = role == null ? "" : role.FName;
				let result = 0;
				if (this.userInfo.FUser == "" || this.userInfo.FPassword == "" || this.userInfo.FName == "" || this
					.userInfo.FFactoryID == "" || this.userInfo.FFactoryID == "-1") {
					return false;
				}
				if (this.userInfo.FID && this.userInfo.FID > 0) {
					result = await updateDataInfo(this.userInfo, "User") || 0;
				} else {
					this.userInfo.FAddUser = -1;
					this.userInfo.FEditUser = -1;
					result = await insertDataInfo(this.userInfo, "User") || 0;
				}
				if (result > 0) {
					layer.msg("操作成功", {
						time: 1500,
						icon: 1
					});
					this.$emit('cancelClick', true);
				} else {
					layer.msg("操作失败", {
						time: 1000,
						icon: 2
					})
				}
			}
		}
	}
</script>