From e5875000e60d4976f159f287ae3773f1d11960b3 Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期五, 22 十二月 2023 17:36:56 +0800 Subject: [PATCH] 调整FYForm表单逻辑 --- src/views/fytz/user/components/CompUserInfo.vue | 256 +++++++++++++++++++++++++-------------------------- 1 files changed, 126 insertions(+), 130 deletions(-) diff --git a/src/views/fytz/user/components/CompUserInfo.vue b/src/views/fytz/user/components/CompUserInfo.vue index e8be54c..d782e78 100644 --- a/src/views/fytz/user/components/CompUserInfo.vue +++ b/src/views/fytz/user/components/CompUserInfo.vue @@ -1,11 +1,13 @@ <template> <FYForm - :form-info="_formInfo" + :form-info="formInfo" :rules="rules" - :reset="active" - v-model:is-edit="_edit" + :doClear="active" + :useCancel="create" + :useReset="!create" + @updateEdit="(v) => $emit('updateEdit', v)" @submit="submit" - @cancel="cancel" + @cancel="$emit('onCancel')" > <template #form-item="{ formObj }"> <!-- <el-form-item label="澶村儚url" prop="HeadIconUrl"> @@ -33,13 +35,12 @@ </el-col> <el-col :span="6" v-if="!create"> <el-row justify="end"> - <el-button type="danger" @click="onResetPw" :loading="pwLoading" - >閲嶇疆瀵嗙爜</el-button - > + <el-button type="danger" @click="onResetPw" :loading="pwLoading">閲嶇疆瀵嗙爜</el-button> </el-row> </el-col> </el-form-item> <FYOptionUserType + prop="_usertype" :allOption="false" :initValue="false" v-model:value="formObj._usertype" @@ -54,32 +55,25 @@ </el-form-item> --> <el-form-item label="鏄惁鍙敤" prop="isenable"> <el-switch v-model="formObj.isenable" /> - <span style="margin-left: 16px">{{ - formObj.isenable ? '鍙敤' : '涓嶅彲鐢�' - }}</span> + <span style="margin-left: 16px">{{ formObj.isenable ? '鍙敤' : '涓嶅彲鐢�' }}</span> </el-form-item> <el-form-item label="宸ュ彿" prop="workno"> <el-input clearable v-model="formObj.workno" placeholder="宸ュ彿" /> </el-form-item> <el-form-item label="鎵嬫満" prop="telephone"> - <el-input - clearable - type="tel" - v-model="formObj.telephone" - placeholder="鎵嬫満" - /> + <el-input clearable type="tel" v-model="formObj.telephone" placeholder="鎵嬫満" /> </el-form-item> - <!-- <el-form-item label="鐪�/甯�/鍖�/闀�" prop="_locations"> - <el-cascader - v-model="formObj._locations" - :options="locations" - placeholder="鐪�/甯�/鍖�/闀�" - :props="locationsProps" - style="width: 280px" - :disabled="!create" - /> - </el-form-item> --> + <FYOptionLocation + v-if="create" + prop="_locations" + :allOption="false" + :level="5" + :checkStrictly="true" + :initValue="false" + v-model:value="formObj._locations" + ></FYOptionLocation> <FYOptionScene + prop="_scenetype" :allOption="false" :type="1" :initValue="false" @@ -90,48 +84,50 @@ </template> <script setup> -import { defineProps, defineEmits, reactive, ref, watch } from 'vue'; +import { defineProps, defineEmits, reactive, ref, watch, computed } from 'vue'; import { getSceneName } from '@/enum/scene'; -import { enumLocation } from '@/enum/location'; import userApi from '@/api/fytz/userApi'; +import { useMessageBoxTip } from '@/composables/messageBox'; const props = defineProps({ //鍩烘湰淇℃伅 - formInfo: Object, - isEdit: Boolean, + model: { + type: Object, + default: () => { + return { isenable: true }; + } + }, create: { type: Boolean, - default: false, + default: false }, active: { type: Boolean, - default: false, - }, + default: false + } }); -const emit = defineEmits(['onSubmit', 'onCancel', 'update:isEdit']); - -const _formInfo = ref(); -const _edit = ref(false); -const locations = enumLocation(false); -const locationsProps = reactive({ - checkStrictly: true, +const formInfo = computed(() => { + return parseUserInfo(props.model); }); + +const emit = defineEmits(['onSubmit', 'onCancel', 'updateEdit']); + const rules = reactive({ acountname: [ { required: true, message: '璐︽埛鍚嶄笉鑳戒负绌�', - trigger: 'blur', - }, + trigger: 'blur' + } ], realname: [ { required: true, message: '鐢ㄦ埛鏄电О涓嶈兘涓虹┖', - trigger: 'blur', - }, - ], + trigger: 'blur' + } + ] // password: [ // { // required: props.create, @@ -139,111 +135,111 @@ // trigger: 'blur', // }, // ], - _usertype: [ - { - required: true, - message: '鐢ㄦ埛绫诲瀷涓嶈兘涓虹┖', - trigger: 'change', - }, - ], - _locations: [ - { - required: props.create, - message: '鐪�/甯�/鍖�/闀囦笉鑳戒负绌�', - trigger: 'change', - }, - ], - _scenetype: [ - { - required: true, - message: '鍦烘櫙绫诲瀷涓嶈兘涓虹┖', - trigger: 'change', - }, - ], }); // 鐢ㄦ埛鍩烘湰淇℃伅鏍煎紡鍖� function parseUserInfo(s) { - s._usertype = { - label: s.usertype, - value: s.usertypeid + '', - }; + if (s.usertype && s.usertypeid) { + s._usertype = { + label: s.usertype, + value: s.usertypeid + '' + }; + } - s._scenetype = getSceneName(s.extension2, 1); + if (s.extension2) { + s._scenetype = getSceneName(s.extension2, 1); + } - s._locations = []; + s._locations = {}; return s; } -function createUser(formObj, func) { - return userApi - .createUser(formObj.value) - .then(() => { - emit('onSubmit', formObj); - }) - .finally(() => { - func(); - }); -} - -function updateUser(formObj, func) { - return userApi - .updateUserInfo(formObj.value) - .then(() => { - emit('onSubmit', formObj); - }) - .finally(() => { - func(); - }); -} - -function submit(formObj, func) { +function parseUserInfoReverse(v) { // 琛屾斂鍖哄垝淇℃伅濉厖 - const a = formObj.value._locations; - if (a[0]) { - formObj.value.provincecode = a[0][0]; - formObj.value.provincename = a[0][1]; - } - if (a[1]) { - formObj.value.citycode = a[1][0]; - formObj.value.cityname = a[1][1]; - } - if (a[2]) { - formObj.value.districtcode = a[2][0]; - formObj.value.extension1 = a[2][1]; - } - if (a[3]) { - formObj.value.towncode = a[3][0]; - formObj.value.townname = a[3][1]; - } - + const a = v._locations; + v.extension1 = a.dName; // 鐢ㄦ埛绫诲瀷淇℃伅濉厖 - const b = formObj.value._usertype; - formObj.value.usertypeid = b.value; - formObj.value.usertype = b.label; + const b = v._usertype; + v.usertypeid = b.value; + v.usertype = b.label; // 鍦烘櫙绫诲瀷淇℃伅濉厖 - const c = formObj.value._scenetype; - formObj.value.extension2 = c.value; + const c = v._scenetype; + v.extension2 = c.value; - return props.create ? createUser(formObj, func) : updateUser(formObj, func); + return v; } -function cancel() { - emit('onCancel'); +function createUser(v, success, fail) { + const l = v._locations; + const params = { + userInfo: v, + baseInfo: { + biProvinceCode: l.pCode, + biProvinceName: l.pName, + biCityCode: l.cCode, + biCityName: l.cName, + biDistrictCode: l.dCode, + biDistrictName: l.dName, + biTownCode: l.tCode, + biTownName: l.tName, + biAreaCode: l.aCode, + biArea: l.aName + // biManagementCompanyId: + // biManagementCompany: + // biContact + // biTelephone + // biAddress + } + }; + return userApi + .createUser(params) + .then(() => { + emit('onSubmit', params); + success(); + }) + .catch((err) => { + fail(err); + }); } -watch( - () => props.formInfo, - (nValue) => { - _formInfo.value = parseUserInfo(nValue); - } -); +function updateUser(v, success, fail) { + return userApi + .updateUserInfo(v) + .then(() => { + emit('onSubmit', v); + if (success) success(); + }) + .catch((err) => { + if (fail) fail(err); + }); +} -watch(_edit, (nValue) => { - emit('update:isEdit', nValue); -}); +function submit(v, success, fail) { + parseUserInfoReverse(v.value); + return props.create ? createUser(v.value, success, fail) : updateUser(v.value, success, fail); + // parseUserInfoReverse(props.formInfo); + + // return props.create + // ? createUser(props.formInfo, success, fail) + // : updateUser(props.formInfo, success, fail); +} + +// 閲嶇疆瀵嗙爜 const pwLoading = ref(false); + +function onResetPw() { + useMessageBoxTip({ + confirmMsg: '鏄惁閲嶇疆璇ュ満鏅瘑鐮侊紵', + confirmTitle: '閲嶇疆瀵嗙爜', + onConfirm: async () => { + pwLoading.value = true; + return userApi.resetPassword(formInfo.value.guid).finally(() => { + pwLoading.value = false; + }); + } + }); +} </script> -- Gitblit v1.9.3