hcong
2024-11-12 8f3255956f85af1df98170fb05e6551cea12e9b0
src/views/fysp/scene/CompSceneConstructionInfo.vue
@@ -1,325 +1,334 @@
<!-- 工地专属信息编辑 -->
<template>
  <el-form
    v-show="showStyle == 'form'"
    :inline="false"
    :model="formObj"
    ref="formRef"
    :rules="rules"
    label-position="right"
    label-width="150px"
  <BaseSceneInfo
    ref="baseSceneInfo"
    :scene="scene"
    :formInfo="formInfo"
    :scene-type="sceneType"
  >
    <el-form-item label="工程类型" prop="csProjectType">
      <el-input
        clearable
        v-model="formObj.csProjectType"
        placeholder="工程类型"
      />
    </el-form-item>
    <el-form-item label="建设状态" prop="csStatus">
      <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-form-item>
    <el-form-item label="施工阶段" prop="siExtension1">
      <el-select v-model="formObj.siExtension1" placeholder="施工阶段">
        <el-option
          v-for="s in stage"
          :key="s.value"
          :label="s.label"
          :value="s.value"
        />
      </el-select>
    </el-form-item>
    <el-form-item label="施工时间" prop="_timeRange">
      <el-date-picker
        v-model="formObj._timeRange"
        type="daterange"
        range-separator="至"
        start-placeholder="开工时间"
        end-placeholder="完工时间"
      />
    </el-form-item>
    <el-form-item label="剩余工期" prop="csLeftTime">
      <el-input
        clearable
        v-model="formObj.csLeftTime"
        placeholder="剩余工期,例如几年、几月、几周、几天等"
      />
    </el-form-item>
    <el-form-item label="占地面积" prop="csFloorSpace">
      <el-input clearable v-model="formObj.csFloorSpace" placeholder="占地面积">
        <template #append>㎡</template>
      </el-input>
    </el-form-item>
    <el-form-item label="施工面积" prop="csConstructionArea">
      <el-input
        clearable
        v-model="formObj.csConstructionArea"
        placeholder="施工面积"
    <template #form-items>
      <el-form
        v-show="showStyle == 'form'"
        :inline="false"
        :model="formObj"
        ref="formRef"
        :rules="rules"
        label-position="right"
        label-width="150px"
      >
        <template #append>㎡</template>
      </el-input>
    </el-form-item>
    <el-form-item label="每月施工面积" prop="csConstructionAreaPerMonth">
      <el-input
        clearable
        v-model="formObj.csConstructionAreaPerMonth"
        placeholder="每月施工面积"
      >
        <template #append>㎡</template>
      </el-input>
    </el-form-item>
    <el-form-item label="业主单位" prop="csEmployerUnit">
      <el-input
        clearable
        v-model="formObj.csEmployerUnit"
        placeholder="业主单位"
      />
    </el-form-item>
    <el-form-item label="业主单位联系人" prop="csEmployerContacts">
      <el-input
        clearable
        v-model="formObj.csEmployerContacts"
        placeholder="业主单位联系人"
      />
    </el-form-item>
    <el-form-item
      label="业主单位联系电话"
      prop="csEmployerContactsTel"
      class="input-with-select"
    >
      <el-input
        clearable
        type="tel"
        v-model="formObj.csEmployerContactsTel"
        placeholder="业主单位联系电话"
      >
        <template #prepend>
          <el-icon><Iphone /></el-icon>
        </template>
      </el-input>
    </el-form-item>
    <el-form-item label="施工单位" prop="csConstructionUnit">
      <el-input
        clearable
        v-model="formObj.csConstructionUnit"
        placeholder="施工单位"
      />
    </el-form-item>
    <el-form-item label="施工单位联系人" prop="csConstructionContacts">
      <el-input
        clearable
        v-model="formObj.csConstructionContacts"
        placeholder="施工单位联系人"
      />
    </el-form-item>
    <el-form-item label="施工单位联系电话" prop="csConstructionContactsTel">
      <el-input
        clearable
        type="tel"
        v-model="formObj.csConstructionContactsTel"
        placeholder="施工单位联系电话"
      >
        <template #prepend>
          <el-icon><Iphone /></el-icon>
        </template>
      </el-input>
    </el-form-item>
    <el-form-item label="安全员" prop="csSecurityOfficer">
      <el-input
        clearable
        v-model="formObj.csSecurityOfficer"
        placeholder="安全员"
      />
    </el-form-item>
    <el-form-item label="安全员电话" prop="csSecurityOfficerTel">
      <el-input
        clearable
        type="tel"
        v-model="formObj.csSecurityOfficerTel"
        placeholder="安全员电话"
      >
        <template #prepend>
          <el-icon><Iphone /></el-icon>
        </template>
      </el-input>
    </el-form-item>
        <el-form-item label="工程类型" prop="csProjectType">
          <el-input
            clearable
            v-model="formObj.csProjectType"
            placeholder="工程类型"
          />
        </el-form-item>
        <el-form-item label="建设状态" prop="csStatus">
          <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-form-item>
        <el-form-item label="施工阶段" prop="siExtension1">
          <el-select v-model="formObj.siExtension1" placeholder="施工阶段">
            <el-option
              v-for="s in stage"
              :key="s.value"
              :label="s.label"
              :value="s.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="施工时间" prop="_timeRange">
          <el-date-picker
            v-model="formObj._timeRange"
            type="daterange"
            range-separator="至"
            start-placeholder="开工时间"
            end-placeholder="完工时间"
          />
        </el-form-item>
        <el-form-item label="剩余工期" prop="csLeftTime">
          <el-input
            clearable
            v-model="formObj.csLeftTime"
            placeholder="剩余工期,例如几年、几月、几周、几天等"
          />
        </el-form-item>
        <el-form-item label="占地面积" prop="csFloorSpace">
          <el-input
            clearable
            v-model="formObj.csFloorSpace"
            placeholder="占地面积"
          >
            <template #append>㎡</template>
          </el-input>
        </el-form-item>
        <el-form-item label="施工面积" prop="csConstructionArea">
          <el-input
            clearable
            v-model="formObj.csConstructionArea"
            placeholder="施工面积"
          >
            <template #append>㎡</template>
          </el-input>
        </el-form-item>
        <el-form-item label="每月施工面积" prop="csConstructionAreaPerMonth">
          <el-input
            clearable
            v-model="formObj.csConstructionAreaPerMonth"
            placeholder="每月施工面积"
          >
            <template #append>㎡</template>
          </el-input>
        </el-form-item>
        <el-form-item label="业主单位" prop="csEmployerUnit">
          <el-input
            clearable
            v-model="formObj.csEmployerUnit"
            placeholder="业主单位"
          />
        </el-form-item>
        <el-form-item label="业主单位联系人" prop="csEmployerContacts">
          <el-input
            clearable
            v-model="formObj.csEmployerContacts"
            placeholder="业主单位联系人"
          />
        </el-form-item>
        <el-form-item
          label="业主单位联系电话"
          prop="csEmployerContactsTel"
          class="input-with-select"
        >
          <el-input
            clearable
            type="tel"
            v-model="formObj.csEmployerContactsTel"
            placeholder="业主单位联系电话"
          >
            <template #prepend>
              <el-icon><Iphone /></el-icon>
            </template>
          </el-input>
        </el-form-item>
        <el-form-item label="施工单位" prop="csConstructionUnit">
          <el-input
            clearable
            v-model="formObj.csConstructionUnit"
            placeholder="施工单位"
          />
        </el-form-item>
        <el-form-item label="施工单位联系人" prop="csConstructionContacts">
          <el-input
            clearable
            v-model="formObj.csConstructionContacts"
            placeholder="施工单位联系人"
          />
        </el-form-item>
        <el-form-item label="施工单位联系电话" prop="csConstructionContactsTel">
          <el-input
            clearable
            type="tel"
            v-model="formObj.csConstructionContactsTel"
            placeholder="施工单位联系电话"
          >
            <template #prepend>
              <el-icon><Iphone /></el-icon>
            </template>
          </el-input>
        </el-form-item>
        <el-form-item label="安全员" prop="csSecurityOfficer">
          <el-input
            clearable
            v-model="formObj.csSecurityOfficer"
            placeholder="安全员"
          />
        </el-form-item>
        <el-form-item label="安全员电话" prop="csSecurityOfficerTel">
          <el-input
            clearable
            type="tel"
            v-model="formObj.csSecurityOfficerTel"
            placeholder="安全员电话"
          >
            <template #prepend>
              <el-icon><Iphone /></el-icon>
            </template>
          </el-input>
        </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-descriptions
    v-show="showStyle == 'descriptions'"
    :column="2"
    :size="fontSize"
    direction="horizontal"
    border
  >
    <template #title>
      <el-text tag="h1">{{ title }}</el-text>
        <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>
    </template>
    <template #extra>
      <el-button
        :disabled="!edit && !ignoreEdit"
    <template #description-items>
      <el-descriptions
        v-show="showStyle == 'descriptions'"
        :column="2"
        :size="fontSize"
        type="primary"
        @click="onSubmit"
        :loading="loading"
        >提交</el-button
        direction="horizontal"
        border
      >
      <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="施工单位联系人"
        <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"
@@ -336,14 +345,14 @@
          <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-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"
@@ -360,15 +369,16 @@
          <el-icon><Iphone /></el-icon>
        </template> </el-input
    ></el-descriptions-item> -->
  </el-descriptions>
      </el-descriptions>
    </template>
  </BaseSceneInfo>
</template>
<script setup>
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';
import BaseSceneInfo from './BaseSceneInfo.vue';
const props = defineProps({
  scene: Object,
@@ -433,37 +443,9 @@
  ]
});
// 创建或更新场景详情
function createOrupdateSubScene() {
  loading.value = true;
  if (formObj.value._timeRange && formObj.value._timeRange.length == 2) {
    const t = formObj.value._timeRange;
    formObj.value.csStartTime = useDateFormat(t[0], 'YYYY-MM-DD');
    formObj.value.csEndTime = useDateFormat(t[1], 'YYYY-MM-DD');
  }
  return sceneApi
    .updateSubScene(props.sceneType, formObj.value)
    .then((res) => {
      emit('onSubmit', formObj);
      emit('update:formInfo', formObj);
      return res.data;
    })
    .finally(() => {
      loading.value = false;
    });
}
// 更新场景
function updateScene() {
  return sceneApi.updateScene(sceneObj.value).then(() => {
    emit('update:scene', sceneObj);
  });
}
const baseSceneInfo = ref(null);
function submit() {
  updateScene();
  return createOrupdateSubScene();
  return baseSceneInfo.value.submit();
}
function cancel() {