Просмотр исходного кода

优化 table/search.vue 的展开更多,仅在有隐藏条件时才显示

夜鹰 9 месяцев назад
Родитель
Сommit
7bae4f93b3
2 измененных файлов с 9 добавлено и 4 удалено
  1. 8 3
      Web/src/components/table/search.vue
  2. 1 1
      Web/src/main.ts

+ 8 - 3
Web/src/components/table/search.vue

@@ -1,6 +1,7 @@
 <template>
 	<div style="display: flex;">
-        <div class="table-search-container">
+        <!-- <div class="table-search-container"> -->
+        <div :class="['table-search-container', { 'table-search-flex': search.length > defaultShowCount }]">
             <el-form ref="tableSearchRef" :model="state.innerModelValue" :inline="true" label-width="100px">
                 <span v-for="(val, key) in search" :key="key" v-show="key < defaultShowCount || state.isToggle">
                     <template v-if="val.type">
@@ -79,7 +80,7 @@
                 </span>
             </el-form>
         </div>
-        <div class="table-search-more">
+        <div v-if="search.length > defaultShowCount" class="table-search-more">
             <el-form :inline="true">
                 <el-form-item>
                     <el-button text @click="state.isToggle = !state.isToggle"
@@ -219,8 +220,12 @@ const shortcuts = [
 </script>
 
 <style scoped lang="scss">
-.table-search-container {
+.table-search-flex {
     flex: 1;
+}
+
+.table-search-container {
+    //flex: 1;
 
     :deep(.el-form-item--small .el-form-item__label) {
         padding: 0 8px 0 0;

+ 1 - 1
Web/src/main.ts

@@ -22,7 +22,7 @@ import VForm3 from 'vform3-builds';
 import 'vform3-builds/dist/designer.style.css';
 // 关闭自动打印
 import { disAutoConnect } from 'vue-plugin-hiprint';
-import sysDict from "/src/components/sysDict/sysDict.vue";
+import sysDict from "/@/components/sysDict/sysDict.vue";
 disAutoConnect();
 
 const app = createApp(App);