瀏覽代碼

✨ feat<报表管理>: 填写人自动补全问题修复

xinyan 9 月之前
父節點
當前提交
6040fdb93c

+ 4 - 59
src/views/demo/index.vue

@@ -1,66 +1,11 @@
 <template>
-  <div>
-    <el-select
-        v-model="selectedItems"
-        multiple
-        filterable
-        clearable
-        placeholder="请选择"
-        :filter-method="searchOptions"
-        :loading="loading"
-        @focus="loadOptions"
-        style="width: 300px;"
-    >
-      <el-option
-          v-for="item in options"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value"
-      />
-    </el-select>
-  </div>
+
 </template>
 
 <script setup>
-import { ref } from 'vue';
-
-// 已选中的项
-const selectedItems = ref([]);
-
-// 下拉框的选项
-const options = ref([]);
-
-// 加载状态
-const loading = ref(false);
 
-// 模拟的异步数据源
-const allOptions = [
-  { value: 'A', label: 'Apple' },
-  { value: 'B', label: 'Banana' },
-  { value: 'C', label: 'Cherry' },
-  { value: 'D', label: 'Durian' },
-  { value: 'H', label: 'Honeydew' },
-  { value: 'K', label: 'Kiwi' },
-  // 可以继续添加更多数据
-];
+</script>
 
-// 选项过滤方法
-const searchOptions = (query) => {
-  if (query) {
-    options.value = allOptions.filter(option =>
-        option.label.toLowerCase().includes(query.toLowerCase())
-    );
-  } else {
-    options.value = allOptions;
-  }
-};
+<style scoped>
 
-// 加载所有选项
-const loadOptions = () => {
-  loading.value = true;
-  setTimeout(() => {
-    options.value = allOptions;
-    loading.value = false;
-  }, 300); // 模拟异步请求延迟
-};
-</script>
+</style>

+ 6 - 6
src/views/reportManage/dataCenter/normalDisplay/components/Selector/index.vue

@@ -148,10 +148,10 @@ defineExpose({ fetchFilteredData, filteredData, updateData });
 </script>
 
 <template>
-  <div class="flex-container">
-    <el-input v-model="platformNumberList" class="flex-item" clearable placeholder="平台编号"
+  <div class="flex gap-2.5 flex-wrap">
+    <el-input v-model="platformNumberList" class="flex-item" clearable placeholder="平台编号" style="width: 150px;"
               @change="emitChange"></el-input>
-    <el-input v-model="platformNameList" class="flex-item" clearable placeholder="平台名称"
+    <el-input v-model="platformNameList" class="flex-item" clearable placeholder="平台名称" style="width: 200px;"
               @change="emitChange"></el-input>
     <el-input v-model="operationList" class="flex-item" clearable placeholder="运营" @change="emitChange"></el-input>
     <el-select
@@ -162,7 +162,7 @@ defineExpose({ fetchFilteredData, filteredData, updateData });
         clearable
         collapse-tags
         placeholder="填写人"
-        style="width: 300px;"
+        style="width: 280px;"
     >
       <el-option
           v-for="item in usersOptions"
@@ -171,7 +171,7 @@ defineExpose({ fetchFilteredData, filteredData, updateData });
           :value="item.value"
       />
     </el-select>
-    <el-select v-model="countryList" class="flex-item" clearable collapse-tags collapse-tags-tooltip multiple placeholder="国家">
+    <el-select v-model="countryList" class="flex-item" clearable collapse-tags collapse-tags-tooltip multiple placeholder="国家" style="width: 280px;">
       <el-option v-for="item in countryOptions" :key="item" :label="item" :value="item" />
       <template #footer>
         <el-button text size="small" @click="selectCommonGroup1">美洲区</el-button>
@@ -192,7 +192,7 @@ defineExpose({ fetchFilteredData, filteredData, updateData });
 <style scoped>
 .flex-container {
   display: flex;
-  flex-wrap: nowrap;
+  /* flex-wrap: wrap; */
   gap: 14.5px; /* 控制间距 */
 }
 

+ 1 - 1
src/views/reportManage/dataCenter/normalDisplay/index.vue

@@ -78,7 +78,7 @@ onBeforeUnmount(() => {
 <template>
   <div class="px-3.5">
     <el-card body-style="padding: 10px" class="mb-3.5 mt-3.5">
-      <div class="custom-card-style flex gap-1.5 justify-between items-center my-1.5 mx-2 mb-5">
+      <div class="custom-card-style flex gap-1.5 justify-between items-start my-1.5 mx-2 mb-5">
         <Selector ref="selectorRef" @update:updateData="updateDataChange" />
         <DataPicker class="flex-item" style="display: flex; align-items: center;" @dateChange="handelDateChange" />
       </div>