From feaf504421bd039d6a42f4fbe7a2f47a9a425388 Mon Sep 17 00:00:00 2001
From: landuoduo <vv22345@163.com>
Date: Sat, 7 May 2022 12:04:11 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20el-select=20=E5=A4=9A=E9=80=89=E6=A8=A1?=
 =?UTF-8?q?=E5=BC=8F=E4=B8=8B=E9=BB=98=E8=AE=A4=E5=80=BC=E4=B8=AD=E5=90=AB?=
 =?UTF-8?q?=E6=9C=89=E4=B8=8D=E5=8F=AF=E7=BC=96=E8=BE=91=E7=9A=84=E9=80=89?=
 =?UTF-8?q?=E9=A1=B9=EF=BC=8Ctag=E6=A0=87=E7=AD=BE=E8=BF=98=E6=98=AF?=
 =?UTF-8?q?=E5=8F=AF=E4=BB=A5=E6=B8=85=E9=99=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 examples/play/index.vue                       | 29 +++++++++++++++++--
 packages/select/src/select.vue                |  5 ++--
 packages/theme-chalk/src/select-dropdown.scss |  3 ++
 packages/theme-chalk/src/select.scss          | 11 +++++--
 4 files changed, 41 insertions(+), 7 deletions(-)

diff --git a/examples/play/index.vue b/examples/play/index.vue
index 2370097d6..9d8e0f59e 100644
--- a/examples/play/index.vue
+++ b/examples/play/index.vue
@@ -1,6 +1,14 @@
 <template>
   <div style="margin: 20px;">
-    <el-input v-model="input" placeholder="请输入内容"></el-input>
+    <el-select v-model="value1" multiple placeholder="请选择">
+      <el-option
+        v-for="item in options"
+        :key="item.value"
+        :label="item.label"
+        :value="item.value"
+        :disabled="item.disabled">
+      </el-option>
+    </el-select>
   </div>
 </template>
 
@@ -8,7 +16,24 @@
   export default {
     data() {
       return {
-        input: 'Hello Element UI!'
+        options: [{
+          value: '选项1',
+          label: '黄金糕'
+        }, {
+          value: '选项2',
+          label: '双皮奶',
+          disabled: true
+        }, {
+          value: '选项3',
+          label: '蚵仔煎'
+        }, {
+          value: '选项4',
+          label: '龙须面'
+        }, {
+          value: '选项5',
+          label: '北京烤鸭'
+        }],
+        value1: ['选项2'],
       };
     }
   };
diff --git a/packages/select/src/select.vue b/packages/select/src/select.vue
index 031337510..5837135b3 100644
--- a/packages/select/src/select.vue
+++ b/packages/select/src/select.vue
@@ -32,13 +32,13 @@
         <el-tag
           v-for="item in selected"
           :key="getValueKey(item)"
-          :closable="!selectDisabled"
+          :closable="!selectDisabled && !item.disabled"
           :size="collapseTagSize"
           :hit="item.hitState"
           type="info"
           @close="deleteTag($event, item)"
           disable-transitions>
-          <span class="el-select__tags-text">{{ item.currentLabel }}</span>
+          <span class="el-select__tags-text" :class="{ 'is-disabled': item.disabled }">{{ item.currentLabel }}</span>
         </el-tag>
       </transition-group>
 
@@ -771,6 +771,7 @@
       },
 
       deleteTag(event, tag) {
+        console.log(tag)
         let index = this.selected.indexOf(tag);
         if (index > -1 && !this.selectDisabled) {
           const value = this.value.slice();
diff --git a/packages/theme-chalk/src/select-dropdown.scss b/packages/theme-chalk/src/select-dropdown.scss
index 8fb607c3a..4b9f251b3 100644
--- a/packages/theme-chalk/src/select-dropdown.scss
+++ b/packages/theme-chalk/src/select-dropdown.scss
@@ -35,6 +35,9 @@
         -moz-osx-font-smoothing: grayscale;
       }
     }
+    & .el-select-dropdown__item.selected.is-disabled {
+      color: #C0C4CC;
+    }
   }
 
   .el-scrollbar.is-empty .el-select-dropdown__list{
diff --git a/packages/theme-chalk/src/select.scss b/packages/theme-chalk/src/select.scss
index f337ae99c..38f1e5384 100644
--- a/packages/theme-chalk/src/select.scss
+++ b/packages/theme-chalk/src/select.scss
@@ -12,11 +12,16 @@
   display: inline-block;
   position: relative;
 
-  .el-select__tags
-    >span {
+  .el-select__tags {
+    &>span {
       display: contents;
     }
-
+    .is-disabled{
+      color: #C0C4CC;
+      cursor: not-allowed;
+    }
+  }
+  
   &:hover {
     .el-input__inner {
       border-color: $--select-border-color-hover;