update#134171: 結案明細(頁面) - 未成交欄位

Tomas

2022-01-12 24277e82e50e3cee2f3894d7be309713489ebb9c

update#134171: 結案明細(頁面) - 未成交欄位

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

@@ -11,6 +11,7 @@
        </UiField>
      </el-row>

      <template v-if="appointmentCloseInfo.selectCloseOption === 'done'">
      <el-row
        type="flex"
        class="pam-paragraph">
@@ -34,6 +35,31 @@
            type="text">
        </UiField>
      </el-row>
      </template>

      <template v-if="appointmentCloseInfo.selectCloseOption === 'close'">
        <el-row
          class="pam-paragraph">
          <UiField label="未成交原因" :labelSize="20">
          </UiField>
              <select
                class="appointment-client-detail-close__select"
                name="failReason" id="failReason" v-model="appointmentCloseInfo.failReason">
                <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'"
                  class="appointment-client-detail-close__input"
                  v-model="appointmentCloseInfo.otherFailReason"
                  placeholder="請輸入原因，限50字。"
                  type="text">
              </div>
        </el-row>
      </template>

      <el-row
        type="flex"
@@ -70,10 +96,12 @@
export default class AppointmentDetailCloseComponent extends Vue {

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

  closeOptions = [
@@ -87,11 +115,20 @@
    }
  ];

  appointmentFailReason = [
    {
      key: '其他',
      value: 'other'
    }
  ];

}
</script>

<style lang="scss" scoped>
.appointment-close__remark, .appointment-client-detail-close__input {
.appointment-close__remark,
.appointment-client-detail-close__input,
.appointment-client-detail-close__select {
  border-radius: 5px;
  border   : 1px solid #707070;
  font-size: 20px;