切换主题，自身设置颜色、大小

wujingjing

2025-02-07 4c20089472b20319746649decbce3a11f16cb6a0

 src/components/chat/chatComponents/multiChat/InputSelect.vue

@@ -1,5 +1,5 @@
<template>
   <div class="flex flex-col gap-1">
   <div class="flex flex-col gap-2">
      <span class="text-gray-600 font-normal">{{ `${order} ${item?.data?.title}` }}</span>
      <div  class="flex-items-center gap-5">
         <!-- <span
@@ -10,10 +10,13 @@
            :class="{ 'cursor-not-allowed': disabled, 'bg-blue-400': subItem === activeOption, 'text-white': subItem === activeOption }"
            >{{ subItem }}</span
         > -->
            <el-select v-if="isSelect" v-model="activeOption" placeholder="请选择" @change="debounceSelect">
            <el-select v-if="isSelect" v-model="activeOption" placeholder="请选择" @change="selectChange">
                <el-option v-for="item in item?.data?.options" :key="item" :label="item" :value="item"></el-option>
            </el-select>
            <el-input v-else @input="debounceSelect" v-model="activeOption" />
         <div v-else class="flex items-center gap-3">
            <el-input   v-model="inputValue" />
            <el-button type="primary" @click="submitInput">提交</el-button>
         </div>
      </div>
   </div>
</template>
@@ -26,7 +29,7 @@
// :class="[...(subItem === activeOption ? ['bg-blue-400', 'text-white'] : []), disabled ? 'cursor-not-allowed' : '']"
// 'bg-blue-400': subItem === activeOption, 'text-white': subItem === activeOption.value
const isSelect = computed(() => props.item?.data?.options?.length > 0);

const inputValue = ref('');
const activeOption = ref();
const selectChange = async (option) => {
   if (props.disabled) return;
@@ -38,7 +41,8 @@
      activeOption.value = option;
   }
};
const debounceSelect = debounce(selectChange, 500);

const submitInput = () => {
   selectChange(inputValue.value);
};
</script>
<style scoped lang="scss"></style>