feat():规则维护页面

src/api/rule/maintain.js

@@ -0,0 +1,9 @@
+import request from '@/utils/request'
+
+export function getList(data) {
+  return request({
+    url: '/rule/ruleData/list',
+    method: 'post',
+    data: data
+  })
+}

src/views/rule/maintain/index.vue

@@ -1,28 +1,169 @@
 <template>
-  <div>
+  <div class="app-container">
-    <h1>1111</h1>
+    <el-form v-show="showSearch" ref="queryForm" :inline="true" :model="queryParams" label-width="68px" size="small">
+      <el-form-item label="规则名称" prop="dictName">
+        <el-input
+          v-model="queryParams.dictName"
+          clearable
+          placeholder="请输入规则名称"
+          style="width: 240px"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="规则类型" prop="ruleType">
+        <el-select
+          v-model="queryParams.ruleType"
+          clearable
+          placeholder="规则类型"
+          style="width: 240px"
+        >
+          <el-option
+            v-for="dict in dict.type.sys_rule_type"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="激活状态" prop="ruleActivate">
+        <el-select
+          v-model="queryParams.ruleActivate"
+          clearable
+          placeholder="激活状态"
+          style="width: 240px"
+        >
+          <el-option
+            v-for="dict in dict.type.sys_rule_activate"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="规则状态" prop="status">
+        <el-select
+          v-model="queryParams.status"
+          clearable
+          placeholder="规则状态"
+          style="width: 240px"
+        >
+          <el-option
+            v-for="dict in dict.type.sys_rule_type"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-table v-loading="loading" :data="ruleList" @selection-change="handleSelectionChange">
+      <el-table-column align="center" type="selection" width="55"/>
+      <el-table-column label="规则编号" prop="roleId" width="120"/>
+      <el-table-column :show-overflow-tooltip="true" label="规则名称" prop="roleName" width="150"/>
+      <el-table-column :show-overflow-tooltip="true" label="规则类型" prop="ruleType" width="150"/>
+      <el-table-column :show-overflow-tooltip="true" label="规则作用域" prop="ruleRegion" width="150"/>
+      <el-table-column :show-overflow-tooltip="true" label="引擎编码" prop="ruleCoding" width="150"/>
+      <el-table-column :show-overflow-tooltip="true" label="激活状态" prop="ruleActivate" width="150"/>
+      <el-table-column :show-overflow-tooltip="true" label="规则状态" prop="ruleStatus" width="150"/>
+      <el-table-column align="center" class-name="small-padding fixed-width" label="操作">
+        <template v-if="scope.row.roleId !== 1" slot-scope="scope">
+          <el-button
+            v-hasPermi="['system:role:edit']"
+            icon="el-icon-edit"
+            size="mini"
+            type="text"
+            @click="handleUpdate(scope.row)"
+          >修改
+          </el-button>
+          <el-button
+            v-hasPermi="['system:role:remove']"
+            icon="el-icon-delete"
+            size="mini"
+            type="text"
+            @click="handleDelete(scope.row)"
+          >删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
   </div>
 </template>
 
 <script>
 //这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
 //例如：import 《组件名称》 from '《组件路径》,
+  import { getList } from '@/api/rule/maintain'
+
 export default {
     //import引入的组件需要注入到对象中才能使用"
+    name:"Maintain",
+    dicts:['sys_rule_type','sys_rule_region','sys_rule_activate'],
     components: {},
     props: {},
     data() {
       //这里存放数据"
-      return {};
+      return {
+        // 显示搜索条件
+        showSearch: true,
+        // 查询参数
+        queryParams: {
+          pageNum: 1,
+          pageSize: 10,
+          ruleName:undefined,
+          ruleType:undefined,
+          ruleActivate:undefined,
+          ruleStatus:undefined,
+        },
+        // 遮罩层
+        loading: true,
+        // 选中数组
+        ids: [],
+        // 非单个禁用
+        single: true,
+        // 非多个禁用
+        multiple: true,
+        // 字典表格数据
+        ruleList: [],
+      };
     },
     //计算属性 类似于data概念",
     computed: {},
     //监控data中的数据变化",
     watch: {},
     //方法集合",
-    methods: {},
+    methods: {
+      // 多选框选中数据
+      handleSelectionChange(selection) {
+        this.ids = selection.map(item => item.roleId)
+        this.single = selection.length != 1
+        this.multiple = !selection.length
+      },
+      showList(){
+        getList().then(response => {
+          this.ruleList = response.data
+        })
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.queryParams.pageNum = 1;
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.dateRange = [];
+        this.resetForm("queryForm");
+        this.handleQuery();
+      },
+    },
     //生命周期 - 创建完成（可以访问当前this实例）",
     created() {
+      this.showList()
     },
     //生命周期 - 挂载完成（可以访问DOM元素）",
     mounted() {