脱敏策略管理 列表

src/views/desensitizationStrategy/DesensitizationStrategy/QueryForm.vue

@@ -2,13 +2,14 @@
 import { computed,ref,watch } from 'vue'
 import type { FormInstance } from 'element-plus'
 import PageWrapperSearch from '@/components/search/PageWrapperSearch.vue'
-// import { useDict } from '@/utils/dict'
-// import { listDept } from '@/api/system/dept'// 部门
 
+import {
+  Plus
+} from '@element-plus/icons-vue'
 
 
 // const { approve_status, invoice_status} = useDict('approve_status', 'invoice_status')
-const emit = defineEmits(['update:modelValue', 'query', 'reset'])
+const emit = defineEmits(['update:modelValue', 'query', 'reset','handleAdd'])
 const invoice_status_filter = ref([])
 const employeesList = ref([])
 const props = defineProps<{
@@ -39,7 +40,9 @@ function onReset(formRef: FormInstance) {
   queryForm.value.state = ''
   emit('reset', formRef)
 }
-
+function handleAdd() {
+  emit('handleAdd')
+}
 
 </script>
 
@@ -47,6 +50,16 @@ function onReset(formRef: FormInstance) {
   <!-- el-form -->
   <page-wrapper-search
     :model="queryForm"
+    :extraButtons="[
+      {
+        text: '新增',
+        icon: Plus,
+        color: 'rgba(0, 189, 207, 1)',
+        type: 'success',
+        class: 'btn-fff',
+        onClick: handleAdd
+      }
+    ]"
     @search="onSearch"
     @reset="onReset">
     <el-form-item label="策略名" prop="strategyName">
@@ -81,6 +94,10 @@ function onReset(formRef: FormInstance) {
   </page-wrapper-search>
 </template>
 
-<style scoped>
-
+<style scoped lang="scss">
+:deep(.btn-fff){
+  span{
+    color: #fff;
+  }
+}
 </style>

src/views/desensitizationStrategy/DesensitizationStrategy/list.vue

@@ -214,34 +214,36 @@ const toggleStatus = (row) => {
 
 <template>
   <div class="app-container scroller">
-    <PageTitle :back="true" @back="pageProjectManage">
+    <PageTitle backProject @handleBackProject="pageProjectManage">
       <template #title>
-        返回项目管理
+        脱敏策略管理
       </template>
       <template #buttons>
-        <el-button
+        <!-- <el-button
           icon="Plus"
           type="primary"
           @click="handleAdd"
         > 
           新增策略
-        </el-button>
+        </el-button> -->
       </template>
     </PageTitle>
     
     <div class="app-container__body">
-      <div>
+
         <query-form
           ref="QueryFormRef"
           v-model="queryParams"
           @query="onQuery"
-          @reset="onReset"/>
-        
+          @reset="onReset"
+          @handleAdd="handleAdd"
+        />
+        <div style="flex: 1;">
            <el-table
+            height="100%"
             :data="tableData"
-          border
+            stripe
             style="width: 100%"
-          :header-cell-style="{ background: '#f5f7fa', color: '#606266' }"
             v-loading="loading"
           >
             <el-table-column prop="strategyName" label="策略名称" min-width="120" fiexd/>
@@ -255,20 +257,19 @@ const toggleStatus = (row) => {
                 </el-tag>
               </template>
             </el-table-column>
-          <el-table-column label="操作" width="280" align="center" fixed="right">
+            <el-table-column label="操作" width="340" align="center" fixed="right">
               <template #default="{ row }">
-              <el-button link type="primary" size="small" @click="showDetail(row)">详情</el-button>
-              <el-divider direction="vertical" />
-              <el-button link type="primary" size="small" @click="editStrategy(row)">编辑策略</el-button>
-              <el-divider direction="vertical" />
-              <el-button link type="danger" size="small" @click="deleteStrategy(row)">删除</el-button>
-              <el-divider direction="vertical" />
-              <el-button link type="success" size="small" @click="toggleStatus(row)">
+                <el-button plain type="primary" size="small" icon="Tickets" @click="showDetail(row)">详情</el-button>
+                <el-button plain color="rgba(237, 183, 5, 1)"  size="small" icon="edit" @click="editStrategy(row)">编辑</el-button>
+                <el-button plain color="rgba(255, 141, 26, 1)"  size="small" icon="delete" @click="deleteStrategy(row)">删除</el-button>
+                <el-button :icon="row.state === '1'?'WarningFilled' : 'SuccessFilled'"  :type="row.state === '1' ? 'warning' : 'success'" size="small" plain @click="toggleStatus(row)">
                   {{ row.state === '1' ? '禁用' : '启用' }}
                 </el-button>
               </template>
             </el-table-column>
           </el-table>
+        </div>
+       
           
         <pagination
           v-show="total > 0"
@@ -278,7 +279,7 @@ const toggleStatus = (row) => {
           @pagination="getList"
         />
       </div>
-    </div>
+
 
     <!-- 统一策略对话框组件 -->
     <StrategyAddDialog :title="dialog.title" ref="strategyAddDialogRef" @refresh="handleQuery" />