hbyt/cloud-battery-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改

Browse Source
This commit is contained in:
cjb 2025-08-01 14:53:15 +08:00
parent 9bf9960b42
commit 0de31805ac
8 changed files with 1258 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.env.development
View File

@ -5,8 +5,8 @@ VITE_APP_TITLE = 智慧换电管理系统
VITE_APP_ENV = 'development'
# 开发环境
VITE_APP_BASE_API = 'http://192.168.5.213:9100/gateway'
#VITE_APP_BASE_API = 'http://192.168.5.14:9100/gateway'
#VITE_APP_BASE_API = 'http://192.168.5.213:9100/gateway'
VITE_APP_BASE_API = 'http://192.168.5.14:9100/gateway'
#VITE_APP_BASE_API = '/dev-api'
#VITE_APP_BASE_API = 'https://api.evo-techina.com'

16
src/api/order/replabatt.ts
View File

@ -148,4 +148,18 @@ export function oderdetails(orderNo:string) {
},false)
}
}
//电子对账单
export function dzdzd(params:any) {
return server.request({
url: '/cloud/order/swap/bill/list',
method: 'get',
params
})
}
//下载电子对账单
export function downdzdz(params:any) {
return server.download('/cloud/order/swap/bill/download',params,'电子对账单.xlsx')
}

40
src/api/order/transaction.ts Normal file
View File

@ -0,0 +1,40 @@
import server from '@/utils/request'
interface Params{
wuid:String //用户编码
pageSize:String|Number //每页条数,示例值
pageNo:String|Number //页数
stationCode:String //换电站编码
accountCode:String //账号编码
accountName:String //账号
outTradeNo:String //交易编码
tradeType:String|Number //交易类型：1-充值，2-订单消费，9-提现
payType:String|Number //支付方式：1-账户余额，2-微信，3-支付宝，4-网银，5 -充电补偿
}
//交易记录
export function traclist(params:Params) {
return server.request({
url: '/cloud/trade/list',
method: 'get',
params
})
}
//上传凭证
export function uppingz(data:any) {
return server.request({
url: '/cloud/trade/submit',
method: 'post',
data
})
}
//审核
export function examine(data:any) {
return server.request({
url: '/cloud/trade/approve',
method: 'post',
data
})
}

12
src/views/order/replabatt/index.vue
View File

@ -67,11 +67,16 @@
icon="Plus"
@click="showpop(1)">新增</el-button> -->
<!-- <el-button
type="primary"
plain
icon="Wallet"
@click="zfdrawer = true">批量支付</el-button> -->
<el-button
type="primary"
plain
icon="Wallet"
@click="zfdrawer = true">批量支付</el-button>
@click="zfdrawer = true">结算</el-button>
</div>
<el-tooltip class="item" effect="dark" :content="search? '隐藏搜索' : '显示搜索'" placement="top">
@ -119,6 +124,7 @@
<div v-else-if="scope.row.status == 5">充电完成</div>
<div v-else-if="scope.row.status == 6" style="color: #ff6000;">待支付</div>
<div v-else-if="scope.row.status == 7">已完成</div>
<div v-else-if="scope.row.status == 8">支付中</div>
<div v-else-if="scope.row.status == 9">已取消</div>
</template>
</el-table-column>
@ -434,7 +440,8 @@
:with-header="false"
size="1200px"
>
<Payment v-if="zfdrawer" />
<!-- <Payment v-if="zfdrawer" /> -->
<settlement v-if="zfdrawer" />
</el-drawer>
<!--详情修改-->
@ -727,6 +734,7 @@
import Payment from './payment.vue'
import Settlement from './settlement.vue'
// import {
// getdict

564
src/views/order/replabatt/settlement.vue Normal file
View File

@ -0,0 +1,564 @@
<template>
<div>
<div class="app-container" style="margin-bottom: 12px;padding-bottom: 5px;border-radius: 10px;">
<el-form
ref="querform"
:model="queryParams"
:inline="true"
>
<el-form-item label="所属公司" prop="ccode">
<el-select v-model="queryParams.companyCode" style="width: 200px;">
<el-option v-for="n in gongslist" :label="n.cname" :value="n.ccode" @click="getcname(n)" />
</el-select>
</el-form-item>
<el-form-item label="订单截止时间" prop="orderTimeEnd">
<el-date-picker
v-model="queryParams.orderTimeEnd"
value-format="YYYY-MM-DD"
style="width: 100%;"
type="date"
placeholder="请选择时间"
/>
</el-form-item>
<!-- <el-form-item label="订单号" prop="orderNo">
<el-input v-model="queryParams.orderNo" placeholder="请输入订单号" clearable />
</el-form-item>
<el-form-item label="车牌号" prop="plateNum">
<el-input v-model="queryParams.plateNum" placeholder="请输入车牌号" clearable />
</el-form-item>
<el-form-item label="订单开始时间" prop="orderTimeBegin">
<el-date-picker
v-model="queryParams.orderTimeBegin"
value-format="YYYY-MM-DD HH:mm:ss"
style="width: 100%;"
type="datetime"
placeholder="请选择时间"
/>
</el-form-item>
<el-form-item label="订单结束时间" prop="orderTimeEnd">
<el-date-picker
v-model="queryParams.orderTimeEnd"
value-format="YYYY-MM-DD HH:mm:ss"
style="width: 100%;"
type="datetime"
placeholder="请选择时间"
/>
</el-form-item>
<el-form-item label="换电站" prop="stationCode">
<el-select v-model="queryParams.stationCode" placeholder="请选择换电站" style="width: 200px;">
<el-option v-for="n in yunList" :label="n.name" :value="n.code" />
</el-select>
</el-form-item> -->
<!-- <el-form-item label="交易编码" prop="tradeNo">
<el-input v-model="queryParams.tradeNo" placeholder="请输入交易编码" clearable />
</el-form-item> -->
<el-form-item>
<el-button type="primary" icon="Search" @click="handBtnqu">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
</div>
<div class="app-container" style="margin-bottom: 12px;border-radius: 10px;">
<el-button
type="primary"
plain
icon="Wallet"
@click="payment(1)">微信支付</el-button>
<el-button
type="success"
plain
icon="Wallet"
@click="downdzd">下载电子对账单(公对公)</el-button>
<el-table
style="width:100%;margin-top: 10px;"
:data="yysList"
border
stripe
max-height="600px"
@selection-change="selChange"
>
<!-- <el-table-column type="selection" width="55" /> -->
<!-- <el-table-column label="车牌号" min-width="320" align="center" prop="orderNo" :show-overflow-tooltip="true" /> -->
<!-- <el-table-column label="订单类型" min-width="80" align="center" prop="sourceFrom" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.status == 1">换电</div>
<div v-else-if="scope.row.status == 2">充电</div>
</template>
</el-table-column> -->
<el-table-column label="车牌号" min-width="120" align="center" prop="plateNum" :show-overflow-tooltip="true">
<template #default="scope">
<div @click="getdetails(scope.row.childList)" style="display: inline-block;color:#16599d;border-bottom: 1px solid #417ebb;cursor:pointer">{{scope.row.plateNum}}</div>
</template>
</el-table-column>
<!-- <el-table-column label="订单时间" min-width="200" align="center" prop="orderTime" :show-overflow-tooltip="true" /> -->
<el-table-column label="换电次数" min-width="120" align="center" prop="orderNum" :show-overflow-tooltip="true" />
<el-table-column label="订单总金额(元)" min-width="120" align="center" prop="orderTotalAmount" :show-overflow-tooltip="true">
<template #default="scope">
<div>{{scope.row.orderTotalAmount/100}}</div>
</template>
</el-table-column>
<!-- <el-table-column label="创建时间" min-width="120" align="center" prop="orderNum" :show-overflow-tooltip="true" /> -->
<el-table-column label="订单状态" min-width="120" align="center" prop="status" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.status == 1">已创建</div>
<div v-else-if="scope.row.status == 2">换电中</div>
<div v-else-if="scope.row.status == 3">换电完成</div>
<div v-else-if="scope.row.status == 4">充电中</div>
<div v-else-if="scope.row.status == 5">充电完成</div>
<div v-else-if="scope.row.status == 6" style="color: #ff6000;">待结算</div>
<div v-else-if="scope.row.status == 7">已完成</div>
<div v-else-if="scope.row.status == 7">已取消</div>
</template>
</el-table-column>
<!-- <el-table-column label="计费方式" min-width="120" align="center" prop="feeType" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.feeType == 1">ODO</div>
<div v-else-if="scope.row.feeType == 2">SOC</div>
<div v-else-if="scope.row.feeType == 3">换电量</div>
</template>
</el-table-column>
<el-table-column label="基础费用" min-width="120" align="center" prop="basicFee" :show-overflow-tooltip="true" />
<el-table-column label="服务开始时间" min-width="120" align="center" prop="serviceTimeBegin" :show-overflow-tooltip="true" />
<el-table-column label="服务结束时间" min-width="120" align="center" prop="serviceTimeEnd" :show-overflow-tooltip="true" />
<el-table-column label="服务费" min-width="120" align="center" prop="serviceFee" :show-overflow-tooltip="true" />
<el-table-column label="上次租赁电池时车辆里程" min-width="180" align="center" prop="lastRentBatCarOdo" :show-overflow-tooltip="true" />
<el-table-column label="归还电池时车辆里程" min-width="150" align="center" prop="nowReturnBatCarOdo" :show-overflow-tooltip="true" />
<el-table-column label="按ODO换电费" min-width="120" align="center" prop="odoAmount" :show-overflow-tooltip="true" />
<el-table-column label="总充电量" min-width="120" align="center" prop="electAmount" :show-overflow-tooltip="true" />
<el-table-column label="租借电池包仓位" min-width="120" align="center" prop="rentBatNo" :show-overflow-tooltip="true" />
<el-table-column label="租用电池包编码" min-width="120" align="center" prop="rentBatCode" :show-overflow-tooltip="true" />
<el-table-column label="租用电池包SOC" min-width="120" align="center" prop="rentBatSoc" :show-overflow-tooltip="true" />
<el-table-column label="归还电池包编码" min-width="120" align="center" prop="returnBatCode" :show-overflow-tooltip="true" />
<el-table-column label="归还电池包仓位" min-width="120" align="center" prop="returnBatNo" :show-overflow-tooltip="true" />
<el-table-column label="归还电池包SOC" min-width="120" align="center" prop="returnBatSoc" :show-overflow-tooltip="true" />
<el-table-column label="归还电池租出时soc" min-width="150" align="center" prop="returnBatRentSoc" :show-overflow-tooltip="true" />
<el-table-column label="归还电池租出的换电站" min-width="160" align="center" prop="returnBatRentStationName" :show-overflow-tooltip="true" />
<el-table-column label="换电模式" min-width="120" align="center" prop="changeMode" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.changeMode == 1">全自动</div>
<div v-else-if="scope.row.changeMode == 2">半自动</div>
<div v-else-if="scope.row.changeMode == 3">人工干预</div>
</template>
</el-table-column>
<el-table-column label="换电车道" min-width="120" align="center" prop="changeLane" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.changeMode == 1">A车道</div>
<div v-else-if="scope.row.changeMode == 2">B车道</div>
<div v-else-if="scope.row.changeMode == 3">人工干预</div>
</template>
</el-table-column>
<el-table-column label="交易编码" min-width="120" align="center" prop="tradeNo" :show-overflow-tooltip="true" /> -->
</el-table>
<!-- <div v-if="total > 10" style="display: flex;justify-content: right;padding-top:20px;">
<el-pagination
v-model:current-page="queryParams.pageNo"
v-model:page-size="queryParams.pageSize"
:page-sizes="[10, 20, 30, 40]"
background
size="small"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="getyys"
/>
</div> -->
</div>
<el-dialog
v-model="openpop"
width="500"
:align-center="true"
:close-on-click-modal="false"
@close="zfclose"
>
<div style="width: 100%;padding: 25px;text-align: center;">
<div style="padding-bottom: 15px;font-size: 22px;">请打开微信扫一扫完成支付</div>
<div v-if="qscode" style="display: flex;padding-bottom: 15px;align-items: center;justify-content: center;">
<div style="padding-right: 10px;">剩余支付时间</div>
<div style="padding-right: 6px;color: #ff6000;"><span style="font-size: 22px;">{{tmminute}} </span>分</div>
<div style="color: #ff6000;"><span style="font-size: 22px;">{{tmsecond}} </span>秒</div>
</div>
<div v-if="qscode" style="position: relative;width: 200px;height: 200px;margin: 0 auto;">
<div v-if="issx" @click="payment()" style="position: absolute;top: 0;left: 0;width: 200px;height: 200px;line-height: 200px;font-size: 20px;color: #fff;background:rgba(0, 0, 0, 0.7);cursor: pointer;">点击重新获取</div>
<img :src="qscode" width="200" height="200" />
</div>
<div v-else style="width:200px;height:200px;margin: 0 auto;line-height: 200px;text-align: center;">正在生成二维码...</div>
</div>
</el-dialog>
<!--详细订单-->
<el-dialog
v-model="ddxqpop"
width="800"
:align-center="true"
:close-on-click-modal="false"
@close=""
>
<el-table
style="width:100%;margin-top: 10px;"
:data="ddxqList"
border
stripe
max-height="600px"
>
<el-table-column label="车牌号" min-width="120" align="center" prop="plateNum" :show-overflow-tooltip="true" />
<!-- <el-table-column label="订单时间" min-width="200" align="center" prop="orderTime" :show-overflow-tooltip="true" /> -->
<el-table-column label="订单金额(元)" min-width="120" align="center" prop="orderAmount" :show-overflow-tooltip="true">
<template #default="scope">
<div>{{scope.row.orderAmount/100}}</div>
</template>
</el-table-column>
<el-table-column label="车牌号" min-width="200" align="center" prop="stationName" :show-overflow-tooltip="true" />
<el-table-column label="创建时间" min-width="200" align="center" prop="orderTime" :show-overflow-tooltip="true" />
<!-- <el-table-column label="创建时间" min-width="120" align="center" prop="orderNum" :show-overflow-tooltip="true" /> -->
<el-table-column label="订单状态" min-width="120" align="center" prop="status" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.status == 1">已创建</div>
<div v-else-if="scope.row.status == 2">换电中</div>
<div v-else-if="scope.row.status == 3">换电完成</div>
<div v-else-if="scope.row.status == 4">充电中</div>
<div v-else-if="scope.row.status == 5">充电完成</div>
<div v-else-if="scope.row.status == 6" style="color: #ff6000;">待结算</div>
<div v-else-if="scope.row.status == 7">已完成</div>
<div v-else-if="scope.row.status == 7">已取消</div>
</template>
</el-table-column>
</el-table>
</el-dialog>
</div>
</template>
<script setup lang="ts" name="UserPage">
// import {
// gethdzlist
// } from '@/api/swapstation/hdz'
import {
getjqrlist,
batchpayment,
getip,
paystatus,
dzdzd,
downdzdz
} from '@/api/order/replabatt'
import {
getlist
} from '@/api/operation/company'
// import {
// getdict
// } from '@/api/systemSet/dict'
// import { jsonp } from 'vue-jsonp'
import { ref,reactive} from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
// const emit = defineEmits<{
// close: []
// }>()
let queryParams = reactive({
// pageSize:20, //每页条数
// pageNo:1, //页数
companyCode:'',
orderTimeEnd:''
// orderNo:'', //订单编码
// plateNum:'', //车牌号
// orderTimeBegin:'', //订单时间开始,示例值(yyyy-MM-dd HH:mm:ss)
// orderTimeEnd:'', //订单时间结束
// stationCode:'', //换电站编码
// stationName:'', //换电站名称
// userId:'', //换电车主ID
// tradeNo:'', //交易编码
// status:'6', //订单状态
// ccode:'' //公司编码
})
//查询
let total = ref(0)
let yysList = ref<any>([])
function handBtnqu(){
//queryParams.pageNo = 1
getyys()
}
let cname = ref('')
//初始查询公司
let gongslist = ref<any>([])
getlist({
pageSize:1000, //每页条数
pageNo:1 //页数
}).then(rps => {
if(rps.data){
let list = (rps.data as any).records
gongslist.value = list?list:[]
queryParams.companyCode = gongslist.value[0].ccode
cname.value = gongslist.value[0].cname
getyys()
}
})
function getcname(n:any){
cname.value = n.cname
}
//获取详细订单
let ddxqpop = ref(false)
let ddxqList = ref<any>([])
function getdetails(data:any) {
console.log(data)
ddxqpop.value = true
//ddxqList.value.splice(0)
ddxqList.value = data
}
//初始查询换电站
// let yunList = ref<any>([])
// gethdzlist({
// pageSize:20, //每页条数
// pageNo:1, //页数
// proxyId:'', //归属运营商ID
// name:'', //站点名称
// code:'', //站点编码
// status:'', //状态：1-正常营业，2-正常停运，3-故障停运，4-指令停运，9-其它
// type:'', //站点类型ID
// }).then(rps => {
// if(rps.data){
// let list = (rps.data as any).records
// yunList.value = list?list:[]
// //queryParams.stationCode = list[0].code
// //getyys()
// }
// })
let wxuser = ref('')
function getyys() {
yysList.value.splice(0)
dzdzd(queryParams).then(rps => {
if(rps.data){
yysList.value = rps.data
//total.value = (rps.data as any).total
}
})
}
function handleSizeChange(val:number) {
//queryParams.pageSize = val
getyys()
}
//重置
let querform = ref()
function resetQuery() {
querform.value?.resetFields()
}
//下载电子对账单
function downdzd() {
downdzdz(queryParams)
}
//批量支付
let dzarr = ref<any[]>([])
//获取ip
getip().then(rps => {
payqs.payerClientIp = rps.data
})
let openpop = ref(false)
//总金额
let totalAmount = ref<any>(0)
//订单号
let orderNo = ref('')
function selChange(v:any) {
dzarr.value = v
totalAmount.value = 0
let odrarr = []
if(v.length > 0){
odrarr = v.map((e:any) => {
e.amount = e.amount*1
totalAmount.value += e.amount
return e.orderNo
})
}
orderNo.value = odrarr.join()
}
let payqs = reactive<any>({
//wuid:'', //公司编码,
ccode:'', //公司编码
description:'', //订单总描述 公司名称+日期
total:0, //支付金额，单位：分
timeExp:'', //支付结束时间
attach:{ //订单附加信息
type: 2, //"1-充值,2-订单。类型 number"
orderNo:'', //"订单号",
trader:'', //交易发起人
tradercode:'', //uni.getStorageSync('wxuid') //交易人编码
description:''
//walletCode:'' //钱包编码
// ownerId:'', //"户主ID，个人wuid，企业:公司编码",
// walletCode:'' //"钱包编码"
},
// goodsDetail:[
// {
// merchantGoodsId:'', //商户侧商品编码
// wechatpayGoodsId:'', //微信支付定义的统一商品编号（没有可不传）
// goodsName:'', //商品的实际名称
// quantity:1, //商品数量
// unitPrice:0 //商品价格
// }
// ],
payerClientIp:'', //用户IP
//deviceId:'', //用户设备型号
//stationCode:''
})
let timer:any = null
let qscode = ref('')
function zfclose() {
payqs.attach = JSON.parse(payqs.attach)
clearInterval(timer)
}
//失效倒计时
let minute = ref<any>(29)
let second = ref<any>(59)
let tmminute = ref<any>(29)
let tmsecond = ref<any>(59)
let djstimet:any = null
//是否失效
let issx = ref(false)
function payment(type?:number) {
if(dzarr.value.length > 0){
//失效时间
let sxtime:any = new Date().getTime()
sxtime = sxtime + 30 * 60 * 1000
sxtime = new Date(sxtime)
let sxyear = sxtime.getFullYear()
let sxmoth = String((sxtime.getMonth() + 1)).padStart(2,'0')
let sxdate = String(sxtime.getDate()).padStart(2,'0')
let sxhhour = String(sxtime.getHours()).padStart(2,'0')
let sxminute = String(sxtime.getMinutes()).padStart(2,'0')
let sxSeconds = String(sxtime.getSeconds()).padStart(2,'0')
payqs.timeExp = `${sxyear}-${sxmoth}-${sxdate} ${sxhhour}:${sxminute}:${sxSeconds}`
//payqs.ccode = queryParams.ccode
payqs.total = totalAmount
payqs.attach.orderNo = orderNo.value
//payqs.attach.tradercode = queryParams.ccode
let dateTime = new Date()
let year = dateTime.getFullYear()
let moth:any = String((dateTime.getMonth() + 1)).padStart(2,'0')
//let date = String(dateTime.getDate()).padStart(2,'0')
let ddms = `${cname.value}支付${year}年${moth}月订单`
payqs.description = ddms
payqs.attach.description = ddms
if(type == 1){
payqs.attach = JSON.stringify(payqs.attach)
}else{
issx.value = false
}
openpop.value = true
qscode.value = ''
if(timer){
clearInterval(timer)
}
if(djstimet){
clearInterval(djstimet)
}
batchpayment(payqs).then(rps => {
qscode.value = (rps.data as any).codeUrl
djstimet = setInterval(() => {
second.value--
tmsecond.value = second.value
if(second.value == 0 && minute.value == 0) {
tmminute.value = '00'
tmsecond.value = '00'
issx.value = true
clearInterval(djstimet)
}
if(second.value == 0) {
second.value = 59
tmsecond.value = 59
minute.value--
if(minute.value < 10){
tmminute.value = '0'+ minute.value
}else{
tmminute.value = minute.value
}
}
if(second.value < 10){
tmsecond.value = '0' + second.value
}else{
tmsecond.value = second.value
}
}, 1000)
timer = setInterval(() => {
paystatus((rps.data as any).OutTradeNo).then(rps => {
if((rps.data as any).tradeState == 'SUCCESS'){ //'NOTPAY' 订单未支付
ElMessage({
type: 'warning',
message: '支付成功'
})
openpop.value = false
handBtnqu()
}
})
},5000)
})
// ElMessage({
// type: 'success',
// message: '支付成功'
// })
}else{
ElMessage({
type: 'warning',
message: '请选择订单'
})
}
}
</script>
<style scoped>
.el-divider--horizontal{
border-color:#5b98cd;
}
</style>

418
src/views/order/transaction/index.vue Normal file
View File

@ -0,0 +1,418 @@
<template>
<div>
<div v-if="search" class="app-container" style="margin-bottom: 12px;padding-bottom: 5px;border-radius: 10px;">
<el-form
ref="querform"
:model="queryParams"
:inline="true"
>
<el-form-item label="交易编码" prop="outTradeNo">
<el-input v-model="queryParams.outTradeNo" placeholder="请输入交易编码" clearable />
</el-form-item>
<el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status" style="width: 180px" placeholder="请选择状态">
<el-option label="编辑中" value="edit" />
<el-option label="提交" value="submit" />
<el-option label="完成" value="finish" />
<el-option label="打回" value="reject" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handBtnqu">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
</div>
<div class="app-container" style="margin-bottom: 12px;border-radius: 10px;">
<div style="display: flex;justify-content: space-between;">
<!-- <div>
<el-button
type="primary"
plain
icon="Wallet"
@click="zfdrawer = true">结算</el-button>
</div> -->
<!-- <el-tooltip class="item" effect="dark" :content="search? '隐藏搜索' : '显示搜索'" placement="top">
<el-button size="mini" circle icon="Search" @click="search = !search" />
</el-tooltip> -->
</div>
<!--@selection-change="selChange"-->
<el-table
style="width:100%;margin-top: 10px;"
:data="yysList"
border
stripe
max-height="620px"
>
<el-table-column label="交易人" min-width="150" align="center" prop="trader" :show-overflow-tooltip="true" />
<el-table-column label="交易编码" min-width="220" align="center" prop="outTradeNo" :show-overflow-tooltip="true" />
<el-table-column label="交易类型" min-width="120" align="center" prop="orderPreUname" :show-overflow-tooltip="true">
<div>订单消费</div>
</el-table-column>
<!-- <el-table-column label="预约人电话" min-width="120" align="center" prop="orderPrePhone" :show-overflow-tooltip="true" /> -->
<el-table-column label="支付方式" min-width="200" align="center" prop="payType" :show-overflow-tooltip="true">
<template #default="scope">
<!--1-账户余额，2-微信，3-支付宝，4-网银，5 -充电补偿 6 公对公-->
<div v-if="scope.row.payType == 1">账户余额</div>
<div v-else-if="scope.row.payType == 2">微信</div>
<div v-else-if="scope.row.payType == 3">支付宝</div>
<div v-else-if="scope.row.payType == 4">网银</div>
<div v-else-if="scope.row.payType == 5">充电补偿</div>
<div v-else-if="scope.row.payType == 6">公对公</div>
</template>
</el-table-column>
<!-- <el-table-column label="金额账号" min-width="120" align="center" prop="accountCode" :show-overflow-tooltip="true" /> -->
<el-table-column label="订单数量" min-width="120" align="center" prop="orderCount" :show-overflow-tooltip="true" />
<el-table-column label="交易金额(元)" min-width="120" align="center" prop="tradeAmount" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.tradeAmount">{{scope.row.tradeAmount?scope.row.tradeAmount/100:''}}</div>
</template>
</el-table-column>
<el-table-column label="交易凭证" min-width="120" align="center" prop="pingz" :show-overflow-tooltip="true">
<template #default="scope">
<img v-if="scope.row.payType == 6 && scope.row.tradeMessage" :src="scope.row.tradeMessage" style="width: 50px;height: 50px;" />
</template>
</el-table-column>
<el-table-column label="状态" min-width="120" align="center" prop="status" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.status">{{staname(scope.row.status)}}</div>
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="240" fixed="right">
<template #default="scope">
<el-button link type="primary" icon="Tickets" @click="showxq(scope.row.outTradeNo)">查看详情</el-button>
<el-button v-if="scope.row.payType == 6 && (scope.row.status == 'edit' || scope.row.status == 'reject')" link type="primary" icon="Edit" @click="showpz(scope.row)">上传凭证</el-button>
<el-button v-if="scope.row.payType == 6 && scope.row.status == 'submit'" link type="primary" icon="Edit" @click="showsh(scope.row)">审核</el-button>
</template>
</el-table-column>
</el-table>
<div v-if="total > 10" style="display: flex;justify-content: right;padding-top:20px;">
<el-pagination
v-model:current-page="queryParams.pageNo"
v-model:page-size="queryParams.pageSize"
:page-sizes="[10, 20, 30, 40]"
background0
size="small"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="getyys"
/>
</div>
</div>
<!--上传凭证-->
<el-dialog
v-model="popshow"
title="上传凭证"
width="500px"
append-to-body
align-center
:close-on-click-modal="false"
>
<el-form ref="typeform" :model="addObj" label-width="100px">
<el-form-item label="交易人">
<el-input v-model="xqlist.trader" disabled />
</el-form-item>
<el-form-item label="订单数量">
<el-input v-model="xqlist.orderCount" disabled />
</el-form-item>
<el-form-item label="交易金额(元)">
<el-input v-model="xqlist.tradeAmount" disabled />
</el-form-item>
<el-form-item label="凭证">
<el-upload
:headers="{
Authorization:Token
}"
:data="{useFor:1}"
class="avatar-uploader"
:action="uploadUrl"
:show-file-list="false"
:on-success="handleSuc"
:before-upload="beforeAvatarUpload"
>
<img v-if="addObj.tradeMessage" :src="addObj.tradeMessage" class="avatar" />
<el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
</el-upload>
<!-- <el-input v-model="addObj.picUrl" placeholder="请选择图片" /> -->
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="save">提 交</el-button>
<el-button @click="canceltype">取 消</el-button>
</div>
</template>
</el-dialog>
<!--审核-->
<!--上传凭证-->
<el-dialog
v-model="shpopshow"
title="审核"
width="500px"
append-to-body
align-center
:close-on-click-modal="false"
>
<el-form ref="typeform" :model="shobj" label-width="100px">
<el-form-item label="交易人">
<el-input v-model="shobj.trader" disabled />
</el-form-item>
<el-form-item label="订单数量">
<el-input v-model="shobj.orderCount" disabled />
</el-form-item>
<el-form-item label="交易金额(元)">
<el-input v-model="shobj.tradeAmount" disabled />
</el-form-item>
<el-form-item label="凭证">
<el-image
style="width: 300px; height: 300px"
:src="shobj.tradeMessage"
:preview-src-list="[shobj.tradeMessage]">
</el-image>
<!-- <el-input v-model="addObj.picUrl" placeholder="请选择图片" /> -->
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button type="success" @click="shehe(1)">通 过</el-button>
<el-button type="primary" @click="shehe(0)">驳 回</el-button>
<el-button @click="shcancel">取 消</el-button>
</div>
</template>
</el-dialog>
<!--详情列表-->
<el-dialog
v-model="orderpop"
title="订单详情"
width="80%"
append-to-body
align-center
:close-on-click-modal="false"
>
<orderlist v-if="orderpop" :tradeNo="tradeNo" />
</el-dialog>
</div>
</template>
<script setup lang="ts" name="UserPage">
import {
traclist,
uppingz,
examine
} from '@/api/order/transaction'
import type { UploadProps } from 'element-plus'
import { getToken } from "@/utils/auth";
import { ref,reactive,watch} from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import Orderlist from './orderlist.vue'
let queryParams = reactive({
wuid:'', //用户编码
pageSize:20, //每页条数,示例值
pageNo:1, //页数
stationCode:'', //换电站编码
accountCode:'', //账号编码
accountName:'', //账号
outTradeNo:'', //交易编码
tradeType:'', //交易类型：1-充值，2-订单消费，9-提现
payType:'', //支付方式：1-账户余额，2-微信，3-支付宝，4-网银，5 -充电补偿
status:''
})
//查询
let total = ref(0)
let yysList = ref<any>([])
let search = ref(true)
function handBtnqu(){
queryParams.pageNo = 1
getyys()
}
function staname(n:string) {
if(n == 'edit'){
return '编辑中'
}else if(n == 'submit') {
return '提交'
}else if(n == 'finish') {
return '完成'
}else if(n == 'reject'){
return '打回'
}else {
return ''
}
}
function getyys() {
yysList.value.splice(0)
total.value = 0
traclist(queryParams).then(rps => {
if(rps.data){
yysList.value = (rps.data as any).records
total.value = (rps.data as any).total
}
})
}
let querform = ref()
function resetQuery() {
querform.value?.resetFields()
}
function handleSizeChange(val:number) {
queryParams.pageSize = val
getyys()
}
getyys()
//查看详情
let orderpop = ref(false)
let tradeNo = ref('')
function showxq(code:string) {
console.log(code)
orderpop.value = true
tradeNo.value = code
}
//上传凭证
let popshow = ref(false)
let xqlist = ref<any>({})
let addObj = reactive({
pkId:'',
tradeMessage:'' //图片地址
})
function showpz(row:any) {
addObj.tradeMessage = ''
addObj.pkId = row.pkId
popshow.value = true
xqlist.value = row
xqlist.value.tradeAmount = xqlist.value.tradeAmount?xqlist.value.tradeAmount/100:''
}
const Token = `Bearer ${getToken()}`
const uploadUrl = `${import.meta.env.VITE_APP_BASE_API}/resource/file/img/upload`
//图片上传限制
const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
if (rawFile.type !== 'image/jpeg') {
ElMessage.error('请上传jpg图片')
return false
} else if (rawFile.size / 1024 / 1024 > 2) {
ElMessage.error('上传图片大小不能超过2MB')
return false
}
return true
}
//图片上传成功回调
const handleSuc: UploadProps['onSuccess'] = (
response,
uploadFile
) => {
if(response.code == 1000){
addObj.tradeMessage = response.data
}
//addObj.picUrl = URL.createObjectURL(uploadFile.raw!)
console.log(uploadFile)
}
function save() {
if(addObj.tradeMessage == ''){
ElMessage({
type: 'warning',
message: '请上传凭证'
})
}else{
uppingz(addObj).then(() => {
ElMessage({
type: 'success',
message: '提交成功'
})
popshow.value = false
getyys()
})
}
}
function canceltype() {
popshow.value = false
}
//审核
let shpopshow = ref(false)
let shobj = ref<any>({})
function showsh(row:any) {
shpopshow.value = true
shobj.value = row
shobj.value.tradeAmount = xqlist.value.tradeAmount?xqlist.value.tradeAmount/100:''
}
function shcancel() {
shpopshow.value = false
}
function shehe(type:string|number) {
examine({
id:shobj.value.pkId,
type //1 通过 0驳回
}).then(() => {
ElMessage({
type: 'success',
message: '操作成功'
})
shpopshow.value = false
getyys()
})
}
</script>
<style scoped>
.avatar-uploader .avatar {
width: 178px;
height: 178px;
display: block;
}
</style>
<style>
.avatar-uploader .el-upload {
border: 1px dashed var(--el-border-color);
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
transition: var(--el-transition-duration-fast);
}
.avatar-uploader .el-upload:hover {
border-color: var(--el-color-primary);
}
.el-icon.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
text-align: center;
}
</style>

208
src/views/order/transaction/orderlist.vue Normal file
View File

@ -0,0 +1,208 @@
<template>
<div>
<div class="app-container" style="margin-bottom: 12px;border-radius: 10px;">
<!--@selection-change="selChange"-->
<el-table
style="width:100%;margin-top: 10px;"
:data="yysList"
border
stripe
max-height="680px"
>
<!-- <el-table-column type="selection" width="55" /> -->
<el-table-column label="订单号" min-width="320" align="center" prop="orderNo" :show-overflow-tooltip="true" />
<el-table-column label="订单类型" min-width="80" align="center" prop="sourceFrom" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.orderType == 1">换电</div>
<div v-else-if="scope.row.orderType == 2">充电</div>
</template>
</el-table-column>
<el-table-column label="车牌号" min-width="120" align="center" prop="plateNum" :show-overflow-tooltip="true" />
<el-table-column label="换电站" min-width="200" align="center" prop="stationName" :show-overflow-tooltip="true" />
<el-table-column label="预约人" min-width="120" align="center" prop="orderPreUname" :show-overflow-tooltip="true" />
<!-- <el-table-column label="预约人电话" min-width="120" align="center" prop="orderPrePhone" :show-overflow-tooltip="true" /> -->
<el-table-column label="订单时间" min-width="200" align="center" prop="orderTime" :show-overflow-tooltip="true" />
<!-- <el-table-column label="金额账号" min-width="120" align="center" prop="accountCode" :show-overflow-tooltip="true" /> -->
<el-table-column label="订单金额(元)" min-width="120" align="center" prop="amount" :show-overflow-tooltip="true">
<template #default="scope">
<div>{{scope.row.amount/100}}</div>
</template>
</el-table-column>
<el-table-column label="订单状态" min-width="120" align="center" prop="status" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.status == 1">已创建</div>
<div v-else-if="scope.row.status == 2">换电中</div>
<div v-else-if="scope.row.status == 3">换电完成</div>
<div v-else-if="scope.row.status == 4">充电中</div>
<div v-else-if="scope.row.status == 5">充电完成</div>
<div v-else-if="scope.row.status == 6" style="color: #ff6000;">待支付</div>
<div v-else-if="scope.row.status == 7">已完成</div>
<div v-else-if="scope.row.status == 8">支付中</div>
<div v-else-if="scope.row.status == 9">已取消</div>
</template>
</el-table-column>
<el-table-column label="计费方式" min-width="120" align="center" prop="feeType" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.feeType == 1">ODO</div>
<div v-else-if="scope.row.feeType == 2">SOC</div>
<div v-else-if="scope.row.feeType == 3">换电量</div>
</template>
</el-table-column>
<!--
<el-table-column label="基础费用(元)" min-width="120" align="center" prop="basicFee" :show-overflow-tooltip="true" />
<el-table-column label="服务开始时间" min-width="180" align="center" prop="serviceTimeBegin" :show-overflow-tooltip="true" />
<el-table-column label="服务结束时间" min-width="180" align="center" prop="serviceTimeEnd" :show-overflow-tooltip="true" />
<el-table-column label="服务费(元)" min-width="120" align="center" prop="serviceFee" :show-overflow-tooltip="true" />
<el-table-column label="上次租赁电池时车辆里程" min-width="180" align="center" prop="lastRentBatCarOdo" :show-overflow-tooltip="true" />
<el-table-column label="归还电池时车辆里程" min-width="150" align="center" prop="nowReturnBatCarOdo" :show-overflow-tooltip="true" />
<el-table-column label="按ODO换电费" min-width="120" align="center" prop="odoAmount" :show-overflow-tooltip="true" />
<el-table-column label="总充电量" min-width="120" align="center" prop="electAmount" :show-overflow-tooltip="true" />
<el-table-column label="租借电池包仓位" min-width="120" align="center" prop="rentBatNo" :show-overflow-tooltip="true" />
<el-table-column label="租用电池包编码" min-width="300" align="center" prop="rentBatCode" :show-overflow-tooltip="true" />
<el-table-column label="租用电池包SOC" min-width="120" align="center" prop="rentBatSoc" :show-overflow-tooltip="true" />
<el-table-column label="归还电池包编码" min-width="300" align="center" prop="returnBatCode" :show-overflow-tooltip="true" />
<el-table-column label="归还电池包仓位" min-width="120" align="center" prop="returnBatNo" :show-overflow-tooltip="true" />
<el-table-column label="归还电池包SOC" min-width="120" align="center" prop="returnBatSoc" :show-overflow-tooltip="true" />
<el-table-column label="归还电池租出时soc" min-width="150" align="center" prop="returnBatRentSoc" :show-overflow-tooltip="true" />
<el-table-column label="归还电池租出的换电站" min-width="160" align="center" prop="returnBatRentStationName" :show-overflow-tooltip="true" />
<el-table-column label="换电模式" min-width="120" align="center" prop="changeMode" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.changeMode == 1">全自动</div>
<div v-else-if="scope.row.changeMode == 2">半自动</div>
<div v-else-if="scope.row.changeMode == 3">人工干预</div>
</template>
</el-table-column>
<el-table-column label="换电车道" min-width="120" align="center" prop="changeLane" :show-overflow-tooltip="true">
<template #default="scope">
<div v-if="scope.row.changeMode == 1">A车道</div>
<div v-else-if="scope.row.changeMode == 2">B车道</div>
<div v-else-if="scope.row.changeMode == 3">人工干预</div>
</template>
</el-table-column>
<el-table-column label="交易编码" min-width="280" align="center" prop="tradeNo" :show-overflow-tooltip="true" /> -->
<!-- <el-table-column label="操作" align="center" width="100" fixed="right">
<template #default="scope">
<el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column> -->
</el-table>
<div v-if="total > 10" style="display: flex;justify-content: right;padding-top:20px;">
<el-pagination
v-model:current-page="queryParams.pageNo"
v-model:page-size="queryParams.pageSize"
:page-sizes="[10, 20, 30, 40]"
background0
size="small"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="getyys"
/>
</div>
</div>
</div>
</template>
<script setup lang="ts" name="UserPage">
import {
getjqrlist,
} from '@/api/order/replabatt'
import { ref,reactive,watch} from 'vue'
const props = defineProps<{
tradeNo:string
}>()
//计费方式
function feetype(type:string|number) {
if(type == 1){
return 'ODO'
}
if(type == 2){
return 'SOC'
}
if(type == 3){
return '换电量'
}
}
//换电模式
function hdms(type:string|number) {
if(type == 1){
return '全自动'
}
if(type == 2){
return '半自动'
}
if(type == 3){
return '人工干预'
}
}
//批量支付
let zfdrawer = ref(false)
watch(zfdrawer,v =>{
if(!v){
handBtnqu()
}
})
let search = ref(true)
let queryParams = reactive({
pageSize:20, //每页条数
pageNo:1, //页数
orderNo:'', //订单编码
plateNum:'', //车牌号
//orderTimeBegin:getDateDaysAgo(30,'00:00:00'), //订单时间开始,示例值(yyyy-MM-dd HH:mm:ss)
// orderTimeEnd:getDateDaysAgo(0,'23:59:59'), //订单时间结束
stationCode:'', //换电站编码
stationName:'', //换电站名称
userId:'', //换电车主ID
tradeNo:props.tradeNo,
status:''
})
//查询
let total = ref(0)
let yysList = ref<any>([])
function handBtnqu(){
queryParams.pageNo = 1
getyys()
}
function getyys() {
yysList.value.splice(0)
total.value = 0
getjqrlist(queryParams).then(rps => {
if(rps.data){
yysList.value = (rps.data as any).records
total.value = (rps.data as any).total
}
})
}
function handleSizeChange(val:number) {
queryParams.pageSize = val
getyys()
}
getyys()
</script>
<style scoped>
.el-divider--horizontal{
border-color:#5b98cd;
}
</style>

2
src/views/system/xcximg/index.vue
View File

@ -186,7 +186,7 @@
uploadFile
) => {
if(response.code == 1000){
addObj.picUrl = response.msg
addObj.picUrl = response.data
}
//addObj.picUrl = URL.createObjectURL(uploadFile.raw!)
console.log(uploadFile)