From b9658b7c42ca15e11153f782949c33a9b2d6a07a Mon Sep 17 00:00:00 2001
From: charlie <charlie@lvguanqingdeMacBook-Pro.local>
Date: 星期五, 21 一月 2022 17:23:40 +0800
Subject: [PATCH] bugfix: 顧問結案頁面中的未結案原因select中的icon修正
---
PAMapp/assets/scss/vendors/_elementUI.scss | 3 +
PAMapp/assets/icon/style.css | 6 +-
PAMapp/assets/scss/vendors/elementUI/_select.scss | 28 ++++++++++++++
PAMapp/components/Ui/UiSelect.vue | 26 +++++++++++++
PAMapp/pages/appointment/_appointmentId/close/index.vue | 43 +++++----------------
5 files changed, 69 insertions(+), 37 deletions(-)
diff --git a/PAMapp/assets/icon/style.css b/PAMapp/assets/icon/style.css
index 1d5c85e..59295bd 100644
--- a/PAMapp/assets/icon/style.css
+++ b/PAMapp/assets/icon/style.css
@@ -10,7 +10,7 @@
font-display: block;
}
-[class^="icon-"], [class*=" icon-"] {
+[class^="icon-"], [class*=" icon-"], [class*="el-icon-arrow-up"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon' !important;
speak: never;
@@ -76,8 +76,8 @@
.icon-circle-right:before {
content: "\e90b";
}
-.icon-close:before {
- content: "\e90c";
+.icon-down:before, .el-icon-arrow-up:before {
+ content: "\e910";
}
.icon-comment:before {
content: "\e90d";
diff --git a/PAMapp/assets/scss/vendors/_elementUI.scss b/PAMapp/assets/scss/vendors/_elementUI.scss
index a0276e8..0fe5584 100644
--- a/PAMapp/assets/scss/vendors/_elementUI.scss
+++ b/PAMapp/assets/scss/vendors/_elementUI.scss
@@ -15,4 +15,5 @@
@import './elementUI/tree';
@import './elementUI/upload';
@import './elementUI/textarea';
-@import './elementUI/dateTimePicker';
\ No newline at end of file
+@import './elementUI/dateTimePicker';
+@import './elementUI/select';
\ No newline at end of file
diff --git a/PAMapp/assets/scss/vendors/elementUI/_select.scss b/PAMapp/assets/scss/vendors/elementUI/_select.scss
new file mode 100644
index 0000000..674bf6b
--- /dev/null
+++ b/PAMapp/assets/scss/vendors/elementUI/_select.scss
@@ -0,0 +1,28 @@
+.pam-select.el-select {
+ width: 100%;
+
+ .el-input {
+
+ &__inner {
+ padding-left: 20px;
+ height: 46px;
+ border: 1px solid #707070;
+ border-radius: 5px;
+ font-size: 20px;
+ }
+ &__icon {
+ color: #ED1B2E;
+ font-size: 25px;
+ transform: none;
+ }
+ }
+ .is-focus {
+ .el-input__inner {
+ border-color: #707070;
+ }
+ }
+}
+
+.el-select-dropdown__item {
+ padding: 0 10px;
+}
\ No newline at end of file
diff --git a/PAMapp/components/Ui/UiSelect.vue b/PAMapp/components/Ui/UiSelect.vue
new file mode 100644
index 0000000..2ed8dd8
--- /dev/null
+++ b/PAMapp/components/Ui/UiSelect.vue
@@ -0,0 +1,26 @@
+ <template>
+ <el-select v-model="syncedCloseReason" class="pam-select" ref="select">
+ <el-option
+ v-for="(item,index) in options"
+ :key="index"
+ :label="item.key"
+ :value="item.value">
+ {{ item.key }}
+ </el-option>
+ </el-select>
+</template>
+
+<script lang="ts">
+import { Vue, Component, PropSync, Prop} from 'nuxt-property-decorator';
+
+@Component
+export default class UiSelect extends Vue {
+
+ @PropSync('closeReason', { type: String, default: 'other' })
+ syncedCloseReason!: string;
+
+ @Prop({ type:Array , default:()=>[] })
+ options!: object[];
+
+}
+</script>
\ No newline at end of file
diff --git a/PAMapp/pages/appointment/_appointmentId/close/index.vue b/PAMapp/pages/appointment/_appointmentId/close/index.vue
index 194139e..3006ed1 100644
--- a/PAMapp/pages/appointment/_appointmentId/close/index.vue
+++ b/PAMapp/pages/appointment/_appointmentId/close/index.vue
@@ -55,26 +55,16 @@
<el-row
class="pam-paragraph">
<UiField label="���漱����" :labelSize="20" class="required">
+ <UiSelect :closeReason.sync="appointmentCloseInfo.closedReason"
+ :options="appointmentFailReason"/>
</UiField>
- <div class="appointment-client-detail-close__select-box">
- <select
- class="appointment-client-detail-close__select"
- name="closedReason" id="closedReason" v-model="appointmentCloseInfo.closedReason">
- <option :value="failReason.value" v-for="(failReason, index) in appointmentFailReason" :key="index">
- {{ failReason.key }}
- </option>
- </select>
- <i class="icon-down down-icon"></i>
- </div>
- <div class="mt-10">
- <input
- v-if="appointmentCloseInfo.closedReason === 'other'
- || appointmentCloseInfo.closedReason === 'no_suitable_commodity'"
- class="appointment-client-detail-close__input"
- v-model="appointmentCloseInfo.closedOtherReason"
- placeholder="隢撓�������50摮��"
- type="text">
- </div>
+ <input
+ v-if="appointmentCloseInfo.closedReason === 'other'
+ || appointmentCloseInfo.closedReason === 'no_suitable_commodity'"
+ class="appointment-client-detail-close__input mt-10"
+ v-model="appointmentCloseInfo.closedOtherReason"
+ placeholder="隢撓�������50摮��"
+ type="text">
</el-row>
</template>
@@ -244,8 +234,7 @@
<style lang="scss" scoped>
.appointment-close__remark,
-.appointment-client-detail-close__input,
-.appointment-client-detail-close__select {
+.appointment-client-detail-close__input {
border-radius: 5px;
border : 1px solid #707070;
font-size: 20px;
@@ -257,18 +246,6 @@
}
&.is-invalid {
border-color: $PRIMARY_RED !important;
- }
-}
-.appointment-client-detail-close__select-box {
- position: relative;
-
- & .appointment-client-detail-close__select{
- appearance: none;
- }
- & .down-icon {
- position: absolute;
- right: 7px;
- bottom: 10px;
}
}
.invite-review{
--
Gitblit v1.8.0