liweiliang
/
bitcopay-ui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

交易号订单上传凭证功能

master
j1ack 2 years ago
parent
0f0f4a3297
commit
4ffc97a24f
5 changed files with 823 additions and 1 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. BIN
      bitcopay后台-开发环境.zip
  2. 21
      src/App.vue
  3. 17
      src/api/otc/otcOrder.js
  4. 2
      src/views/otc/otcStoreRechargeOrder/index.vue
  5. 784
      src/views/otc/otcTranslateOrder/index.vue

BIN
bitcopay后台-开发环境.zip
View File

Binary file not shown.

21
src/App.vue
View File

@ -27,6 +27,27 @@ export default {
} }
</style> </style>
<style> <style>
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #08BA7A;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 150px;
height: 150px;
line-height: 150px;
text-align: center;
border: 1px dotted #dddddd;
}
.nest-menu .el-menu-item{ .nest-menu .el-menu-item{
padding-left: 48px !important; padding-left: 48px !important;
} }

17
src/api/otc/otcOrder.js
View File

@ -25,6 +25,23 @@ export function addOtcOrder(data) {
data: data data: data
}) })
} }
// 提交转账截图
export function subProofImg(data) {
return request({
url: '/otc/otcOrder/subProofImg',
method: 'post',
data: data
})
}
// 平台交易号确定付款
export function confirmPayment(data) {
return request({
url: '/otc/otcOrder/confirmPayment?orderNo='+data,
method: 'post',
data: data
})
}
// 修改用户otc订单 // 修改用户otc订单
export function updateOtcOrder(data) { export function updateOtcOrder(data) {

2
src/views/otc/otcStoreRechargeOrder/index.vue
View File

@ -103,7 +103,7 @@
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="medium" type="text" v-if="scope.row.orderStatus == 1" <el-button size="medium" type="text" v-if="scope.row.orderStatus == 1 && scope.row.type!='card'"
@click="handleOrder(scope.row)">手工处理</el-button> @click="handleOrder(scope.row)">手工处理</el-button>
</template> </template>
</el-table-column> </el-table-column>

784
src/views/otc/otcTranslateOrder/index.vue
View File

@ -0,0 +1,784 @@
<template>
<div class="app-container">
<div class="search_con m-b-28">
<el-form
:model="queryParams"
ref="queryForm"
:inline="true"
v-show="showSearch"
label-width="68px"
>
<el-form-item label="订单编号" prop="orderNo">
<el-input
v-model="queryParams.orderNo"
placeholder="请输入订单编号"
clearable
size="medium"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="商家名称" prop="storeName">
<el-input
v-model="queryParams.storeName"
placeholder="请输入商家名称"
clearable
size="medium"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="用户名称" prop="userName">
<el-input
v-model="queryParams.userName"
placeholder="请输入用户名称"
clearable
size="medium"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="类型" prop="tradeType">
<el-select
v-model="queryParams.tradeType"
placeholder="请选择类型"
clearable
size="medium"
>
<el-option
v-for="dict in tradeTypeStatusOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select>
</el-form-item>
<!-- <el-form-item label="类型" prop="feeType">-->
<!-- <el-select v-model="queryParams.feeType" placeholder="请选择类型" clearable size="medium">-->
<!-- <el-option-->
<!-- v-for="dict in feeTypeOptions"-->
<!-- :key="dict.dictValue"-->
<!-- :label="dict.dictLabel"-->
<!-- :value="dict.dictValue"-->
<!-- />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item label="状态" prop="orderStatus">
<el-select
v-model="queryParams.orderStatus"
placeholder="请选择状态"
clearable
size="medium"
>
<el-option
v-for="dict in orderStatusOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select>
</el-form-item>
<el-form-item label="下单时间">
<el-date-picker
v-model="dateRange"
size="medium"
style="width: 360px"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetimerange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
:unlink-panels="true"
:default-time="['00:00:00', '23:59:59']"
></el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" size="medium" @click="handleQuery"
>搜索</el-button
>
<el-button size="medium" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
</div>
<div class="bg bg-white">
<el-row :gutter="10" class="m-b-16">
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- plain-->
<!-- icon="el-icon-plus"-->
<!-- size="medium"-->
<!-- @click="handleAdd"-->
<!-- v-hasPermi="['otc:otcOrder:add']"-->
<!-- >新增</el-button>-->
<!-- </el-col>-->
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="success"-->
<!-- plain-->
<!-- icon="el-icon-edit"-->
<!-- size="medium"-->
<!-- :disabled="single"-->
<!-- @click="handleUpdate"-->
<!-- v-hasPermi="['otc:otcOrder:edit']"-->
<!-- >修改</el-button>-->
<!-- </el-col>-->
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="danger"-->
<!-- plain-->
<!-- icon="el-icon-delete"-->
<!-- size="medium"-->
<!-- :disabled="multiple"-->
<!-- @click="handleDelete"-->
<!-- v-hasPermi="['otc:otcOrder:remove']"-->
<!-- >删除</el-button>-->
<!-- </el-col>-->
<el-col :span="1.5">
<el-button
type="primary"
size="medium"
@click="handleExport"
v-hasPermi="['otc:otcOrder:export']"
>导出</el-button
>
</el-col>
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table
v-loading="loading"
:data="otcOrderList"
@selection-change="handleSelectionChange"
>
<!-- <el-table-column label="流水编号" align="center" prop="id" />-->
<el-table-column label="订单编号" align="center" prop="orderNo" />
<el-table-column label="总单编号" align="center" prop="storeOrder" />
<!-- <el-table-column label="交易类型" align="center" prop="tradeType" :formatter="tradeTypeFormat" /> -->
<el-table-column
label="交易类型"
align="center"
prop="tradeType"
width="180"
>
<template slot-scope="scope">
<span :style="classObje(scope.row.tradeType)">{{
tradeTypeFormat(scope.row)
}}</span>
</template>
</el-table-column>
<el-table-column
label="订单状态"
align="center"
prop="tradeType"
width="180"
>
<template slot-scope="scope">
<span :style="classObje(scope.row.orderStatus)">{{
orderStatusFormat(scope.row)
}}</span>
</template>
</el-table-column>
<el-table-column label="转账凭证" align="center" prop="proofImg">
<template slot-scope="scope">
<el-image v-if="scope.row.proofImg"
style="width: 50px; height:50px"
:src="scope.row.proofImg"
@click="previewImage(scope.row.proofImg)"
:preview-src-list="srcList"
></el-image>
<span v-else>无</span>
</template>
</el-table-column>
<el-table-column label="用户名称" align="center" prop="userName" />
<el-table-column label="商家名称" align="center" prop="storeName" />
<el-table-column label="币种" align="center" prop="coin" />
<el-table-column label="数量" align="center" prop="realityCoinNum" />
<!-- <el-table-column label="实际数量" align="center" prop="realitySettleCoinNums" /> -->
<el-table-column label="单价" align="center" prop="legalCurrency" />
<el-table-column
label="总金额"
align="center"
prop="realityLegalNums"
/>
<el-table-column label="法币币种" align="center" prop="limitCoin" />
<!-- <el-table-column label="手续费类型" align="center" prop="feeType" :formatter="feeTypeFormat"/>-->
<!-- <el-table-column label="手续费" align="center" prop="fee" /> -->
<!-- <el-table-column label="支付方式" align="center" prop="paymentType" /> -->
<!-- <el-table-column label="付款时间倒计时" align="center" prop="paymentEndTime" width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span>{{ parseTime(scope.row.paymentEndTime, '{y}-{m}-{d}') }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="确定放行时间" align="center" prop="releaseTime" width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span>{{ parseTime(scope.row.releaseTime) }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="支付时间" align="center" prop="paymentTime" width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span>{{ parseTime(scope.row.paymentTime) }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="完成时间" align="center" prop="closeTime" width="180">-->
<!-- <template slot-scope="scope">-->
<!-- <span>{{ parseTime(scope.row.closeTime) }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="收款人" align="center" prop="payee" /> -->
<!-- <el-table-column label="收款银行" align="center" prop="collectionBank" /> -->
<!-- <el-table-column label="收款账号" align="center" prop="collectionAccount" /> -->
<!-- <el-table-column label="支付参考账号" align="center" prop="paymentAccount" />
<el-table-column label="是否可以申诉" align="center" prop="isAppeal" />
<el-table-column label="申诉订单编号" align="center" prop="appealOrderId" />
<el-table-column label="申诉状态" align="center" prop="appealStatus" />
<el-table-column label="取消类型" align="center" prop="cancelType" /> -->
<el-table-column
label="下单时间"
align="center"
prop="crateTime"
width="180"
>
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="medium"
type="text"
@click="handleUpdate(scope.row)"
v-hasPermi="['otc:otcOrder:edit']"
>详情</el-button
>
<el-button
size="medium"
type="text"
@click="handleConfirmPayment(scope.row)"
v-if="scope.row.orderStatus == 'pending_order'"
>确认付款</el-button
>
<el-button
size="medium"
type="text"
@click="handleUpload(scope.row)"
v-if="!scope.row.proofImg&&scope.row.orderStatus!='cancel'"
>上传凭证</el-button
>
<!-- <el-button-->
<!-- size="medium"-->
<!-- type="text"-->
<!-- icon="el-icon-delete"-->
<!-- @click="handleDelete(scope.row)"-->
<!-- v-hasPermi="['otc:otcOrder:remove']"-->
<!-- >删除</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"
/>
</div>
<!-- 添加或修改用户otc订单对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form
ref="form"
:model="form"
:rules="rules"
label-width="100px"
class="flex"
style="justify-content: space-around"
>
<div>
<el-form-item label="订单编号">
{{ form.orderNo }}
</el-form-item>
<el-form-item label="总订单编号">
{{ form.storeOrder }}
</el-form-item>
<el-form-item label="交易类型" v-if="form.tradeType">
{{ tradeTypeFormat(form) }}
</el-form-item>
<el-form-item label="商家编号">
{{ form.storeName }}
</el-form-item>
<el-form-item label="用户编号">
{{ form.userName }}
</el-form-item>
<el-form-item label="币种">
{{ form.coin }}
</el-form-item>
<el-form-item label="交易数量">
{{ form.realityCoinNum }}
</el-form-item>
<el-form-item label="得到数量">
{{ form.realitySettleCoinNums }}
</el-form-item>
<el-form-item label="法币金额">
{{ form.realityLegalNums }}
</el-form-item>
<el-form-item label="法币价格">
{{ form.legalCurrency }}
</el-form-item>
<el-form-item label="手续费类型" v-if="form.feeType">
{{ feeTypeFormat(form) }}
</el-form-item>
<el-form-item label="手续费">
{{ form.fee }}
</el-form-item>
</div>
<div>
<el-form-item label="转账凭证">
<el-image v-if="form.proofImg"
style="width: 50px; height:50px"
:src="form.proofImg"
@click="previewImage(form.proofImg)"
:preview-src-list="srcList"
></el-image>
<span v-else>无</span>
</el-form-item>
<el-form-item label="订单状态" v-if="form.orderStatus">
{{ orderStatusFormat(form) }}
</el-form-item>
<el-form-item label="支付方式" v-if="form.paymentType">
{{ form.paymentType }}
</el-form-item>
<el-form-item label="支付时间">
{{ form.paymentTime }}
</el-form-item>
<el-form-item label="完成时间">
{{ form.closeTime }}
</el-form-item>
<el-form-item label="收款人">
{{ form.payee }}
</el-form-item>
<el-form-item label="收款银行">
{{ form.collectionBank }}
</el-form-item>
<el-form-item label="收款账号">
{{ form.collectionAccount }}
</el-form-item>
<el-form-item label="支付参考账号">
{{ form.paymentAccount }}
</el-form-item>
<el-form-item label="是否可以申诉">
{{ form.isAppeal == "Y" ? "是" : "否" }}
</el-form-item>
<el-form-item label="申诉订单编号">
{{ form.appealOrderId }}
</el-form-item>
<el-form-item label="申诉状态" v-if="form.appealStatus">
{{ appealStatusFormat(form) }}
</el-form-item>
<el-form-item label="取消类型" v-if="form.cancelType">
{{ cancelTypeOptionsFormat(form) }}
</el-form-item>
</div>
</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>
<!-- 上传转账凭证 -->
<el-dialog
title="上传凭证"
:visible.sync="openTranslate"
width="500px"
append-to-body
:close-on-click-modal="false"
:before-close="cancel"
>
<el-form ref="form" :model="form" :rules="rules" label-width="82px">
<el-form-item label="转账凭证">
<el-upload
style="display: inline-block"
:limit="5"
action=""
class="avatar-uploader"
:http-request="changeFile"
:show-file-list="false"
:on-change="imgSaveToUrl"
ref="upload"
>
<img
v-if="form.localUrl"
:src="form.localUrl"
class="avatar"
style="width: 150px"
height="150px"
/>
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitTranslate">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
listOtcOrder,
getOtcOrder,
delOtcOrder,
addOtcOrder,
updateOtcOrder,
exportOtcOrder,
confirmPayment,
subProofImg,
} from "@/api/otc/otcOrder";
export default {
name: "OtcOrder",
components: {},
computed: {
classObje(status) {
return (status) => {
if (status == "sell") {
return { color: "rgba(231, 53, 53, 1)" };
}
if (status == "buy") {
return { color: "rgba(9, 186, 122, 1)" };
}
if (status == "in_appeal") {
return { color: "rgba(231, 53, 53, 1)" };
}
if (status == "released") {
return { color: "rgba(255, 124, 30, 1)" };
}
};
},
},
data() {
return {
// 预览
srcList: ["http://118.25.187.239:9099/img/adImg/557097620301025280.jpg"],
dateRange: [],
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 用户otc订单表格数据
otcOrderList: [],
feeTypeOptions: [],
orderStatusOptions: [],
tradeTypeStatusOptions: [],
//申诉字典
appealStatusOptions: [],
cancelTypeOptions: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
openTranslate: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
orderNo: null,
storeOrder: null,
tradeType: null,
storeName: null,
storeId: null,
userName: null,
userId: null,
coin: null,
realityCoinNum: null,
realityLegalNums: null,
realitySettleCoinNums: null,
legalCurrency: null,
feeType: null,
fee: null,
orderStatus: null,
paymentType: null,
paymentEndTime: null,
releaseTime: null,
paymentTime: null,
closeTime: null,
payee: null,
collectionBank: null,
collectionAccount: null,
paymentAccount: null,
isAppeal: null,
appealOrderId: null,
appealStatus: null,
cancelType: null,
userType: "acceptor_order",
},
// 表单参数
form: {},
fd: null,
// 表单校验
rules: {
orderNo: [
{ required: true, message: "订单编号不能为空", trigger: "blur" },
],
storeOrder: [
{ required: true, message: "总订单编号不能为空", trigger: "blur" },
],
tradeType: [
{ required: true, message: "交易类型不能为空", trigger: "change" },
],
storeId: [
{ required: true, message: "商家编号不能为空", trigger: "blur" },
],
},
};
},
created() {
this.getList();
this.getDicts("trade_type").then((response) => {
this.tradeTypeStatusOptions = response.data;
this.tradeTypeStatusOptions.unshift({
dictValue: null,
dictLabel: "全部",
});
});
this.getDicts("translate_order_status").then((response) => {
this.orderStatusOptions = response.data;
this.orderStatusOptions.unshift({
dictValue: null,
dictLabel: "全部",
});
});
this.getDicts("fee_type").then((response) => {
this.feeTypeOptions = response.data;
this.feeTypeOptions.unshift({
dictValue: null,
dictLabel: "全部",
});
});
this.getDicts("appeal_status").then((response) => {
this.appealStatusOptions = response.data;
this.appealStatusOptions.unshift({
dictValue: null,
dictLabel: "全部",
});
});
this.getDicts("cancel_type").then((response) => {
this.cancelTypeOptions = response.data;
this.cancelTypeOptions.unshift({
dictValue: null,
dictLabel: "全部",
});
});
},
methods: {
// 预览图片
previewImage(abUrl) {
this.srcList[0] = abUrl;
},
imgSaveToUrl(event) {
// 获取上传图片的本地URL，用于上传前的本地预览
var URL = null;
if (window.createObjectURL != undefined) {
// basic
URL = window.createObjectURL(event.raw);
} else if (window.URL != undefined) {
// mozilla(firefox)
URL = window.URL.createObjectURL(event.raw);
} else if (window.webkitURL != undefined) {
// webkit or chrome
URL = window.webkitURL.createObjectURL(event.raw);
}
// 转换后的地址为 blob:http://xxx/7bf54338-74bb-47b9-9a7f-7a7093c716b5
this.form.localUrl = URL;
this.$forceUpdate();
},
changeFile(file) {
this.fd = new FormData();
this.fd.append("file", file.file); // 传文件
this.fd.append("orderNo", this.form.orderNo);
},
/** 提交按钮 */
submitTranslate() {
subProofImg(this.fd).then((response) => {
this.msgSuccess("上传成功");
this.openTranslate = false;
this.getList();
});
},
handleUpload(row) {
this.reset();
this.form.orderNo = row.orderNo;
this.openTranslate = true;
},
/** 查询用户otc订单列表 */
getList() {
this.loading = true;
listOtcOrder(this.addSESDateRange(this.queryParams, this.dateRange)).then(
(response) => {
this.otcOrderList = response.rows;
this.total = Number(response.total);
this.loading = false;
}
);
},
cancelTypeOptionsFormat(row, column) {
return this.selectDictLabel(this.cancelTypeOptions, row.cancelType);
},
appealStatusFormat(row, column) {
return this.selectDictLabel(this.appealStatusOptions, row.appealStatus);
},
tradeTypeFormat(row, column) {
return this.selectDictLabel(this.tradeTypeStatusOptions, row.tradeType);
},
orderStatusFormat(row, column) {
return this.selectDictLabel(this.orderStatusOptions, row.orderStatus);
},
feeTypeFormat(row, column) {
return this.selectDictLabel(this.feeTypeOptions, row.feeType);
},
// 取消按钮
cancel() {
this.openTranslate = false;
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {};
this.dateRange = [];
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.dateRange = [];
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加用户otc订单";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids;
getOtcOrder(id).then((response) => {
this.form = response.data;
this.open = true;
this.title = "查询用户otc订单";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.id != null) {
updateOtcOrder(this.form).then((response) => {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addOtcOrder(this.form).then((response) => {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 确认付款 */
handleConfirmPayment(row) {
const ids = row.orderNo;
this.$confirm(
'是否确认付款用户otc订单编号为"' + ids + '"的数据项?',
"警告",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}
)
.then(function () {
return confirmPayment(ids);
})
.then(() => {
this.getList();
this.msgSuccess("操作成功");
});
},
/** 导出按钮操作 */
handleExport() {
const queryParams = this.queryParams;
this.$confirm("是否确认导出所有用户otc订单数据项?", "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(function () {
return exportOtcOrder(queryParams);
})
.then((response) => {
this.download(response.msg);
});
},
},
};
</script>
Write Preview
Loading…
Cancel
Save