feat: 积分规则一级界面开发

src/views/pointsManagement/pointsRules/index.vue

@@ -1,3 +1,177 @@
 <template>
-  <h3>积分规则</h3>
+  <div class="app-container">
+        <el-form :model="queryParams" ref="queryRef" size="small" :inline="true" v-show="showSearch" label-width="68px">
+          <el-form-item label="活动类型" prop="activityType">
+            <DictSelect v-model="queryParams.activityType" :dictOptions="navigateMenuOption" placeholder="请选择"/>
+          </el-form-item>
+          <el-form-item label="城市" prop="activityCity">
+            <DictSelect v-model="queryParams.activityCity" :dictOptions="navigateMenuOption" placeholder="请选择"/>
+          </el-form-item>
+          <el-form-item label="状态" prop="activityStatus">
+            <DictSelect v-model="queryParams.activityStatus" :dictOptions="navigateMenuOption" placeholder="请选择"/>
+          </el-form-item>
+          <el-form-item label="活动时间" prop="dateRange">
+            <el-date-picker
+              v-model="queryParams.dateRange"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+          </el-form-item>
+        </el-form>
+
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button
+              type="primary"
+              plain
+              icon="el-icon-plus"
+              size="mini"
+              @click="handleRuleAdd"
+            >新增积分活动</el-button>
+          </el-col>
+          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+        </el-row>
+
+    <tableCompontent ref="tableRef" :loading="loading" :tableData="list" :columnData="columnData">
+      <template v-slot:nickName="row">
+        <el-link type="primary" slot="reference" @click="viewStatistics(row)">查看统计</el-link>
+      </template>
+      <template v-slot:operation="row">
+        <el-button size="mini" type="text" @click="handleView(row)">详情</el-button>
+        <el-button size="mini" type="text" @click="handleEdit(row)">编辑</el-button>
+        <el-button size="mini" type="text" @click="handleCopy(row)">复制</el-button>
+      </template>
+    </tableCompontent>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </div>
 </template>
+
+<script>
+import { listUser } from "@/api/system/user";
+import tableCompontent from "@/components/tableCompontent/index.vue";
+import listMixin from '@/utils/listMixin';
+export default {
+  name: "pointsRules",
+  mixins: [listMixin],
+  components: {
+    tableCompontent,
+  },
+  data() {
+    return {
+      // 显示搜索条件
+      showSearch: true,
+      // 用户表格数据
+      list: null,
+      columnData:[
+        {
+          prop: 'seq',
+          label: '序号',
+          getIndex: this.getIndex,
+          width: 55,
+          align:'center',
+          fixed: 'left'
+        },
+        {
+          prop: 'email',
+          label: '活动名称',
+          align:'center',
+        },
+        {
+          prop: 'activityType',
+          label: '活动类型',
+          align:'center',
+        },
+        {
+          prop: 'activityCity',
+          label: '覆盖城市',
+          align:'center',
+        },
+        {
+          prop: 'activityStatus',
+          label: '状态',
+          color:'red',
+          align:'center',
+        },
+        {
+          prop: 'activityTime',
+          label: '活动时间',
+          align:'center',
+        },
+        {
+          prop: 'nickName',
+          label: '活动详情',
+          align:'center',
+          type: 'diy',
+        },
+        {
+          prop: 'operation',
+          label: '操作',
+          align:'center',
+          fixed: 'right',
+          type:'custom',
+          width: 120
+        },
+      ],
+      navigateMenuOption:[
+        {label:'测试数据',value:'1'},
+        {label:'测试数据1',value:'2'},
+        {label:'测试数据2',value:'3'}
+      ]
+    };
+  },
+  created() {
+    this.queryParams = {
+      ...this.queryParams,
+      activityType:'',
+      activityCity:'',
+      activityStatus:'',
+      dateRange:[],
+    }
+    //this.getListUrl = listUser;
+    // 或者设置自定义数据处理函数
+    this.customProcessDataFun = (val) => {
+      // 自定义处理查询参数
+      this.queryParams = this.DateRange(this.queryParams,val.dateRange || [],['startTime','endTime'],'s')
+    };
+  },
+  methods: {
+    /** 新增操作 */
+    handleRuleAdd() {
+
+    },
+    /** 查看统计 */
+    viewStatistics(row){
+
+    },
+    /** 查看详情 */
+    handleView(row) {
+
+    },
+
+    /** 编辑 */
+    handleEdit(row) {
+
+    },
+
+    /** 复制 */
+    handleCopy(row) {
+
+    },
+  }
+};
+</script>