update

gaoshp

2024-06-16 5be78f8d80e78ad76f5f322a0ea1f47105fffe6f

 src/views/setting/dic/index.vue

@@ -6,15 +6,19 @@
               <el-input placeholder="输入关键字进行过滤" v-model="dicFilterText" clearable></el-input>
            </el-header>
            <el-main class="nopadding">
               <el-tree ref="dic" class="menu" node-key="id" :data="dicList" :props="dicProps" :highlight-current="true" :expand-on-click-node="false" :filter-node-method="dicFilterNode" @node-click="dicClick">
               <el-tree :expand-on-click-node="false" ref="dic" class="menu" node-key="id" :data="dicList"
                  :props="dicProps" :highlight-current="true" :filter-node-method="dicFilterNode"
                  @node-click="dicClick">
                  <template #default="{node, data}">
                     <span class="custom-tree-node">
                        <span class="label">{{ node.label }}</span>
                        <span class="code">{{ data.code }}</span>
                        <span class="do">
                           <el-button-group>
                              <el-button icon="el-icon-edit" size="small" @click.stop="dicEdit(data)"></el-button>
                              <el-button icon="el-icon-delete" size="small" @click.stop="dicDel(node, data)"></el-button>
                              <el-button icon="el-icon-edit" size="small"
                                 @click.stop="dicEdit(data)"></el-button>
                              <el-button icon="el-icon-delete" size="small"
                                 @click.stop="dicDel(node, data)"></el-button>
                           </el-button-group>
                        </span>
                     </span>
@@ -22,7 +26,8 @@
               </el-tree>
            </el-main>
            <el-footer style="height:51px;">
               <el-button type="primary" size="small" icon="el-icon-plus" style="width: 100%;" @click="addDic">字典分类</el-button>
               <el-button type="primary" size="small" icon="el-icon-plus" style="width: 100%;"
                  @click="addDic">字典分类</el-button>
            </el-footer>
         </el-container>
      </el-aside>
@@ -30,28 +35,33 @@
         <el-header>
            <div class="left-panel">
               <el-button type="primary" icon="el-icon-plus" @click="addInfo"></el-button>
               <el-button type="danger" plain icon="el-icon-delete" :disabled="selection.length==0" @click="batch_del"></el-button>
               <el-button type="danger" plain icon="el-icon-delete" :disabled="selection.length == 0"
                  @click="batch_del"></el-button>
            </div>
         </el-header>
         <el-main class="nopadding">
            <scTable ref="table" :apiObj="listApi" row-key="id" :params="listApiParams" @selection-change="selectionChange" stripe :paginationLayout="'prev, pager, next'">
            <scTable ref="table" :apiObj="listApi" row-key="id" :params="listApiParams"
               @selection-change="selectionChange" stripe :paginationLayout="'prev, pager, next'">
               <el-table-column type="selection" width="50"></el-table-column>
               <el-table-column label="" width="60">
                  <template #default>
                     <el-tag class="move" style="cursor: move;"><el-icon-d-caret style="width: 1em; height: 1em;"/></el-tag>
                     <el-tag class="move" style="cursor: move;"><el-icon-d-caret
                           style="width: 1em; height: 1em;" /></el-tag>
                  </template>
               </el-table-column>
               <el-table-column label="名称" prop="name" width="150"></el-table-column>
               <el-table-column label="键值" prop="key" width="150"></el-table-column>
               <el-table-column label="是否有效" prop="yx" width="100">
                  <template #default="scope">
                     <el-switch v-model="scope.row.yx" @change="changeSwitch($event, scope.row)" :loading="scope.row.$switch_yx" active-value="1" inactive-value="0"></el-switch>
                     <el-switch v-model="scope.row.yx" @change="changeSwitch($event, scope.row)"
                        :loading="scope.row.$switch_yx" active-value="1" inactive-value="0"></el-switch>
                  </template>
               </el-table-column>
               <el-table-column label="操作" fixed="right" align="right" width="120">
                  <template #default="scope">
                     <el-button-group>
                        <el-button text type="primary" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button>
                        <el-button text type="primary" size="small"
                           @click="table_edit(scope.row, scope.$index)">编辑</el-button>
                        <el-popconfirm title="确定删除吗？" @confirm="table_del(scope.row, scope.$index)">
                           <template #reference>
                              <el-button text type="primary" size="small">删除</el-button>
@@ -67,7 +77,8 @@

   <dic-dialog v-if="dialog.dic" ref="dicDialog" @success="handleDicSuccess" @closed="dialog.dic=false"></dic-dialog>

   <list-dialog v-if="dialog.list" ref="listDialog" @success="handleListSuccess" @closed="dialog.list=false"></list-dialog>
   <list-dialog v-if="dialog.list" ref="listDialog" @success="handleListSuccess"
      @closed="dialog.list = false"></list-dialog>

</template>

@@ -324,10 +335,36 @@
</script>

<style scoped>
   .menu:deep(.el-tree-node__label) {display: flex;flex: 1;height:100%;}
   .custom-tree-node {display: flex;flex: 1;align-items: center;justify-content: space-between;font-size: 14px;padding-right: 24px;height:100%;}
   .custom-tree-node .code {font-size: 12px;color: #999;}
   .custom-tree-node .do {display: none;}
   .custom-tree-node:hover .code {display: none;}
   .custom-tree-node:hover .do {display: inline-block;}
.menu:deep(.el-tree-node__label) {
   display: flex;
   flex: 1;
   height: 100%;
}

.custom-tree-node {
   display: flex;
   flex: 1;
   align-items: center;
   justify-content: space-between;
   font-size: 14px;
   padding-right: 24px;
   height: 100%;
}

.custom-tree-node .code {
   font-size: 12px;
   color: #999;
}

.custom-tree-node .do {
   display: none;
}

.custom-tree-node:hover .code {
   display: none;
}

.custom-tree-node:hover .do {
   display: inline-block;
}
</style>