update: 補上成交需填寫的保護身分證字號欄位

Tomas

2022-01-17 8330d39b4274453e569fcbd673902b0c5f64df53

 PAMapp/pages/appointment/_appointmentId/close/index.vue

@@ -15,6 +15,18 @@
        <el-row
          type="flex"
          class="pam-paragraph">
          <UiField label="保戶身分證字號" :labelSize="20">
            <input
              class="appointment-client-detail-close__input"
              v-model="appointmentCloseInfo.policyholderIdentityId"
              placeholder="請輸入"
              type="text">
          </UiField>
        </el-row>

        <el-row
          type="flex"
          class="pam-paragraph">
          <UiField label="商品代碼Plan Code" :labelSize="20">
            <input
              class="appointment-client-detail-close__input"
@@ -44,17 +56,18 @@
          </UiField>
              <select
                class="appointment-client-detail-close__select"
                name="failReason" id="failReason" v-model="appointmentCloseInfo.failReason">
                name="closedReason" id="closedReason" v-model="appointmentCloseInfo.closedReason">
                <option :value="failReason.value" v-for="(failReason, index) in appointmentFailReason" :key="index">
                  {{ failReason.key }}
                </option>
              </select>

              <div style="display: flex" class="mt-10">

                <input
                  v-if="appointmentCloseInfo.failReason === 'other'"
                  v-if="appointmentCloseInfo.closedReason === 'other'"
                  class="appointment-client-detail-close__input"
                  v-model="appointmentCloseInfo.otherFailReason"
                  v-model="appointmentCloseInfo.closedOtherReason"
                  placeholder="請輸入原因，限50字。"
                  type="text">
              </div>
@@ -65,7 +78,15 @@
        type="flex"
        class="pam-paragraph">
        <UiField label="備註" :labelSize="20">
          <textarea
          <el-input
            type="textarea"
            :rows="3"
            placeholder="請輸入"
            v-model="appointmentCloseInfo.remark"
            resize="none">
          </el-input>

          <!-- <textarea
            v-model="appointmentCloseInfo.archivedDate"
            class="appointment-close__remark"
            placeholder="請輸入"
@@ -73,7 +94,7 @@
            id="remark"
            wrap="off"
            rows="3">
          </textarea>
          </textarea> -->
        </UiField>
      </el-row>

@@ -82,7 +103,7 @@
        justify="center"
        class="pam-paragraph">
        <el-button @click="$router.go(-1)">取消</el-button>
        <el-button @click="$router.go(-1)">確認</el-button>
        <el-button @click="closeAppointment">確認</el-button>
      </el-row>

  </div>
@@ -91,17 +112,24 @@
<script lang="ts">

import { Vue, Component } from 'vue-property-decorator';
import { ToCloseAppointment, ToDoneAppointment } from '~/shared/models/appointment.model';
import { ContactStatus } from '~/shared/models/enum/contact-status';

import appointmentService from '~/shared/services/appointment.service';

@Component
export default class AppointmentDetailCloseComponent extends Vue {

  contactStatus = ContactStatus;

  appointmentCloseInfo = {
    archivedDate     : '',
    failReason       : 'other',
    otherFailReason  : '',
    planCode         : '',
    remark           : '',
    selectCloseOption: 'done',
    closedOtherReason     : '',
    closedReason          : 'other',
    planCode              : '',
    policyEntryDate       : '',
    policyholderIdentityId: '',
    remark                : '',
    selectCloseOption     : 'done',
  };

  closeOptions = [
@@ -122,6 +150,29 @@
    }
  ];

  closeAppointment(): void {
    const appointmentId = +this.$route.params.appointmentId;
    if (this.appointmentCloseInfo.selectCloseOption === 'done') {
      const toDoneAppointment: ToDoneAppointment = {
        appointmentId         : appointmentId,
        contactStatus         : this.contactStatus.DONE,
        planCode              : this.appointmentCloseInfo.planCode,
        policyEntryDate       : this.appointmentCloseInfo.policyEntryDate,
        policyholderIdentityId: this.appointmentCloseInfo.policyholderIdentityId,
      }
      appointmentService.closeAppointment(toDoneAppointment).then((res) => res);
    } else {
      const toCloseAppointment: ToCloseAppointment = {
        appointmentId    : appointmentId,
        closedOtherReason: this.appointmentCloseInfo.closedOtherReason,
        closedReason     : this.appointmentCloseInfo.closedReason,
        contactStatus    : this.contactStatus.CLOSE,
        remark           : this.appointmentCloseInfo.remark,
      }
      appointmentService.closeAppointment(toCloseAppointment).then((res) => res);
    }
  }

}
</script>