警情排行调整

shuishen

2023-05-08 e24f70ababdee2b4fdce71c6b80a9bc928fa0331

 src/components/select/index.vue

@@ -7,11 +7,10 @@
            <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.length, 'options-box-hide': optionsShow, issel: options.length >= 4 }"
            class="select-options">
            <!-- 下拉框 -->
            <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>
@@ -49,9 +48,7 @@
    },

    mounted () {
        setTimeout(() => {
            console.log(this.options)
        }, 3000)

    },

    methods: {
@@ -61,6 +58,7 @@
            this.$emit("selectCheck", item, index)
        },
        selectClick () {
            console.log(this.selectAllClass, this.options.length)
            if (this.selectAllClass == true) return
            this.optionsShow = !this.optionsShow
        }
@@ -71,12 +69,12 @@
<style lang="scss" scoped>
//显示下拉框
.options-box-show {
    display: block;
    display: block !important;
}

//隐藏下拉框
.options-box-hide {
    display: none;
    display: none !important;
}

//点击时改变选择框的边框颜色
@@ -119,12 +117,13 @@

    //当下拉框数量超过4个时 使用固定高度
    .issel {
        height: 140px !important;
        max-height: 140px !important;
    }

    .select-options {
        display: none;
        width: 100%;
        height: 140px;
        max-height: 140px;
        overflow: auto;
        border: 1px solid rgba(20, 50, 123, 1); //下拉框边框颜色
        border-top: none;