From caac46f6340e2e94cd370ece58db74db11f6873d Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Thu, 02 Feb 2023 15:47:29 +0800
Subject: [PATCH] 首页select数据筛选更改
---
src/components/select/index.vue | 41 ++++++++++++++++++++++++++---------------
1 files changed, 26 insertions(+), 15 deletions(-)
diff --git a/src/components/select/index.vue b/src/components/select/index.vue
index 4944655..ac78114 100644
--- a/src/components/select/index.vue
+++ b/src/components/select/index.vue
@@ -1,26 +1,17 @@
<template>
<div class="selects-container">
<!-- 选择框 -->
- <div
- :class="{ 'selects-box-show': !optionsShow, 'selects-box-hide': optionsShow }"
- class="selects-box"
- @click="optionsShow = !optionsShow"
- >
+ <div :class="{ 'selects-box-show': !optionsShow, 'selects-box-hide': optionsShow, 'select-choosable': selectAllClass }"
+ class="selects-box" @click="selectClick">
<div class="text" v-text="checkValue"></div>
<i class="el-icon-arrow-down"></i>
</div>
<!-- 下拉框大盒子 -->
- <div
- :class="{ 'options-box-show': !optionsShow, 'options-box-hide': optionsShow, issel: options.length >= 4 }"
- class="select-options"
- :style="{ height: 35 * options.length + 'px' }"
- >
+ <div :class="{ 'options-box-show': !optionsShow, 'options-box-hide': optionsShow, issel: options.length >= 4 }"
+ class="select-options" :style="{ height: 35 * options.length + 'px' }">
<!-- 下拉框 -->
- <div
- @click="cutValue(item, index)"
- v-for="(item, index) in options"
- :key="index"
- >{{ item[optionsName] }}</div>
+ <div @click="cutValue(item, index)" v-for="(item, index) in options" :key="index">{{ item[optionsName] }}
+ </div>
</div>
</div>
</template>
@@ -43,6 +34,12 @@
optionsName: {
type: String,
},
+
+ selectAllClass: {
+ type: Boolean,
+ required: false,
+ default: false
+ }
},
data () {
@@ -51,11 +48,21 @@
}
},
+ mounted () {
+ setTimeout(() => {
+ console.log(this.options)
+ }, 3000)
+ },
+
methods: {
//点击换文字的方法
cutValue (item, index) {
this.optionsShow = true
this.$emit("selectCheck", item, index)
+ },
+ selectClick () {
+ if (this.selectAllClass == true) return
+ this.optionsShow = !this.optionsShow
}
}
}
@@ -83,6 +90,10 @@
border: 1px solid rgba(20, 50, 123, 1);
}
+.select-choosable {
+ cursor: not-allowed !important;
+}
+
.selects-container {
width: 100%;
height: 100%;
--
Gitblit v1.9.3