|
|
@ -1,5 +1,60 @@ |
|
|
|
<template> |
|
|
|
<el-table :data="tableData" style="height:80vh;width:82vw"> |
|
|
|
<el-card style="margin-bottom: 0.5vh;"> |
|
|
|
<div class="condition1"> |
|
|
|
<div class="condition-item"> |
|
|
|
<el-text size="large" style="width:4vw;">姓名</el-text> |
|
|
|
<el-input v-model="searchForm.username" placeholder="请输入姓名" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="condition-item"> |
|
|
|
<el-text size="large" style="width:4vw;">精网号</el-text> |
|
|
|
<el-input v-model="searchForm.jwcode" placeholder="请输入精网号" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="condition-item"> |
|
|
|
<el-text size="large" style="width:4vw;">所属地区</el-text> |
|
|
|
<el-input v-model="searchForm.area" placeholder="请输入所属地区" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="condition-item2"> |
|
|
|
<el-text size="large" style="width:4vw;">产品名称</el-text> |
|
|
|
<el-input v-model="searchForm.productName" placeholder="请输入产品名称" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="condition-item"> |
|
|
|
<el-text size="large" style="width:4vw;">退款币种</el-text> |
|
|
|
<el-select v-model="searchForm.payType" style="width:10vw;"> |
|
|
|
<el-option v-for="item in payments" :key="item" :label="item" :value="item" /> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="condition1"> |
|
|
|
<div class="condition-item2"> |
|
|
|
<el-text size="large" style="width:4vw;">退款途径</el-text> |
|
|
|
<el-select v-model="searchForm.auditStatus" style="width:10vw;"> |
|
|
|
<el-option v-for="item in auditStatusOptions" :key="item.value" :label="item.label" |
|
|
|
:value="item.value" /> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
<div class="condition-item2"> |
|
|
|
<el-text size="large" style="width:4vw;">订单状态</el-text> |
|
|
|
<el-input v-model="searchForm.productName" placeholder="请输入订单状态" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="condition-item2" style="width: 30vw;"> |
|
|
|
<el-text size="large" style="width:4vw;">付款时间</el-text> |
|
|
|
<el-date-picker v-model="dateRange" type="datetimerange" range-separator="至" start-placeholder="起始时间" |
|
|
|
end-placeholder="结束时间" style="width:22vw;" @change="handleDatePickerChange" |
|
|
|
:disabled-date="disabledDate" /> |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<el-button type="success">重置</el-button> |
|
|
|
<el-button type="primary">查询</el-button> |
|
|
|
<el-button type="warning">导出excel</el-button> |
|
|
|
<el-button type="primary">查看导出列表</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
<div style="height:4vh;"> |
|
|
|
<el-button type="primary" @click="showEdit = true">新增</el-button> |
|
|
|
</div> |
|
|
|
<el-card> |
|
|
|
<el-table :data="tableData" style="height:60vh;width:82vw"> |
|
|
|
<el-table-column type="index" label="序号" width="60" fixed="left" /> |
|
|
|
<el-table-column prop="name" label="Homily ID" width="120" fixed="left" /> |
|
|
|
<el-table-column prop="jwcode" label="姓名" width="120" fixed="left" show-overflow-tooltip /> |
|
|
@ -40,7 +95,114 @@ |
|
|
|
<el-pagination v-model:current-page="pagination.pageNum" v-model:page-size="pagination.pageSize" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" :total="pagination.total" style="margin-top: 1vh;" |
|
|
|
@size-change="handlePageSizeChange" @current-change="handleCurrentChange" /> |
|
|
|
</el-card> |
|
|
|
|
|
|
|
<el-dialog v-model="showEdit" class="edit" overflow draggable style="width: 40vw;"> |
|
|
|
<div style="display: flex;"> |
|
|
|
<div class="left"> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">精网号</el-text> |
|
|
|
<el-input v-model="editForm.jwcode" placeholder="请输入精网号" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">客户姓名</el-text> |
|
|
|
<el-input v-model="editForm.name" placeholder="请输入客户姓名" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">所属地区</el-text> |
|
|
|
<el-input v-model="editForm.market" placeholder="请输入所属地区" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">产品名称</el-text> |
|
|
|
<el-input v-model="editForm.orderCode" placeholder="请输入产品名称" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">退款类型</el-text> |
|
|
|
<el-select v-model="editForm.refundType" placeholder="请选择退款类型" style="width:10vw;" clearable> |
|
|
|
<el-option v-for="item in products" :key="item.value" :label="item.label" :value="item.value" /> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">付款币种</el-text> |
|
|
|
<el-select v-model="editForm.refundCurrency" placeholder="请选择付款币种" style="width:10vw;" clearable> |
|
|
|
<el-option v-for="item in currencies" :key="item.value" :label="item.label" |
|
|
|
:value="item.value" /> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">付款金额</el-text> |
|
|
|
<el-input v-model="editForm.refundAmount" placeholder="请输入付款金额" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">支付方式</el-text> |
|
|
|
<el-select v-model="editForm.paymentMethod" placeholder="请选择支付方式" style="width:10vw;"> |
|
|
|
<el-option v-for="item in payments" :key="item.value" :label="item.label" :value="item.value" /> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">付款时间</el-text> |
|
|
|
<el-date-picker v-model="editForm.payTime" type="datetime" placeholder="请选择付款时间" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">提交人</el-text> |
|
|
|
<el-input v-model="editForm.submitter" placeholder="请输入提交人" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">转账凭证</el-text> |
|
|
|
<el-form-item :rules="{ required: true, message: '请上传图片', trigger: 'change' }"> |
|
|
|
<el-upload ref="uploadRef" list-type="picture-card" :auto-upload="false" |
|
|
|
:http-request="customUpload" :on-change="handleImageChange" |
|
|
|
:on-success="handleUploadSuccess" :on-error="handleUploadError" |
|
|
|
:before-upload="beforeUpload" :show-file-list="false"> |
|
|
|
<template #default> |
|
|
|
<img v-if="editForm.imageUrl" :src="editForm.imageUrl" |
|
|
|
style="width: 100%; height: 100%; object-fit: cover;"> |
|
|
|
<el-icon v-else> |
|
|
|
<Plus /> |
|
|
|
</el-icon> |
|
|
|
</template> |
|
|
|
</el-upload> |
|
|
|
</el-form-item> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">备注</el-text> |
|
|
|
<el-input v-model="editForm.remark" placeholder="请输入备注" style="width:10vw;" :row="3" |
|
|
|
maxlength="100" type="textarea" show-word-limit clearable /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="right"> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">退款币种</el-text> |
|
|
|
<el-select v-model="editForm.refundCurrency" placeholder="请选择退款币种" style="width:10vw;"> |
|
|
|
<el-option v-for="item in currencies" :key="item.value" :label="item.label" :value="item.value" /> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">退款金额</el-text> |
|
|
|
<el-input v-model="editForm.refundAmount" placeholder="请输入退款金额" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">退款途径</el-text> |
|
|
|
<el-select v-model="editForm.refundWay" placeholder="请选择退款途径" style="width:10vw;"> |
|
|
|
<el-option v-for="item in refundWays" :key="item.value" :label="item.label" :value="item.value" /> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">退款时间</el-text> |
|
|
|
<el-date-picker v-model="editForm.refundTime" type="datetime" placeholder="请选择退款时间" style="width:10vw;" clearable /> |
|
|
|
</div> |
|
|
|
<div class="dialog-item"> |
|
|
|
<el-text style="width:4vw;">备注</el-text> |
|
|
|
<el-input v-model="editForm.remark" placeholder="请输入备注" style="width:10vw;" :rows="3" |
|
|
|
maxlength="100" show-word-limit type="textarea" clearable /> |
|
|
|
</div> |
|
|
|
<div style="display:flex;justify-content: center;margin-top: 5vh;"> |
|
|
|
<el-button type="default" @click="" style="margin-right: 2vw;">取消</el-button> |
|
|
|
<el-button type="primary" @click="">提交</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-dialog> |
|
|
|
</template> |
|
|
|
<script setup> |
|
|
|
import { ref } from 'vue' |
|
|
@ -53,4 +215,69 @@ const pagination = ref({ |
|
|
|
pageSize: 50, |
|
|
|
total: 0 |
|
|
|
}) |
|
|
|
</script> |
|
|
|
const searchForm = ref({ |
|
|
|
jwcode: '' |
|
|
|
}) |
|
|
|
const showEdit = ref(false) |
|
|
|
const editForm = ref({ |
|
|
|
jwcode: '' |
|
|
|
}) |
|
|
|
</script> |
|
|
|
<style scoped> |
|
|
|
.condition1 { |
|
|
|
width: 82vw; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
height: 4vh; |
|
|
|
|
|
|
|
.condition-item { |
|
|
|
width: 19%; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
margin-bottom: 1vh; |
|
|
|
margin-right: 0.5vw; |
|
|
|
} |
|
|
|
|
|
|
|
.condition-item2 { |
|
|
|
width: 19%; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
margin-right: 0.5vw; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.edit { |
|
|
|
.left { |
|
|
|
width: 45%; |
|
|
|
height: 60vh; |
|
|
|
padding: 0 2vw; |
|
|
|
|
|
|
|
.dialog-item { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
margin-bottom: 1vh; |
|
|
|
} |
|
|
|
|
|
|
|
.image { |
|
|
|
width: 4vw !important; |
|
|
|
height: 4vw !important; |
|
|
|
} |
|
|
|
|
|
|
|
:deep(.el-upload--picture-card) { |
|
|
|
width: 4vw !important; |
|
|
|
height: 4vw !important; |
|
|
|
padding: 0 !important; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.right { |
|
|
|
width: 50%; |
|
|
|
|
|
|
|
.dialog-item { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
margin-bottom: 1vh; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |