From 9ea879eea03ee21c8786da2e0df681362a4199e6 Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期二, 19 十二月 2023 09:16:39 +0800 Subject: [PATCH] 修复CompUserInfo组件两个分支不一致问题 --- src/views/baseinfo/fysp/scene/CompSceneBaseInfo.vue | 308 ++++++++++++++++++++++----------------------------- 1 files changed, 133 insertions(+), 175 deletions(-) diff --git a/src/views/baseinfo/fysp/scene/CompSceneBaseInfo.vue b/src/views/baseinfo/fysp/scene/CompSceneBaseInfo.vue index 7e44c39..e3bea1f 100644 --- a/src/views/baseinfo/fysp/scene/CompSceneBaseInfo.vue +++ b/src/views/baseinfo/fysp/scene/CompSceneBaseInfo.vue @@ -1,265 +1,223 @@ <!-- 鍦烘櫙鍩烘湰淇℃伅缂栬緫 --> <template> - <el-form - :inline="false" - :model="formObj" - ref="formRef" + <FYForm + :form-info="_formInfo" :rules="rules" - label-position="right" - label-width="150px" + :useReset="true" + @submit="submit" + @cancel="cancel" > - <el-form-item label="鍦烘櫙鍚嶇О" prop="name"> - <el-input - clearable - show-word-limit - v-model="formObj.name" - placeholder="鍦烘櫙鍚嶇О" - /> - </el-form-item> - <el-form-item label="鍦烘櫙绫诲瀷" prop="_typeObj"> - <el-select v-model="formObj._typeObj" placeholder="鍦烘櫙绫诲瀷"> - <el-option - v-for="s in sceneTypes" - :key="s.value" - :label="s.label" - :value="s" + <template #form-item="{ formObj }"> + <el-form-item label="鍦烘櫙鍚嶇О" prop="name"> + <el-input clearable show-word-limit v-model="formObj.name" placeholder="鍦烘櫙鍚嶇О" /> + </el-form-item> + <el-form-item label="鍦烘櫙绫诲瀷" prop="_typeObj"> + <el-select v-model="formObj._typeObj" placeholder="鍦烘櫙绫诲瀷"> + <el-option v-for="s in sceneTypes" :key="s.value" :label="s.label" :value="s" /> + </el-select> + </el-form-item> + <el-form-item label="鐪�/甯�/鍖�/闀�" prop="_locations"> + <el-cascader + v-model="formObj._locations" + :options="locations" + placeholder="鐪�/甯�/鍖�/闀�" + style="width: 300px" + :props="cascaderProps" /> - </el-select> - </el-form-item> - <el-form-item label="鐪�/甯�/鍖�/闀�" prop="_locations"> - <el-cascader - v-model="formObj._locations" - :options="locations" - placeholder="鐪�/甯�/鍖�/闀�" - style="width: 300px" - :props="cascaderProps" - /> - </el-form-item> - <el-form-item label="鍦板潃" prop="location"> - <el-input - show-word-limit - clearable - v-model="formObj.location" - placeholder="鍦板潃" - /> - </el-form-item> - <el-form-item label="缁忓害" prop="longitude"> - <!-- <el-input type="number" v-model="formObj.longitude" placeholder="缁忓害" /> --> - <el-input-number - v-model="formObj.longitude" - :precision="6" - :step="0.1" - controls-position="right" - /> - </el-form-item> - <el-form-item label="绾害" prop="latitude"> - <!-- <el-input type="number" v-model="formObj.latitude" placeholder="绾害" /> --> - <el-input-number - v-model="formObj.latitude" - :precision="6" - :step="0.1" - controls-position="right" - /> - </el-form-item> - <el-form-item label="鑱旂郴浜�" prop="contacts"> - <el-input - show-word-limit - clearable - v-model="formObj.contacts" - placeholder="鑱旂郴浜�" - /> - </el-form-item> - <el-form-item label="鑱旂郴鐢佃瘽" prop="contactst"> - <el-input type="tel" v-model="formObj.contactst" placeholder="鑱旂郴鐢佃瘽"> - <template #prepend> - <el-icon> - <Iphone /> - </el-icon> - </template> - </el-input> - </el-form-item> - <el-form-item label="鐘舵��" prop="online"> - <el-switch v-model="formObj.online" /> - <span style="margin-left: 16px">{{ - formObj.online ? '鍦ㄧ嚎' : '涓嬬嚎' - }}</span> - </el-form-item> - <el-form-item label="缂栧彿" prop="index"> - <el-input-number readonly v-model="formObj.index" :step="1" :min="0" /> - </el-form-item> - - <el-form-item> - <el-button - :disabled="!edit" - type="primary" - @click="onSubmit" - :loading="loading" - >鎻愪氦</el-button - > - <el-button :disabled="!edit" @click="onReset">閲嶇疆</el-button> - </el-form-item> - </el-form> + </el-form-item> + <el-form-item label="鍦板潃" prop="location"> + <el-input show-word-limit clearable v-model="formObj.location" placeholder="鍦板潃" /> + </el-form-item> + <el-form-item label="缁忓害" prop="longitude"> + <!-- <el-input type="number" v-model="formObj.longitude" placeholder="缁忓害" /> --> + <el-input-number + v-model="formObj.longitude" + :precision="6" + :step="0.1" + controls-position="right" + /> + </el-form-item> + <el-form-item label="绾害" prop="latitude"> + <!-- <el-input type="number" v-model="formObj.latitude" placeholder="绾害" /> --> + <el-input-number + v-model="formObj.latitude" + :precision="6" + :step="0.1" + controls-position="right" + /> + </el-form-item> + <el-form-item label="鑱旂郴浜�" prop="contacts"> + <el-input show-word-limit clearable v-model="formObj.contacts" placeholder="鑱旂郴浜�" /> + </el-form-item> + <el-form-item label="鑱旂郴鐢佃瘽" prop="contactst"> + <el-input type="tel" v-model="formObj.contactst" placeholder="鑱旂郴鐢佃瘽"> + <template #prepend> + <el-icon> + <Iphone /> + </el-icon> + </template> + </el-input> + </el-form-item> + <el-form-item label="鐘舵��" prop="online"> + <el-switch v-model="formObj.online" /> + <span style="margin-left: 16px">{{ formObj.online ? '鍦ㄧ嚎' : '涓嬬嚎' }}</span> + </el-form-item> + <el-form-item label="缂栧彿" prop="index"> + <el-input-number readonly v-model="formObj.index" :step="1" :min="0" /> + </el-form-item> + </template> + </FYForm> </template> <script setup> -import { defineProps, defineEmits, reactive, ref, watch } from 'vue'; -import { enumScene_2NA } from '@/enum/scene'; -import { enumLocationNA } from '@/enum/location'; -import sceneApi from '@/api/fysp/sceneApi'; -import { useFormConfirm } from '@/composables/formConfirm'; +import { defineProps, defineEmits, reactive, ref, watch } from 'vue' +import { enumScene } from '@/enum/scene' +import { enumLocation } from '@/enum/location' +import sceneApi from '@/api/fysp/sceneApi' const props = defineProps({ //鍦烘櫙鍩烘湰淇℃伅 formInfo: Object, //鏄垱寤烘垨鑰呮洿鏂板満鏅� - create: Boolean, -}); + create: Boolean +}) -const emit = defineEmits(['onSubmit', 'onCancel']); +const emit = defineEmits(['onSubmit', 'onCancel']) -const { formObj, formRef, edit, onSubmit, onReset } = useFormConfirm({ - submit: { - do: submit, - }, - cancel: { - do: cancel, - }, -}); -const loading = ref(false); -const sceneTypes = reactive(enumScene_2NA()); -const locations = reactive(enumLocationNA()); +const _formInfo = ref({}); +const sceneTypes = reactive(enumScene(2, false)); +const locations = reactive(enumLocation(false)); const cascaderProps = reactive({ - checkStrictly: true, -}); + checkStrictly: true +}) const rules = reactive({ name: [ { required: true, message: '鍦烘櫙鍚嶇О涓嶈兘涓虹┖', - trigger: 'blur', - }, + trigger: 'blur' + } ], _typeObj: [ { required: true, message: '鍦烘櫙绫诲瀷涓嶈兘涓虹┖', - trigger: 'change', - }, + trigger: 'change' + } ], _locations: [ { required: true, message: '琛屾斂鍖哄垝涓嶈兘涓虹┖', - trigger: 'change', - }, + trigger: 'change' + } ], longitude: [ { required: true, message: '缁忓害涓嶈兘涓虹┖', - trigger: 'blur', - }, + trigger: 'blur' + } ], latitude: [ { required: true, message: '绾害涓嶈兘涓虹┖', - trigger: 'blur', - }, - ], -}); + trigger: 'blur' + } + ] +}) -// 鍦烘櫙鍩烘湰淇℃伅鏍煎紡鍖� +/** + * 鍦烘櫙鍩烘湰淇℃伅鏍煎紡鍖� + * 瀵瑰満鏅被鍨嬨�佸満鏅鏀垮尯鍒掑拰鍦烘櫙鍙敤鐘舵�佽繘琛屾牸寮忓寲 + * @param {*} s 鍦烘櫙淇℃伅 + */ function parseSceneBaseInfo(s) { s._typeObj = { label: s.type, - value: s.typeid + '', - }; + value: s.typeid + '' + } - s._locations = []; + s._locations = [] if (s.provincecode && s.provincecode.length > 0) - s._locations.push([s.provincecode, s.provincename]); - if (s.citycode && s.citycode.length > 0) - s._locations.push([s.citycode, s.cityname]); + s._locations.push([s.provincecode, s.provincename]) + if (s.citycode && s.citycode.length > 0) s._locations.push([s.citycode, s.cityname]) if (s.districtcode && s.districtcode.length > 0) - s._locations.push([s.districtcode, s.districtname]); - if (s.towncode && s.towncode.length > 0) - s._locations.push([s.towncode, s.townname]); + s._locations.push([s.districtcode, s.districtname]) + if (s.towncode && s.towncode.length > 0) s._locations.push([s.towncode, s.townname]) - s.online = s.extension1 != '0'; + s.online = s.extension1 != '0' - return s; + return s } // 鍒涘缓鏂板満鏅� -function createScene() { - loading.value = true; +function createScene(formObj, func) { return sceneApi .createScene(formObj.value) - .then((res) => { - console.log(res); + .then(() => { + emit('onSubmit', formObj) }) .finally(() => { - loading.value = false; - }); + func() + }) } // 鏇存柊鍦烘櫙 -function updateScene() { - loading.value = true; +function updateScene(formObj, func) { return sceneApi .updateScene(formObj.value) - .then((res) => { - console.log(res); + .then(() => { + emit('onSubmit', formObj) }) .finally(() => { - loading.value = false; - }); + func() + }) } -function submit() { +function submit(formObj, func) { // 琛屾斂鍖哄垝淇℃伅濉厖 - const a = formObj.value._locations; + const a = formObj.value._locations if (a[0]) { - formObj.value.provincecode = a[0][0]; - formObj.value.provincename = a[0][1]; + 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]; + formObj.value.citycode = a[1][0] + formObj.value.cityname = a[1][1] } if (a[2]) { - formObj.value.districtcode = a[2][0]; - formObj.value.districtname = a[2][1]; + formObj.value.districtcode = a[2][0] + formObj.value.districtname = a[2][1] } if (a[3]) { - formObj.value.towncode = a[3][0]; - formObj.value.townname = a[3][1]; + formObj.value.towncode = a[3][0] + formObj.value.townname = a[3][1] } // 鍦烘櫙绫诲瀷淇℃伅濉厖 - const b = formObj.value._typeObj; - formObj.value.typeid = b.value; - formObj.value.type = b.label; + const b = formObj.value._typeObj + formObj.value.typeid = b.value + formObj.value.type = b.label // 鏄惁鍦ㄧ嚎淇℃伅濉厖 - formObj.value.online - ? (formObj.value.extension1 = '1') - : (formObj.value.extension1 = '0'); + formObj.value.online ? (formObj.value.extension1 = '1') : (formObj.value.extension1 = '0') - formObj.value.updatedate = new Date().toISOString(); + formObj.value.updatedate = new Date().toISOString() - emit('onSubmit', formObj); + emit('onSubmit', formObj) - return props.create ? createScene() : updateScene(); + return props.create ? createScene(formObj, func) : updateScene(formObj, func) } function cancel() { - emit('onCancel'); + emit('onCancel') } +// 鐩戝惉浼犲叆鐨勫満鏅熀鏈俊鎭紝鍋氱浉搴旂殑鏁版嵁鏍煎紡鍖� watch( () => props.formInfo, (nValue) => { - formObj.value = parseSceneBaseInfo(nValue); + _formInfo.value = parseSceneBaseInfo(nValue) } -); +) </script> <style scoped></style> -- Gitblit v1.9.3