|
@@ -1,241 +1,132 @@
|
|
<template>
|
|
<template>
|
|
- <div class="app-container">
|
|
|
|
-
|
|
|
|
- <div class="mymain-container">
|
|
|
|
- <div class="btn-group clearfix" style="margin-bottom: 20px">
|
|
|
|
- <div class="fl">
|
|
|
|
- <el-button size="small" icon="el-icon-refresh" @click="getListByScreen">刷新</el-button>
|
|
|
|
- <el-button size="small" type="primary" icon="el-icon-plus" @click="addOrEdit('add')">添加团购活动</el-button>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
-
|
|
|
|
- <div class="tabs-container clearfix">
|
|
|
|
- <div class="fl">
|
|
|
|
- <el-tabs v-model="tabCurrent" type="card" @tab-click="getListByScreen">
|
|
|
|
- <el-tab-pane :name="key" v-for="(value, key, index) in tabList" :key="index">
|
|
|
|
- <div slot="label">{{value.name}}(<b style="color: red;">{{value.num}}</b>)</div>
|
|
|
|
- </el-tab-pane>
|
|
|
|
- </el-tabs>
|
|
|
|
- </div>
|
|
|
|
- <!-- <div class="fr">
|
|
|
|
- <el-date-picker
|
|
|
|
- v-model="screenForm.activityDate"
|
|
|
|
- @change="getListByScreen"
|
|
|
|
- type="daterange"
|
|
|
|
- size="small"
|
|
|
|
- style="margin-right: 20px; width: 260px !important;"
|
|
|
|
- value-format="yyyy-MM-dd"
|
|
|
|
- range-separator="至"
|
|
|
|
- start-placeholder="活动开始时间"
|
|
|
|
- end-placeholder="活动结束时间">
|
|
|
|
- </el-date-picker>
|
|
|
|
- <el-input placeholder="请输入活动名称进行搜索" v-model="screenForm.keyword" size="small" style="width: 240px; margin-top: 10px;" clearable>
|
|
|
|
- <el-button slot="append" icon="el-icon-search" size="small" @click="getListByScreen"></el-button>
|
|
|
|
- </el-input>
|
|
|
|
- </div> -->
|
|
|
|
|
|
+ <template-page ref="pageRef" :get-list="getList" :table-attributes="tableAttributes" :table-events="tableEvents"
|
|
|
|
+ :options-evens-group="optionsEvensGroup" :moreParameters="moreParameters" :column-parsing="columnParsing"
|
|
|
|
+ :operation="operation" :exportList="exportList">
|
|
|
|
+ <el-dialog title="" width="500px" custom-class="diy-dialog" append-to-body :modal="true" :visible.sync="formDialog"
|
|
|
|
+ :show-close="true" :close-on-click-modal="false" :modal-append-to-body="false" :before-close="formCancel">
|
|
|
|
+ <zj-form-container ref="formRef" :form-data="formData" :styleSwitch="false">
|
|
|
|
+ <zj-form-module :title="formDialogTitles[formDialogType]" label-width="100px" :showPackUp="false"
|
|
|
|
+ :form-data="formData" :form-items="formItems">
|
|
|
|
+ </zj-form-module>
|
|
|
|
+ </zj-form-container>
|
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
|
+ <el-button size="mini" @click="formCancel">取 消</el-button>
|
|
|
|
+ <el-button size="mini" @click="formConfirm" type="primary">确 定</el-button>
|
|
</div>
|
|
</div>
|
|
-
|
|
|
|
- <div class="table">
|
|
|
|
- <el-table v-loading="listLoading" :data="dataList" element-loading-text="Loading" border fit stripe>
|
|
|
|
- <el-table-column align="center" label="活动名称" prop="name" min-width="200"></el-table-column>
|
|
|
|
- <el-table-column align="center" label="参与产品数量" prop="goodsNum" min-width="120"></el-table-column>
|
|
|
|
- <el-table-column align="center" label="活动时间" min-width="200">
|
|
|
|
- <template slot-scope="scope">
|
|
|
|
- {{ scope.row.startTime | dateToDayFilter }} 至 {{ scope.row.endTime | dateToDayFilter }}
|
|
|
|
- </template>
|
|
|
|
- </el-table-column>
|
|
|
|
- <el-table-column align="center" label="状态">
|
|
|
|
- <template slot-scope="scope">
|
|
|
|
- {{ scope.row.status | statusFilter }}
|
|
|
|
- </template>
|
|
|
|
- </el-table-column>
|
|
|
|
- <el-table-column align="center" label="订单数量" prop="orderNum" min-width="120"></el-table-column>
|
|
|
|
- <el-table-column align="center" label="订单台数" prop="orderDetailNum" min-width="120"></el-table-column>
|
|
|
|
- <el-table-column align="center" label="订单总金额" prop="orderTotalAmount" min-width="120"></el-table-column>
|
|
|
|
- <el-table-column align="center" label="团长分佣总额" prop="shareTotalAmount" min-width="120"></el-table-column>
|
|
|
|
- <el-table-column align="center" label="商户" prop="companyName" min-width="120"></el-table-column>
|
|
|
|
- <el-table-column align="center" label="备注" prop="remark" min-width="200"></el-table-column>
|
|
|
|
- <el-table-column align="center" label="操作" width="240" fixed="right">
|
|
|
|
- <template slot-scope="scope">
|
|
|
|
- <el-button type="text" @click="addOrEdit('edit', scope.row.promotionGroupId)">编辑</el-button>
|
|
|
|
- <template>
|
|
|
|
- <el-popconfirm v-if="scope.row.status" style="margin: 0 10px;" title="确定关闭吗?" @onConfirm="changeActivityStatus(scope.row.promotionGroupId, false)" >
|
|
|
|
- <el-button slot="reference" type="text">关闭</el-button>
|
|
|
|
- </el-popconfirm>
|
|
|
|
- <el-popconfirm v-else style="margin: 0 10px;" title="确定开启吗?" @onConfirm="changeActivityStatus(scope.row.promotionGroupId, true)" >
|
|
|
|
- <el-button slot="reference" type="text">开启</el-button>
|
|
|
|
- </el-popconfirm>
|
|
|
|
- </template>
|
|
|
|
- <el-button type="text" @click="toDetail(scope.row.promotionGroupId)">拼团详情</el-button>
|
|
|
|
- <el-button type="text" @click="handleExport(scope.row.promotionGroupId)">导出订单</el-button>
|
|
|
|
- </template>
|
|
|
|
- </el-table-column>
|
|
|
|
- </el-table>
|
|
|
|
- </div>
|
|
|
|
- <div class="pagination clearfix">
|
|
|
|
- <div class="fr">
|
|
|
|
- <el-pagination
|
|
|
|
- @size-change="handleSizeChange"
|
|
|
|
- @current-change="handleCurrentChange"
|
|
|
|
- :current-page="currentPage"
|
|
|
|
- :page-sizes="[10, 20, 30, 50]"
|
|
|
|
- :page-size="10"
|
|
|
|
- layout="total, sizes, prev, pager, next, jumper"
|
|
|
|
- :total="listTotal">
|
|
|
|
- </el-pagination>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
|
|
+ </el-dialog>
|
|
|
|
+ </template-page>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
-import { getActivityCount, getActivityList, changeStatus } from '@/api/groupbuy'
|
|
|
|
-import { downloadFiles } from '@/utils/util'
|
|
|
|
-
|
|
|
|
|
|
+import TemplatePage from '@/components/template/template-page-1.vue'
|
|
|
|
+import import_mixin from '@/components/template/import_mixin.js'
|
|
|
|
+import { required, mobileRequired, mobile } from '@/components/template/rules_verify.js'
|
|
|
|
+import { orderShareListPageV2, orderSharePageExport, settlement, saveRemark } from "@/api/settlement";
|
|
export default {
|
|
export default {
|
|
- filters: {
|
|
|
|
- statusFilter(val) {
|
|
|
|
- const MAP = {
|
|
|
|
- true: '进行中',
|
|
|
|
- false: '已结束',
|
|
|
|
- }
|
|
|
|
- return MAP[val];
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
|
|
+ components: { TemplatePage },
|
|
|
|
+ mixins: [import_mixin],
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
- dataList: null, // 列表数据
|
|
|
|
- listLoading: true, // 列表加载loading
|
|
|
|
- currentPage: 1, // 当前页码
|
|
|
|
- pageSize: 10, // 每页数量
|
|
|
|
- listTotal: 0, // 列表总数
|
|
|
|
- tabCurrent: 'all',
|
|
|
|
- tabList: {
|
|
|
|
- all: {name: '全部', num: 0, state: ''},
|
|
|
|
- jxz: {name: '进行中', num: 0, state: true},
|
|
|
|
- yjs: {name: '已结束', num: 0, state: false},
|
|
|
|
|
|
+ // 事件组合
|
|
|
|
+ optionsEvensGroup: [],
|
|
|
|
+ // 表格属性
|
|
|
|
+ tableAttributes: {
|
|
|
|
+ // 启用勾选列
|
|
|
|
+ selectColumn: false
|
|
|
|
+ },
|
|
|
|
+ // 表格事件
|
|
|
|
+ tableEvents: {
|
|
|
|
+ 'selection-change': this.selectionChange
|
|
},
|
|
},
|
|
- screenForm: {
|
|
|
|
- keyword: '',
|
|
|
|
- activityDate: '',
|
|
|
|
|
|
+ // 勾选选中行
|
|
|
|
+ recordSelected: [],
|
|
|
|
+ /** 表单变量 */
|
|
|
|
+ formDialogType: 0,
|
|
|
|
+ formDialogTitles: ["备注"],
|
|
|
|
+ formDialog: false,
|
|
|
|
+ formData: {
|
|
|
|
+ remark: '',
|
|
},
|
|
},
|
|
}
|
|
}
|
|
},
|
|
},
|
|
- created() {
|
|
|
|
- this.getCount();
|
|
|
|
- this.getList();
|
|
|
|
|
|
+ computed: {
|
|
|
|
+ // 更多参数
|
|
|
|
+ moreParameters() {
|
|
|
|
+ return []
|
|
|
|
+ },
|
|
|
|
+ formItems() {
|
|
|
|
+ return [{
|
|
|
|
+ md: 24,
|
|
|
|
+ isShow: true,
|
|
|
|
+ name: 'el-input',
|
|
|
|
+ attributes: { placeholder: '请输入', type: "textarea", maxlength: "100" },
|
|
|
|
+ formItemAttributes: {
|
|
|
|
+ label: '备注',
|
|
|
|
+ prop: 'remark',
|
|
|
|
+ rules: [...required]
|
|
|
|
+ }
|
|
|
|
+ }]
|
|
|
|
+ }
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
- // 获取统计
|
|
|
|
- getCount() {
|
|
|
|
- getActivityCount().then(res => {
|
|
|
|
- this.tabList.all.num = res.data.all;
|
|
|
|
- this.tabList.jxz.num = res.data.jxz;
|
|
|
|
- this.tabList.yjs.num = res.data.yjs;
|
|
|
|
- })
|
|
|
|
|
|
+ // 列表请求函数
|
|
|
|
+ getList: orderShareListPageV2,
|
|
|
|
+ // 列表导出函数
|
|
|
|
+ exportList: orderSharePageExport,
|
|
|
|
+ // 表格列解析渲染数据更改
|
|
|
|
+ columnParsing(item, defaultData) {
|
|
|
|
+ return defaultData
|
|
},
|
|
},
|
|
-
|
|
|
|
- // 获取活动列表
|
|
|
|
- getList() {
|
|
|
|
- getActivityList({
|
|
|
|
- pageNum: this.currentPage,
|
|
|
|
- pageSize: this.pageSize,
|
|
|
|
- status: this.tabList[this.tabCurrent].state,
|
|
|
|
- // keyword: this.screenForm.keyword,
|
|
|
|
- // startTime: this.screenForm.activityDate ? this.screenForm.activityDate[0] + ' 00:00:00' : '',
|
|
|
|
- // endTime: this.screenForm.activityDate ? this.screenForm.activityDate[1] + ' 23:59:59' : '',
|
|
|
|
- }).then(res => {
|
|
|
|
- this.dataList = res.data.records;
|
|
|
|
- this.listTotal = res.data.total;
|
|
|
|
- this.listLoading = false;
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- // 筛选后重新获取列表
|
|
|
|
- getListByScreen() {
|
|
|
|
- this.currentPage = 1;
|
|
|
|
- this.getCount();
|
|
|
|
- this.getList();
|
|
|
|
|
|
+ // 监听勾选变化
|
|
|
|
+ selectionChange(data) {
|
|
|
|
+ this.recordSelected = data
|
|
},
|
|
},
|
|
-
|
|
|
|
- // 更改活动列表每页数量
|
|
|
|
- handleSizeChange(val) {
|
|
|
|
- this.pageSize = val;
|
|
|
|
- this.currentPage = 1;
|
|
|
|
- this.getList();
|
|
|
|
|
|
+ // 表格操作列
|
|
|
|
+ operation(h, { row, index, column }) {
|
|
|
|
+ return (
|
|
|
|
+ <div class='operation-btns'>
|
|
|
|
+ <el-button type="text" onClick={() => {
|
|
|
|
+ Object.assign(this.formData, row)
|
|
|
|
+ this.formDialogType = 0
|
|
|
|
+ this.openForm()
|
|
|
|
+ }}>备注</el-button>
|
|
|
|
+ {row.orderStatus == 'OVER' && row.status == 'ING' ? <el-popconfirm
|
|
|
|
+ title="是否确定结算?"
|
|
|
|
+ onConfirm={() => {
|
|
|
|
+ settlement({
|
|
|
|
+ orderId: row.orderId
|
|
|
|
+ }).then(res => {
|
|
|
|
+ this.$message({ type: 'success', message: `结算成功!` })
|
|
|
|
+ this.$refs.pageRef.refreshList()
|
|
|
|
+ })
|
|
|
|
+ }}
|
|
|
|
+ >
|
|
|
|
+ <el-button type="text" slot="reference">结算</el-button>
|
|
|
|
+ </el-popconfirm> : null}
|
|
|
|
+ </div>
|
|
|
|
+ )
|
|
},
|
|
},
|
|
-
|
|
|
|
- // 更改活动列表当前页
|
|
|
|
- handleCurrentChange(val) {
|
|
|
|
- this.currentPage = val;
|
|
|
|
- this.getList();
|
|
|
|
|
|
+ openForm() {
|
|
|
|
+ this.formDialog = true;
|
|
},
|
|
},
|
|
-
|
|
|
|
- // 添加活动
|
|
|
|
- addOrEdit(type, id) {
|
|
|
|
- if(type == 'add') {
|
|
|
|
- this.$router.push({
|
|
|
|
- name:"groupbuy_add",
|
|
|
|
- query: {}
|
|
|
|
- })
|
|
|
|
- }else {
|
|
|
|
- this.$router.push({
|
|
|
|
- name:"groupbuy_add",
|
|
|
|
- query: {
|
|
|
|
- id
|
|
|
|
- }
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
|
|
+ formCancel() {
|
|
|
|
+ this.$refs.formRef.$refs.inlineForm.clearValidate()
|
|
|
|
+ this.$data.formData = this.$options.data().formData
|
|
|
|
+ this.formDialog = false
|
|
},
|
|
},
|
|
-
|
|
|
|
- // 操作 - 更改活动状态(type: 禁用0,启用1)
|
|
|
|
- changeActivityStatus(id, type) {
|
|
|
|
- changeStatus({promotionGroupId: id, status: type}).then(res => {
|
|
|
|
- this.getCount();
|
|
|
|
- this.getList();
|
|
|
|
- this.$successMsg();
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- // 去详情
|
|
|
|
- toDetail(id) {
|
|
|
|
- this.$router.push({
|
|
|
|
- name:"groupbuy_detail",
|
|
|
|
- query: {
|
|
|
|
- id
|
|
|
|
|
|
+ formConfirm() {
|
|
|
|
+ this.$refs.formRef.validate((valid, invalidFields, errLabels) => {
|
|
|
|
+ if (valid) {
|
|
|
|
+ ([saveRemark][this.formDialogType])(this.formData).then(res => {
|
|
|
|
+ this.$message({ type: 'success', message: `${this.formDialogTitles[this.formDialogType]}成功!` })
|
|
|
|
+ this.formCancel()
|
|
|
|
+ this.$refs.pageRef.refreshList()
|
|
|
|
+ })
|
|
}
|
|
}
|
|
})
|
|
})
|
|
- },
|
|
|
|
-
|
|
|
|
- // 导出
|
|
|
|
- handleExport(id) {
|
|
|
|
- let screenData = {
|
|
|
|
- promotionGroupId: id
|
|
|
|
- };
|
|
|
|
- downloadFiles('order/export', screenData);
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
|
|
|
|
-<style scoped>
|
|
|
|
- .app-container >>> .el-tabs__header {
|
|
|
|
- margin-bottom: 0;
|
|
|
|
- }
|
|
|
|
- .app-container >>> .el-tabs__nav-wrap::after {
|
|
|
|
- background: none;
|
|
|
|
- }
|
|
|
|
- .app-container >>> #tab-activity, .app-container >>> #tab-goods {
|
|
|
|
- font-size: 16px;
|
|
|
|
- }
|
|
|
|
- .table >>> .el-tag {
|
|
|
|
- margin-right: 6px;
|
|
|
|
- }
|
|
|
|
- .table >>> .el-tag:last-child {
|
|
|
|
- margin-right: 0;
|
|
|
|
- }
|
|
|
|
-</style>
|
|
|
|
|
|
+<style lang="scss" scoped></style>
|