bnyer
/
bnyer-cloud-page
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

feature:新增权益界面

master
chengkun 2 years ago
parent
1b9cf15173
commit
c45531365e
7 changed files with 555 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 17
      src/api/rights/aliPayOrder.js
  2. 17
      src/api/rights/aliPaySigningOrder.js
  3. 26
      src/api/rights/configService.js
  4. 25
      src/api/rights/link.js
  5. 17
      src/api/rights/rightsOrder.js
  6. 2
      src/utils/request.js
  7. 451
      src/views/rights/aliPayOrder/index.vue

17
src/api/rights/aliPayOrder.js
View File

@ -0,0 +1,17 @@
import request from '@/utils/request'
const serviceTitle = 'http://localhost:8085/rights';
const prefix = '/aliPayOrder';
// 查询用户支付记录分页
export function listAliPayOrder(data) {
return request({
url: `${serviceTitle}${prefix}/page`,
method: 'post',
data: data
})
}

17
src/api/rights/aliPaySigningOrder.js
View File

@ -0,0 +1,17 @@
import request from '@/utils/request'
const serviceTitle = 'http://localhost:8085/rights';
const prefix = '/aliPaySigningOrder';
// 查询用户签约记录分页
export function listaliPaySigningOrder(data) {
return request({
url: `${serviceTitle}${prefix}/page`,
method: 'post',
data: data
})
}

26
src/api/rights/configService.js
View File

@ -0,0 +1,26 @@
import request from '@/utils/request'
const serviceTitle = 'http://localhost:8085/rights';
const prefix = '/configService';
// 查询对应的配置内容
export function listConfigService(configName) {
return request({
url: `${serviceTitle}${prefix}/list`,
method: 'post',
data: configName
})
}
// 修改对应的配置内容
export function editConfigService(data) {
return request({
url: `${serviceTitle}${prefix}/update`,
method: 'post' ,
data: data
})
}

25
src/api/rights/link.js
View File

@ -0,0 +1,25 @@
import request from '@/utils/request'
const serviceTitle = 'http://localhost:8085/rights';
const prefix = '/link';
// 查询链接配置列表
export function listLink() {
return request({
url: `${serviceTitle}${prefix}/list`,
method: 'post'
})
}
// 新增链接配置
export function addLink(data) {
return request({
url: `${serviceTitle}${prefix}/add`,
method: 'post' ,
data: data
})
}

17
src/api/rights/rightsOrder.js
View File

@ -0,0 +1,17 @@
import request from '@/utils/request'
const serviceTitle = 'http://localhost:8085/rights';
const prefix = '/rightsOrder';
// 查询用户领取权益记录分页
export function listRightsOrder(data) {
return request({
url: `${serviceTitle}${prefix}/page`,
method: 'post',
data: data
})
}

2
src/utils/request.js
View File

@ -29,6 +29,8 @@ service.interceptors.request.use(config => {
if (getToken() && !isToken) {
config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
}
//赋值平台platform
config.headers['platform'] = 'PU'
// get请求映射params参数
if (config.method === 'get' && config.params) {
let url = config.url + '?' + tansParams(config.params);

451
src/views/rights/aliPayOrder/index.vue
View File

@ -0,0 +1,451 @@
<template>
<div class="app-container">
<el-row :gutter="20">
<!--aliPayOrder数据-->
<el-col :span="20" :xs="24">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
<el-form-item label="签约号" prop="outTradeNo">
<el-input
v-model="queryParams.outTradeNo"
placeholder="请输入签约号"
clearable
style="width: 200px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="链接Id" prop="linkId">
<el-input
v-model="queryParams.linkId"
placeholder="请输入链接Id"
clearable
style="width: 200px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="链接名字" prop="linkName">
<el-input
v-model="queryParams.linkName"
placeholder="请输入链接名字"
clearable
style="width: 200px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="手机号" prop="mobile">
<el-input
v-model="queryParams.mobile"
placeholder="请输入手机号"
clearable
style="width: 200px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="订单状态" prop="status" label-width="80px">
<el-select v-model="queryParams.status" placeholder="订单状态" clearable>
<el-option
v-for="item in status"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</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="handleAdd"
v-hasPermi="['img:banner:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['img:banner:delete']"
>删除</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="aliPayOrderList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="50" align="center" />
<el-table-column label="编号" align="center" key="id" prop="id" v-if="columns[0].visible" />
<el-table-column label="banner名称" align="center" key="bannerName" prop="bannerName" v-if="columns[1].visible" :show-overflow-tooltip="true" width="150"/>
<el-table-column label="跳转地址" align="center" key="bannerUrl" prop="bannerUrl" v-if="columns[2].visible" :show-overflow-tooltip="true" />
<el-table-column label="来源平台" align="center" key="source" prop="source" v-if="columns[3].visible">
<template slot-scope="scope">
{{scope.row.source == '0' ? "通用" : scope.row.source == '1' ? "抖音": scope.row.source == '2' ? "快手": scope.row.source == '3' ? "微信": ''}}
</template>
</el-table-column>
<el-table-column label="banner图片" align="center" key="bannerImg" prop="bannerImg" v-if="columns[4].visible" width="120">
<template slot-scope="scope">
<el-image :src="scope.row.bannerImg" :preview-src-list="bigImgList" @click="getBigImg(scope.row)" style="width: 160px; height: 60px"/>
</template>
</el-table-column>
<el-table-column label="序号" align="center" key="sort" prop="sort" v-if="columns[5].visible"/>
<el-table-column label="是否显示" align="center" key="isShow" v-if="columns[6].visible">
<template slot-scope="scope">
<el-switch
v-model="scope.row.isShow"
active-value="1"
inactive-value="0"
@change="handleStatusChange(scope.row)"
></el-switch>
</template>
</el-table-column>
<el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[7].visible" width="160">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column label="更新时间" align="center" prop="updateTime" v-if="columns[8].visible" width="160">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.updateTime) }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
width="160"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['img:banner:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['img:banner:delete']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</el-col>
</el-row>
<!-- 添加或修改banner对话框 -->
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-row>
<el-col :span="12">
<el-form-item label="banner名称" prop="bannerName">
<el-input v-model="form.bannerName" placeholder="请输入banner名称" maxlength="30" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="跳转地址" prop="bannerUrl">
<el-input v-model="form.bannerUrl" placeholder="请输入跳转地址" maxlength="100" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="来源平台" prop="source" label-width="80px">
<el-select v-model="form.source" placeholder="来源平台" clearable>
<el-option
v-for="item in source"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="15">
<el-form-item label="banner上传" prop="bannerImg">
<el-upload
ref="upload"
:action="upload.url"
:limit="1"
accept=".jpg, .jpeg, .png"
:headers="upload.headers"
:disabled="upload.isUploading"
:on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess"
:file-list="fileList"
:auto-upload="true"
list-type="picture"
drag>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
<div class="el-upload__tip text-center" slot="tip">
<span>仅允许上传jpg,jpeg,png格式图片。</span>
</div>
</el-upload>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { listAliPayOrder } from "@/api/rights/aliPayOrder";
import { getToken } from "@/utils/auth";
export default {
name: "aliPayOrder",
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// banner列表数据
aliPayOrderList: null,
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 日期范围
dateRange: [],
//上传图片文件列表
fileList:[],
//大图列表
bigImgList:[],
//订单状态
status: [
{ value:'0',label:'失败'},
{ value:'1',label:'成功'},
{ value:'2',label:'支付成功尚未回调'},
],
//是否显示
isShow: [
{ value: '0', label: `否`},
{ value: '1', label: `是`}
],
// 表单参数
form: {},
defaultProps: {
children: "children",
label: "label"
},
// 图片上传参数
upload: {
// 是否显示弹出层
open: false,
// 弹出层标题
title: "",
// 是否禁用上传
isUploading: false,
// 设置上传的请求头部
headers: { Authorization: "Bearer " + getToken() },
// 上传的地址
url: process.env.VUE_APP_BASE_API + "/file/upload" //http://localhost:7010/file/upload
},
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
outTradeNo: undefined,
linkId: undefined,
linkName: undefined,
mobile: undefined,
status: undefined,
beginTime: undefined,
endTime: undefined
},
// 列信息
columns: [
{ key: 0, label: `编号`, visible: true },
{ key: 1, label: `banner名称`, visible: true },
{ key: 2, label: `跳转地址`, visible: true },
{ key: 3, label: `来源平台`, visible: true },
{ key: 4, label: `banner图片`, visible: true },
{ key: 5, label: `序号`, visible: true },
{ key: 6, label: `是否显示`, visible: true },
{ key: 7, label: `创建时间`, visible: true },
{ key: 8, label: `更新时间`, visible: true }
],
// 表单校验
rules: {
bannerName: [
{ required: true, message: "banner名称不能为空", trigger: "blur" },
{ min: 2, max: 20, message: 'banner名称长度必须介于 2 和 20 之间', trigger: 'blur' }
],
bannerUrl: [
{ required: true, message: "bannerUrl不能为空", trigger: "blur" },
],
}
};
},
created() {
this.getList();
},
methods: {
/** 查询banner列表 */
getList() {
this.loading = true;
listAliPayOrder(this.queryParams).then(response => {
this.aliPayOrderList = response.rows;
this.total = response.total;
this.loading = false;
}
);
},
// 筛选节点
filterNode(value, data) {
if (!value) return true;
return data.label.indexOf(value) !== -1;
},
// 用户状态修改
handleStatusChange(row) {
let text = row.isShow === "1" ? "启用" : "停用";
this.$modal.confirm('确认要' + text + 'id为' + row.id + '的banner吗？').then(function() {
let data = {
id: row.id,
status: row.isShow
}
return changeStatus(data);
}).then(() => {
this.$modal.msgSuccess(text + "成功");
}).catch(function() {
row.isShow = row.isShow === "0" ? "1" : "0";
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
bannerName: undefined,
bannerUrl: undefined,
bannerImg: undefined,
source: undefined,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.dateRange = [];
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id);
this.single = selection.length != 1;
this.multiple = !selection.length;
},
/** 查看大图 */
getBigImg(row){
this.bigImgList.push(row.bannerImg)
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加banner";
this.fileList = []
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids;
getBannerDetails(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改banner";
this.fileList = []
});
},
/** 提交按钮 */
submitForm: function() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != undefined) {
editBanner(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addBanner(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const id = row.id || this.ids;
this.$modal.confirm('是否确认删除编号为"' + id + '"的banner？').then(function() {
return delBanner(id);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
// 文件上传中处理
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
},
// 文件上传成功处理
handleFileSuccess(response, file, fileList) {
this.form.bannerImg = response.data
this.fileList.url = response.data
this.fileList.name = '图片上传结果'
this.upload.open = false;
this.upload.isUploading = false;
//this.$refs.upload.clearFiles();
//this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.data + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
//this.getList();
}
}
};
</script>
Write Preview
Loading…
Cancel
Save