init

src/views/xq/userVip/vip-order-dialog.vue

@@ -0,0 +1,102 @@
+<template>
+  <el-dialog :title="title" :close-on-click-modal="false" :visible.sync="open" width="1000px" append-to-body>
+    <el-row :gutter="10" class="mb8">
+      <right-toolbar @queryTable="getList"></right-toolbar>
+    </el-row>
+    <el-table v-loading="loading" :data="vipOrderList" >
+      <el-table-column label="订单号" align="center" prop="orderNo" show-overflow-tooltip/>
+      <el-table-column label="用户编号" align="center" prop="usercode" />
+      <el-table-column label="会员类型" align="center" prop="vipType" >
+        <template v-slot="scope">
+          <cai-dict-tag :options="vipTypeList" :value="scope.row.vipType" />
+        </template>
+      </el-table-column>
+      <el-table-column label="开通月份" align="center" prop="vipMonth" />
+      <el-table-column label="会员价格" align="center" prop="vipPrice" />
+      <el-table-column label="平台" align="center" prop="platformType" />
+      <el-table-column label="状态" align="center" prop="payStatus" >
+        <template v-slot="scope">
+          <cai-dict-tag :options="payStatusList" :value="scope.row.payStatus" />
+        </template>
+      </el-table-column>
+      <el-table-column label="操作时间" align="center" prop="createTime" width="160"/>
+      <el-table-column label="后台新增" align="center" prop="admin" >
+        <template v-slot="scope">
+          <cai-dict-tag :options="booleanList" :value="scope.row.admin" />
+        </template>
+      </el-table-column>
+      <el-table-column label="订单名称" align="center" prop="orderName" show-overflow-tooltip/>
+    </el-table>
+
+    <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+    />
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="open = false">取 消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { booleanList, payStatusList, vipTimeList, vipTypeList } from '@/constant/statusMap'
+import { listVipOrder } from '@/api/xq/vipOrder'
+
+export default {
+  components: {
+  },
+  data () {
+    return {
+      vipTypeList,vipTimeList,payStatusList,booleanList,
+      loading: true,
+      open: false,
+      title: '',
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // VIP订单表格数据
+      vipOrderList: [],
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        usedPay: true,
+        usercode: undefined,
+      },
+    }
+  },
+  created() {
+  },
+  methods: {
+    init (row) {
+      this.open = true;
+      this.queryParams.usercode = row.usercode
+      this.getList()
+      this.title = "会员开通记录"
+    },
+    /** 查询VIP订单列表 */
+    getList() {
+      this.loading = true;
+      listVipOrder(this.queryParams).then(response => {
+        this.vipOrderList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+  }
+}
+</script>