| | |
| | | <!-- 工地专属信息编辑 --> |
| | | <template> |
| | | <el-form |
| | | v-show="showStyle == 'form'" |
| | | :inline="false" |
| | | :model="formObj" |
| | | ref="formRef" |
| | |
| | | <el-button :disabled="!edit" @click="onReset">重置</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | <el-descriptions |
| | | v-show="showStyle == 'descriptions'" |
| | | :column="2" |
| | | :size="fontSize" |
| | | direction="horizontal" |
| | | border |
| | | > |
| | | <template #title> |
| | | <el-text tag="h1">{{ title }}</el-text> |
| | | </template> |
| | | <template #extra> |
| | | <el-button |
| | | :disabled="!edit && !ignoreEdit" |
| | | :size="fontSize" |
| | | type="primary" |
| | | @click="onSubmit" |
| | | :loading="loading" |
| | | >提交</el-button |
| | | > |
| | | <el-button |
| | | :size="fontSize" |
| | | :disabled="!edit && !ignoreEdit" |
| | | @click="onReset" |
| | | >重置</el-button |
| | | > |
| | | </template> |
| | | <el-descriptions-item label="工程类型" |
| | | ><el-input |
| | | :size="fontSize" |
| | | clearable |
| | | v-model="formObj.csProjectType" |
| | | placeholder="工程类型" |
| | | /></el-descriptions-item> |
| | | <!-- <el-descriptions-item label="建设状态" |
| | | ><el-select |
| | | v-model="formObj.csStatus" |
| | | placeholder="建设状态" |
| | | > |
| | | <el-option |
| | | v-for="s in status" |
| | | :key="s.value" |
| | | :label="s.label" |
| | | :value="s.value" |
| | | /> </el-select |
| | | ></el-descriptions-item> --> |
| | | <el-descriptions-item label="施工阶段" |
| | | ><el-select |
| | | v-model="formObj.siExtension1" |
| | | placeholder="施工阶段" |
| | | :size="fontSize" |
| | | > |
| | | <el-option |
| | | v-for="s in stage" |
| | | :key="s.value" |
| | | :label="s.label" |
| | | :value="s.value" |
| | | /> </el-select |
| | | ></el-descriptions-item> |
| | | <el-descriptions-item label="施工时间" |
| | | ><el-date-picker |
| | | :size="fontSize" |
| | | v-model="formObj._timeRange" |
| | | type="daterange" |
| | | range-separator="至" |
| | | start-placeholder="开工时间" |
| | | end-placeholder="完工时间" |
| | | /></el-descriptions-item> |
| | | <el-descriptions-item label="剩余工期" |
| | | ><el-input |
| | | :size="fontSize" |
| | | clearable |
| | | v-model="formObj.csLeftTime" |
| | | placeholder="剩余工期,例如几年、几月、几周、几天等" |
| | | /></el-descriptions-item> |
| | | <el-descriptions-item label="施工地址" span="2" |
| | | ><el-input |
| | | clearable |
| | | v-model="sceneObj.location" |
| | | placeholder="施工地址" |
| | | :size="fontSize" |
| | | /></el-descriptions-item> |
| | | <el-descriptions-item label="占地面积" rowspan="2" |
| | | ><el-input |
| | | :size="fontSize" |
| | | clearable |
| | | v-model="formObj.csFloorSpace" |
| | | placeholder="占地面积" |
| | | > |
| | | <template #append>㎡</template> |
| | | </el-input></el-descriptions-item |
| | | > |
| | | <el-descriptions-item label="施工面积" |
| | | ><el-input |
| | | :size="fontSize" |
| | | clearable |
| | | v-model="formObj.csConstructionArea" |
| | | placeholder="施工面积" |
| | | > |
| | | <template #append>㎡</template> |
| | | </el-input></el-descriptions-item |
| | | > |
| | | <el-descriptions-item label="每月施工面积" |
| | | ><el-input |
| | | :size="fontSize" |
| | | clearable |
| | | v-model="formObj.csConstructionAreaPerMonth" |
| | | placeholder="每月施工面积" |
| | | > |
| | | <template #append>㎡</template> |
| | | </el-input></el-descriptions-item |
| | | > |
| | | <el-descriptions-item label="项目负责人" |
| | | ><el-input |
| | | :size="fontSize" |
| | | clearable |
| | | v-model="sceneObj.contacts" |
| | | placeholder="项目负责人" |
| | | /></el-descriptions-item> |
| | | <el-descriptions-item label="项目负责人电话" |
| | | ><el-input |
| | | :size="fontSize" |
| | | clearable |
| | | type="tel" |
| | | v-model="sceneObj.contactst" |
| | | placeholder="项目负责人电话" |
| | | > |
| | | <template #prepend> |
| | | <el-icon><Iphone /></el-icon> |
| | | </template> </el-input |
| | | ></el-descriptions-item> |
| | | <el-descriptions-item label="安全员" |
| | | ><el-input |
| | | :size="fontSize" |
| | | clearable |
| | | v-model="formObj.csSecurityOfficer" |
| | | placeholder="安全员" |
| | | /></el-descriptions-item> |
| | | <el-descriptions-item label="安全员电话" |
| | | ><el-input |
| | | :size="fontSize" |
| | | clearable |
| | | type="tel" |
| | | v-model="formObj.csSecurityOfficerTel" |
| | | placeholder="安全员电话" |
| | | > |
| | | <template #prepend> |
| | | <el-icon><Iphone /></el-icon> |
| | | </template> </el-input |
| | | ></el-descriptions-item> |
| | | <el-descriptions-item label="总包单位" |
| | | ><el-input |
| | | :size="fontSize" |
| | | clearable |
| | | v-model="formObj.csConstructionUnit" |
| | | placeholder="总包单位" |
| | | /></el-descriptions-item> |
| | | <!-- <el-descriptions-item label="施工单位联系人" |
| | | ><el-input |
| | | clearable |
| | | v-model="formObj.csConstructionContacts" |
| | | placeholder="施工单位联系人" |
| | | /></el-descriptions-item> |
| | | <el-descriptions-item label="施工单位联系电话" |
| | | ><el-input |
| | | clearable |
| | | type="tel" |
| | | v-model="formObj.csConstructionContactsTel" |
| | | placeholder="施工单位联系电话" |
| | | > |
| | | <template #prepend> |
| | | <el-icon><Iphone /></el-icon> |
| | | </template> </el-input |
| | | ></el-descriptions-item> --> |
| | | <el-descriptions-item label="建设单位" |
| | | ><el-input |
| | | :size="fontSize" |
| | | clearable |
| | | v-model="formObj.csEmployerUnit" |
| | | placeholder="建设单位" |
| | | /></el-descriptions-item> |
| | | <!-- <el-descriptions-item label="业主单位联系人" |
| | | ><el-input |
| | | clearable |
| | | v-model="formObj.csEmployerContacts" |
| | | placeholder="业主单位联系人" |
| | | /></el-descriptions-item> |
| | | <el-descriptions-item label="业主单位联系电话" |
| | | ><el-input |
| | | clearable |
| | | type="tel" |
| | | v-model="formObj.csEmployerContactsTel" |
| | | placeholder="业主单位联系电话" |
| | | > |
| | | <template #prepend> |
| | | <el-icon><Iphone /></el-icon> |
| | | </template> </el-input |
| | | ></el-descriptions-item> --> |
| | | </el-descriptions> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { defineProps, defineEmits, reactive, ref, watch } from 'vue'; |
| | | import { reactive, ref, watch, computed } from 'vue'; |
| | | import { useDateFormat } from '@vueuse/core'; |
| | | import { enumStatusNA, enumStageNA } from '@/enum/construction'; |
| | | import sceneApi from '@/api/fysp/sceneApi'; |
| | | import { useFormConfirm } from '@/composables/formConfirm'; |
| | | |
| | | const props = defineProps({ |
| | | scene: Object, |
| | | //工地额外信息 |
| | | formInfo: Object, |
| | | //场景类型:工地 |
| | | sceneType: { |
| | | type: Number, |
| | | default: 1, |
| | | default: 1 |
| | | }, |
| | | // 展示样式 form:表单;descriptions:描述列表 |
| | | showStyle: { |
| | | type: String, |
| | | default: 'descriptions' |
| | | // default:'form' |
| | | }, |
| | | title: String |
| | | }); |
| | | const emit = defineEmits(['onSubmit', 'onCancel']); |
| | | const fontSize = ref('small'); |
| | | const emit = defineEmits([ |
| | | 'onSubmit', |
| | | 'onCancel', |
| | | 'update:scene', |
| | | 'update:formInfo' |
| | | ]); |
| | | |
| | | const sceneObj = ref({}); |
| | | const { formObj, formRef, edit, onSubmit, onReset } = useFormConfirm({ |
| | | submit: { |
| | | do: submit, |
| | | do: submit |
| | | }, |
| | | cancel: { |
| | | do: cancel, |
| | | }, |
| | | do: cancel |
| | | } |
| | | }); |
| | | const ignoreEdit = computed(() => props.showStyle == 'descriptions'); |
| | | |
| | | const loading = ref(false); |
| | | const status = reactive(enumStatusNA()); |
| | | const stage = reactive(enumStageNA()); |
| | |
| | | { |
| | | required: true, |
| | | message: '工程类型不能为空', |
| | | trigger: 'blur', |
| | | }, |
| | | trigger: 'blur' |
| | | } |
| | | ], |
| | | csStatus: [ |
| | | { |
| | | required: true, |
| | | message: '建设状态不能为空', |
| | | trigger: 'change', |
| | | }, |
| | | trigger: 'change' |
| | | } |
| | | ], |
| | | siExtension1: [ |
| | | { |
| | | required: true, |
| | | message: '施工阶段不能为空', |
| | | trigger: 'change', |
| | | }, |
| | | ], |
| | | trigger: 'change' |
| | | } |
| | | ] |
| | | }); |
| | | |
| | | // 创建或更新场景详情 |
| | | function createOrupdateScene() { |
| | | function createOrupdateSubScene() { |
| | | loading.value = true; |
| | | |
| | | if (formObj.value._timeRange && formObj.value._timeRange.length == 2) { |
| | |
| | | return sceneApi |
| | | .updateSubScene(props.sceneType, formObj.value) |
| | | .then((res) => { |
| | | emit('onSubmit', formObj); |
| | | emit('update:formInfo', formObj); |
| | | return res.data; |
| | | }) |
| | | .finally(() => { |
| | |
| | | }); |
| | | } |
| | | |
| | | function submit() { |
| | | emit('onSubmit', formObj); |
| | | // 更新场景 |
| | | function updateScene() { |
| | | return sceneApi.updateScene(sceneObj.value).then(() => { |
| | | emit('update:scene', sceneObj); |
| | | }); |
| | | } |
| | | |
| | | return createOrupdateScene(); |
| | | function submit() { |
| | | updateScene(); |
| | | return createOrupdateSubScene(); |
| | | } |
| | | |
| | | function cancel() { |
| | |
| | | formObj.value = nValue; |
| | | formObj.value._timeRange = [ |
| | | new Date(formObj.value.csStartTime), |
| | | new Date(formObj.value.csEndTime), |
| | | new Date(formObj.value.csEndTime) |
| | | ]; |
| | | } |
| | | } |
| | | }, |
| | | { deep: false, immediate: true } |
| | | ); |
| | | |
| | | watch( |
| | | () => props.scene, |
| | | (nValue) => { |
| | | if (nValue) { |
| | | sceneObj.value = nValue; |
| | | } |
| | | }, |
| | | { deep: false, immediate: true } |
| | | ); |
| | | </script> |
| | | |