|
@@ -1,158 +1,184 @@
|
|
|
<template>
|
|
|
- <div class="m-container">
|
|
|
- <h2>
|
|
|
- <div class="squrt"></div>营销活动
|
|
|
- </h2>
|
|
|
+ <div class="m-container">
|
|
|
+ <h2>
|
|
|
+ <div class="squrt"></div>
|
|
|
+ 营销活动
|
|
|
+ </h2>
|
|
|
|
|
|
- <div class="m-core">
|
|
|
- <el-button type="primary" class='newBand' @click="() => { operationType = 'create'; marketVisible = true }">添加营销活动</el-button>
|
|
|
- <save-form
|
|
|
- ref="searchForm"
|
|
|
- :inline="true"
|
|
|
- :model="searchForm"
|
|
|
- @submit="search"
|
|
|
- @reset="onReSet"
|
|
|
- >
|
|
|
- <el-form-item prop="search">
|
|
|
- <el-input
|
|
|
- v-model="searchForm.search"
|
|
|
- clearable
|
|
|
- placeholder="活动名称/活动编号"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- <!-- <el-form-item prop="search">
|
|
|
+ <div class="m-core">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ class="newBand"
|
|
|
+ @click="
|
|
|
+ () => {
|
|
|
+ operationType = 'create';
|
|
|
+ marketVisible = true;
|
|
|
+ }
|
|
|
+ "
|
|
|
+ >添加营销活动</el-button
|
|
|
+ >
|
|
|
+ <save-form
|
|
|
+ ref="searchForm"
|
|
|
+ :inline="true"
|
|
|
+ :model="searchForm"
|
|
|
+ @submit="search"
|
|
|
+ @reset="onReSet"
|
|
|
+ >
|
|
|
+ <el-form-item prop="search">
|
|
|
+ <el-input
|
|
|
+ v-model="searchForm.search"
|
|
|
+ clearable
|
|
|
+ placeholder="活动名称/活动编号"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <!-- <el-form-item prop="search">
|
|
|
<el-input
|
|
|
v-model="searchForm.activityIds"
|
|
|
clearable
|
|
|
placeholder="关联活动方案"
|
|
|
/>
|
|
|
</el-form-item> -->
|
|
|
- <el-form-item>
|
|
|
- <el-button native-type="submit" type="primary">搜索</el-button>
|
|
|
- <el-button native-type="reset" type="danger">重置</el-button>
|
|
|
- </el-form-item>
|
|
|
- </save-form>
|
|
|
-
|
|
|
- <el-table
|
|
|
- style="width: 100%"
|
|
|
- :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
|
|
|
- :data="tableList"
|
|
|
- >
|
|
|
- <el-table-column align="center" prop="id" label="营销活动编号" width="200">
|
|
|
- <template slot-scope="scope">
|
|
|
- <div>
|
|
|
- <copy-text>{{ scope.row.id }}</copy-text>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column align="center" prop="name" label="活动名称">
|
|
|
- <template slot-scope="scope">
|
|
|
- <copy-text>{{ scope.row.name }}</copy-text>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column align="center" prop="activityIds" label="关联活动方案">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{ scope.row.activityIds }}
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- width="180px"
|
|
|
- label="操作"
|
|
|
- fixed="right"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button type="text" @click="onUpdate(scope.row)">修改</el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <pagination
|
|
|
- sync
|
|
|
- :total.sync="rules.total"
|
|
|
- :page.sync="rules.page"
|
|
|
- :limit.sync="rules.limit"
|
|
|
- :page-sizes="rules.page_size"
|
|
|
- @pagination="FetchList"
|
|
|
- />
|
|
|
- </div>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button native-type="submit" type="primary">搜索</el-button>
|
|
|
+ <el-button native-type="reset" type="danger">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </save-form>
|
|
|
|
|
|
- <el-dialog
|
|
|
- :title="(operationType == 'create' ? '添加' : '修改') + '营销活动'"
|
|
|
- :visible.sync="marketVisible"
|
|
|
- width="550px"
|
|
|
- v-if="marketVisible"
|
|
|
+ <el-table
|
|
|
+ style="width: 100%"
|
|
|
+ :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
|
|
|
+ :data="tableList"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="id"
|
|
|
+ label="营销活动编号"
|
|
|
+ width="200"
|
|
|
>
|
|
|
- <market-form
|
|
|
- :marketId="marketId"
|
|
|
- :operationType="operationType"
|
|
|
- @submited="FetchList"
|
|
|
- @close="marketVisible = false"
|
|
|
- />
|
|
|
- </el-dialog>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ <copy-text>{{ scope.row.id }}</copy-text>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column align="center" prop="name" label="活动名称">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <copy-text>{{ scope.row.name }}</copy-text>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column align="center" prop="activityIds" label="关联活动方案">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ scope.row.activityIds }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ width="180px"
|
|
|
+ label="操作"
|
|
|
+ fixed="right"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button type="text" @click="onUpdate(scope.row)">修改</el-button>
|
|
|
+ <el-button type="text" @click="lookDetail(scope.row)"
|
|
|
+ >详情</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <pagination
|
|
|
+ sync
|
|
|
+ :total.sync="rules.total"
|
|
|
+ :page.sync="rules.page"
|
|
|
+ :limit.sync="rules.limit"
|
|
|
+ :page-sizes="rules.page_size"
|
|
|
+ @pagination="FetchList"
|
|
|
+ />
|
|
|
</div>
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ :title="(operationType == 'create' ? '添加' : '修改') + '营销活动'"
|
|
|
+ :visible.sync="marketVisible"
|
|
|
+ width="550px"
|
|
|
+ v-if="marketVisible"
|
|
|
+ >
|
|
|
+ <market-form
|
|
|
+ :marketId="marketId"
|
|
|
+ :operationType="operationType"
|
|
|
+ @submited="FetchList"
|
|
|
+ @close="marketVisible = false"
|
|
|
+ />
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import saveForm from "@/components/save-form";
|
|
|
import pagination from "@/components/Pagination/index";
|
|
|
-import marketForm from './modals/market'
|
|
|
-import { marketActivityQueryPage } from './api'
|
|
|
+import marketForm from "./modals/market";
|
|
|
+import { marketActivityQueryPage } from "./api";
|
|
|
export default {
|
|
|
- components: {
|
|
|
- saveForm,
|
|
|
- pagination,
|
|
|
- marketForm
|
|
|
+ components: {
|
|
|
+ saveForm,
|
|
|
+ pagination,
|
|
|
+ marketForm,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ operationType: "create",
|
|
|
+ marketVisible: false,
|
|
|
+ marketId: null,
|
|
|
+ searchForm: {
|
|
|
+ search: null,
|
|
|
+ activityIds: null,
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ // 分页规则
|
|
|
+ limit: 10, // 限制显示条数
|
|
|
+ page: 1, // 当前页
|
|
|
+ total: 0, // 总条数
|
|
|
+ page_size: [10, 20, 40, 50], // 选择限制显示条数
|
|
|
+ },
|
|
|
+ tableList: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.FetchList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ search() {
|
|
|
+ this.rules.page = 1;
|
|
|
+ this.FetchList();
|
|
|
+ },
|
|
|
+ onReSet() {
|
|
|
+ this.$refs.searchForm.resetFields();
|
|
|
+ this.rules.page = 1;
|
|
|
+ this.FetchList();
|
|
|
+ },
|
|
|
+ async FetchList() {
|
|
|
+ try {
|
|
|
+ let res = await marketActivityQueryPage({
|
|
|
+ ...this.searchForm,
|
|
|
+ page: this.rules.page,
|
|
|
+ rows: this.rules.limit,
|
|
|
+ });
|
|
|
+ this.tableList = res.data.rows || [];
|
|
|
+ this.rules.total = res.data.total;
|
|
|
+ } catch {
|
|
|
+ //
|
|
|
+ }
|
|
|
},
|
|
|
- data() {
|
|
|
- return {
|
|
|
- operationType: 'create',
|
|
|
- marketVisible: false,
|
|
|
- marketId: null,
|
|
|
- searchForm: {
|
|
|
- search: null,
|
|
|
- activityIds: null
|
|
|
- },
|
|
|
- rules: {
|
|
|
- // 分页规则
|
|
|
- limit: 10, // 限制显示条数
|
|
|
- page: 1, // 当前页
|
|
|
- total: 0, // 总条数
|
|
|
- page_size: [10, 20, 40, 50], // 选择限制显示条数
|
|
|
- },
|
|
|
- tableList: [],
|
|
|
- }
|
|
|
+ onUpdate(row) {
|
|
|
+ this.marketId = row.id;
|
|
|
+ this.operationType = "update";
|
|
|
+ this.marketVisible = true;
|
|
|
},
|
|
|
- mounted() {
|
|
|
- this.FetchList()
|
|
|
+ lookDetail(row) {
|
|
|
+ if (row.id == 1) {
|
|
|
+ this.$router.push("/2021memeberActionManager");
|
|
|
+ } else if (row.id == 2) {
|
|
|
+ this.$router.push("/2021double11List");
|
|
|
+ }
|
|
|
},
|
|
|
- methods: {
|
|
|
- search() {
|
|
|
- this.rules.page = 1
|
|
|
- this.FetchList()
|
|
|
- },
|
|
|
- onReSet() {
|
|
|
- this.$refs.searchForm.resetFields();
|
|
|
- this.rules.page = 1
|
|
|
- this.FetchList();
|
|
|
- },
|
|
|
- async FetchList() {
|
|
|
- try {
|
|
|
- let res = await marketActivityQueryPage({
|
|
|
- ...this.searchForm,
|
|
|
- page: this.rules.page,
|
|
|
- rows: this.rules.limit
|
|
|
- })
|
|
|
- this.tableList = res.data.rows || []
|
|
|
- this.rules.total = res.data.total
|
|
|
- } catch {
|
|
|
- //
|
|
|
- }
|
|
|
- },
|
|
|
- onUpdate(row) {
|
|
|
- this.marketId = row.id
|
|
|
- this.operationType = 'update'
|
|
|
- this.marketVisible = true
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|