market_api_929

2022-09-29 11:02:16 +08:00
parent a42deadb0b
commit 94624666d1
9 changed files with 311 additions and 157 deletions
@@ -14,6 +14,32 @@ export async function pageActivity(params) {
  return Promise.reject(new Error(res.data.message));
 }

+/**
+ * 分页查询活动订单
+ * @param params 查询条件
+ */
+export async function pageOrder(params) {
+  const res = await request.get('/sylive/activity/order', {
+    params
+  });
+  if (res.data.code === 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+/**
+ * 根据id查询活动
+ * @param id 活动id
+ */
+export async function getActivity(id) {
+  const res = await request.get('/sylive/activity/' + id);
+  if (res.data.code === 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
 /**
 * 查询活动列表
 * @param params 查询条件
@@ -13,10 +13,6 @@
    <div class="ele-admin-header-tool-item">
      <i18n-icon />
    </div>
-    <!-- 消息通知 -->
-    <div class="ele-admin-header-tool-item">
-      <header-notice />
-    </div>
    <!-- 用户信息 -->
    <div class="ele-admin-header-tool-item">
      <el-dropdown @command="onUserDropClick">
@@ -56,14 +52,13 @@
 </template>

 <script>
-  import HeaderNotice from './header-notice.vue';
  import PasswordModal from './password-modal.vue';
  import SettingDrawer from './setting-drawer.vue';
  import I18nIcon from './i18n-icon.vue';
  import { logout } from '@/utils/page-tab-util';

  export default {
-    components: { HeaderNotice, PasswordModal, SettingDrawer, I18nIcon },
+    components: { PasswordModal, SettingDrawer, I18nIcon },
    props: {
      // 是否是全屏
      fullscreen: Boolean
@@ -51,6 +51,14 @@
          >
            统计
          </el-link>
+          <el-link
+            type="primary"
+            :underline="false"
+            icon="el-icon-shopping-cart-full"
+            @click="openOrder(row.activityId)"
+          >
+            订单
+          </el-link>
          <el-link
            type="primary"
            :underline="false"
@@ -173,13 +181,6 @@
            showOverflowTooltip: true,
            minWidth: 100
          },
-          {
-            prop: 'e_time',
-            label: '直播结束时间',
-            sortable: 'custom',
-            showOverflowTooltip: true,
-            minWidth: 100
-          },
          {
            prop: 'createTime',
            label: '创建时间',
@@ -203,7 +204,7 @@
          {
            columnKey: 'action',
            label: '操作',
-            width: 330,
+            width: 380,
            align: 'center',
            resizable: false,
            slot: 'action'
@@ -269,6 +270,10 @@
      openStatistics(activityId) {
        this.$router.replace('/sylive/activity/statistics?id=' + activityId);
      },
+      /* 打开活动订单页 */
+      openOrder(activityId) {
+        this.$router.replace('/sylive/activity/order?id=' + activityId);
+      },
      /* 删除 */
      remove(row) {
        const loading = this.$loading({ lock: true });
@@ -0,0 +1,94 @@
+<!-- 搜索表单 -->
+<template>
+  <el-form
+    label-width="77px"
+    class="ele-form-search"
+    @keyup.enter.native="search"
+    @submit.native.prevent
+  >
+    <el-row :gutter="15">
+      <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+        <el-form-item label="订单号:">
+          <el-input clearable v-model="where.sid" placeholder="请输入" />
+        </el-form-item>
+      </el-col>
+      <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+        <el-form-item label="姓名:">
+          <el-input clearable v-model="where.name" placeholder="请输入" />
+        </el-form-item>
+      </el-col>
+      <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+        <el-form-item label="手机号:">
+          <el-input clearable v-model="where.mobile" placeholder="请输入" />
+        </el-form-item>
+      </el-col>
+      <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+        <el-form-item label="商品标题:">
+          <el-input clearable v-model="where.item_title" placeholder="请输入" />
+        </el-form-item>
+      </el-col>
+      <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+        <el-form-item label="状态:">
+          <el-select
+            clearable
+            v-model="where.status"
+            placeholder="请选择"
+            class="ele-fluid"
+          >
+            <el-option label="未支付" :value="0" />
+            <el-option label="已支付" :value="1" />
+          </el-select>
+        </el-form-item>
+      </el-col>
+      <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+        <div class="ele-form-actions">
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            class="ele-btn-icon"
+            @click="search"
+          >
+            查询
+          </el-button>
+          <el-button @click="reset">重置</el-button>
+        </div>
+      </el-col>
+    </el-row>
+  </el-form>
+</template>
+
+<script>
+  export default {
+    data() {
+      // 默认表单数据
+      const defaultWhere = {
+        status: 1,
+        name: '',
+        mobile: '',
+        sid: '',
+        item_title: ''
+      };
+      return {
+        // 表单数据
+        where: { ...defaultWhere }
+      };
+    },
+    computed: {
+      // 是否开启响应式布局
+      styleResponsive() {
+        return this.$store.state.theme.styleResponsive;
+      }
+    },
+    methods: {
+      /* 搜索 */
+      search() {
+        this.$emit('search', this.where);
+      },
+      /*  重置 */
+      reset() {
+        this.where = { ...this.defaultWhere };
+        this.search();
+      }
+    }
+  };
+</script>
@@ -0,0 +1,148 @@
+<template>
+  <div class="ele-body">
+    <el-card shadow="never">
+      <!-- 搜索表单 -->
+      <order-search @search="reload" />
+      <!-- 数据表格 -->
+      <ele-pro-table
+        ref="table"
+        :columns="columns"
+        :datasource="datasource"
+        cache-key="syliveOrderTable"
+      >
+        <!-- 表头工具栏 -->
+      </ele-pro-table>
+    </el-card>
+  </div>
+</template>
+
+<script>
+  import { setPageTabTitle } from '@/utils/page-tab-util';
+  import OrderSearch from './components/order-search.vue';
+  import { getActivity, pageOrder } from '@/api/sylive/activity';
+  const ROUTE_PATH = '/sylive/activity/order';
+
+  export default {
+    name: 'syliveActivityOrder',
+    components: { OrderSearch },
+    data() {
+      return {
+        // 加载状态
+        loading: true,
+        // 表格列配置
+        columns: [
+          {
+            columnKey: 'index',
+            type: 'index',
+            width: 45,
+            align: 'center',
+            showOverflowTooltip: true,
+            fixed: 'left'
+          },
+          {
+            prop: 'sid',
+            label: '订单号',
+            showOverflowTooltip: true,
+            minWidth: 140
+          },
+          {
+            prop: 'name',
+            label: '姓名',
+            showOverflowTooltip: true,
+            minWidth: 80
+          },
+          {
+            prop: 'mobile',
+            label: '手机号',
+            showOverflowTooltip: true,
+            minWidth: 80
+          },
+          {
+            prop: 'item_title',
+            label: '商品标题',
+            sortable: 'custom',
+            showOverflowTooltip: true,
+            minWidth: 150
+          },
+          {
+            prop: 'total_price',
+            label: '订单价格',
+            sortable: 'custom',
+            showOverflowTooltip: true,
+            minWidth: 80
+          },
+          {
+            prop: 'pay_time',
+            label: '付款时间',
+            sortable: 'custom',
+            showOverflowTooltip: true,
+            minWidth: 120,
+            formatter: (_row, _column, cellValue) => {
+              return this.$util.toDateString(cellValue);
+            }
+          },
+          {
+            prop: 'createTime',
+            label: '创建时间',
+            sortable: 'custom',
+            showOverflowTooltip: true,
+            minWidth: 120,
+            formatter: (_row, _column, cellValue) => {
+              return this.$util.toDateString(cellValue);
+            }
+          },
+          {
+            prop: 'statusName',
+            label: '状态',
+            sortable: 'custom',
+            showOverflowTooltip: true,
+            minWidth: 80
+          }
+        ]
+      };
+    },
+    methods: {
+      /* 表格数据源 */
+      datasource({ page, limit, where, order }) {
+        const activityId = this.$route.query.id;
+        return pageOrder({ ...where, ...order, page, limit, activityId });
+      },
+      query() {
+        const id = this.$route.query.id;
+        if (!id) {
+          return;
+        }
+        this.loading = true;
+        getActivity(Number(id))
+          .then((data) => {
+            this.loading = false;
+            // 修改页签标题
+            if (this.$route.path === ROUTE_PATH) {
+              setPageTabTitle(data.title + '的订单');
+            }
+          })
+          .catch((e) => {
+            this.loading = false;
+            this.$message.error(e.message);
+          });
+      },
+      /* 刷新表格 */
+      reload(where) {
+        this.$refs.table.reload({ page: 1, where: where });
+      }
+    },
+    watch: {
+      $route: {
+        handler(route) {
+          const { path } = route;
+          if (path !== ROUTE_PATH) {
+            return;
+          }
+          this.query();
+          this.$refs.table.reload({ page: 1 });
+        },
+        immediate: true
+      }
+    }
+  };
+</script>
@@ -201,56 +201,6 @@
    name: 'SyliveActivityStatistics',
    data() {
      return {
-        projectList: [
-          {
-            id: 1,
-            projectName: '项目0000001',
-            status: 0,
-            startDate: '2020-03-01',
-            endDate: '2020-06-01',
-            progress: 30
-          },
-          {
-            id: 2,
-            projectName: '项目0000002',
-            status: 0,
-            startDate: '2020-03-01',
-            endDate: '2020-08-01',
-            progress: 10
-          },
-          {
-            id: 3,
-            projectName: '项目0000003',
-            status: 1,
-            startDate: '2020-01-01',
-            endDate: '2020-05-01',
-            progress: 60
-          },
-          {
-            id: 4,
-            projectName: '项目0000004',
-            status: 1,
-            startDate: '2020-06-01',
-            endDate: '2020-10-01',
-            progress: 0
-          },
-          {
-            id: 5,
-            projectName: '项目0000005',
-            status: 2,
-            startDate: '2020-01-01',
-            endDate: '2020-03-01',
-            progress: 100
-          },
-          {
-            id: 6,
-            projectName: '项目0000006',
-            status: 3,
-            startDate: '2020-01-01',
-            endDate: '2020-03-01',
-            progress: 100
-          }
-        ],
        statistics: {
          activityId: null,
          activityData: [],
@@ -7,6 +7,11 @@
    @submit.native.prevent
  >
    <el-row :gutter="15">
+      <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+        <el-form-item label="订单号:">
+          <el-input clearable v-model="where.sid" placeholder="请输入" />
+        </el-form-item>
+      </el-col>
      <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
        <el-form-item label="姓名:">
          <el-input clearable v-model="where.name" placeholder="请输入" />
@@ -22,6 +27,19 @@
          <el-input clearable v-model="where.item_title" placeholder="请输入" />
        </el-form-item>
      </el-col>
+      <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+        <el-form-item label="状态:">
+          <el-select
+            clearable
+            v-model="where.status"
+            placeholder="请选择"
+            class="ele-fluid"
+          >
+            <el-option label="未支付" :value="0" />
+            <el-option label="已支付" :value="1" />
+          </el-select>
+        </el-form-item>
+      </el-col>
      <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
        <div class="ele-form-actions">
          <el-button
@@ -44,8 +62,10 @@
    data() {
      // 默认表单数据
      const defaultWhere = {
+        status: 1,
        name: '',
        mobile: '',
+        sid: '',
        item_title: ''
      };
      return {
@@ -37,6 +37,12 @@
            showOverflowTooltip: true,
            fixed: 'left'
          },
+          {
+            prop: 'sid',
+            label: '订单号',
+            showOverflowTooltip: true,
+            minWidth: 140
+          },
          {
            prop: 'name',
            label: '姓名',
@@ -47,7 +53,7 @@
            prop: 'mobile',
            label: '手机号',
            showOverflowTooltip: true,
-            minWidth: 100
+            minWidth: 80
          },
          {
            prop: 'item_title',
@@ -61,7 +67,7 @@
            label: '订单价格',
            sortable: 'custom',
            showOverflowTooltip: true,
-            minWidth: 100
+            minWidth: 80
          },
          {
            prop: 'pay_time',
@@ -88,7 +94,7 @@
            label: '状态',
            sortable: 'custom',
            showOverflowTooltip: true,
-            minWidth: 100
+            minWidth: 80
          }
        ]
      };
@@ -11,36 +11,6 @@
            <h2 class="user-info-name">{{ loginUser.nickname }}</h2>
            <div class="user-info-desc">{{ loginUser.introduction }}</div>
          </div>
-          <div class="user-info-list">
-            <div class="user-info-item">
-              <i class="el-icon-user"></i>
-              <span>资深前端工程师</span>
-            </div>
-            <div class="user-info-item">
-              <i class="el-icon-office-building"></i>
-              <span>某某公司 - 某某事业群 - 某某技术部</span>
-            </div>
-            <div class="user-info-item">
-              <i class="el-icon-location-information"></i>
-              <span>中国 • 浙江省 • 杭州市</span>
-            </div>
-            <div class="user-info-item">
-              <i class="el-icon-_school"></i>
-              <span>JavaScript、HTML、CSS</span>
-            </div>
-          </div>
-          <div style="margin: 30px 0 20px 0">
-            <el-divider class="ele-divider-dashed ele-divider-base" />
-          </div>
-          <h6 class="ele-text" style="margin-bottom: 8px">标签</h6>
-          <div class="user-info-tags">
-            <el-tag size="mini" type="info">很有想法的</el-tag>
-            <el-tag size="mini" type="info">专注设计</el-tag>
-            <el-tag size="mini" type="info">辣~</el-tag>
-            <el-tag size="mini" type="info">大长腿</el-tag>
-            <el-tag size="mini" type="info">川妹子</el-tag>
-            <el-tag size="mini" type="info">海纳百川</el-tag>
-          </div>
        </el-card>
      </el-col>
      <el-col v-bind="styleResponsive ? { md: 18, sm: 16 } : { span: 18 }">
@@ -115,66 +85,6 @@
                </el-form-item>
              </el-form>
            </el-tab-pane>
-            <el-tab-pane label="账号绑定" name="account">
-              <div class="user-account-list">
-                <div class="user-account-item ele-cell">
-                  <div class="ele-cell-content">
-                    <div>密保手机</div>
-                    <div class="ele-text-secondary">
-                      已绑定手机: 138****8293
-                    </div>
-                  </div>
-                  <el-link type="primary" :underline="false">去修改</el-link>
-                </div>
-                <el-divider />
-                <div class="user-account-item ele-cell">
-                  <div class="ele-cell-content">
-                    <div>密保邮箱</div>
-                    <div class="ele-text-secondary">
-                      已绑定邮箱: eleadmin@eclouds.com
-                    </div>
-                  </div>
-                  <el-link type="primary" :underline="false">去修改</el-link>
-                </div>
-                <el-divider />
-                <div class="user-account-item ele-cell">
-                  <div class="ele-cell-content">
-                    <div>密保问题</div>
-                    <div class="ele-text-secondary">未设置密保问题</div>
-                  </div>
-                  <el-link type="primary" :underline="false">去设置</el-link>
-                </div>
-                <el-divider />
-                <div class="user-account-item ele-cell">
-                  <i class="user-account-icon el-icon-_qq"></i>
-                  <div class="ele-cell-content">
-                    <div>绑定QQ</div>
-                    <div class="ele-text-secondary">当前未绑定QQ账号</div>
-                  </div>
-                  <el-link type="primary" :underline="false">去绑定</el-link>
-                </div>
-                <el-divider />
-                <div class="user-account-item ele-cell">
-                  <i class="user-account-icon el-icon-_wechat"></i>
-                  <div class="ele-cell-content">
-                    <div>绑定微信</div>
-                    <div class="ele-text-secondary">当前未绑定绑定微信账号</div>
-                  </div>
-                  <el-link type="primary" :underline="false">去绑定</el-link>
-                </div>
-                <el-divider />
-                <div class="user-account-item ele-cell">
-                  <i class="user-account-icon el-icon-_alipay"></i>
-                  <div class="ele-cell-content">
-                    <div>绑定支付宝</div>
-                    <div class="ele-text-secondary">
-                      当前未绑定绑定支付宝账号
-                    </div>
-                  </div>
-                  <el-link type="primary" :underline="false">去绑定</el-link>
-                </div>
-              </div>
-            </el-tab-pane>
          </el-tabs>
        </el-card>
      </el-col>