|
|
@@ -1,130 +1,169 @@
|
|
|
-<!-- 退卡订单 -->
|
|
|
+<!-- 购卡订单 -->
|
|
|
<template>
|
|
|
<div class="silent-expire-alarm">
|
|
|
<!-- 搜索条件区 -->
|
|
|
<div class="search-section">
|
|
|
- <Search/>
|
|
|
+ <Search />
|
|
|
</div>
|
|
|
<!-- 数据表格 -->
|
|
|
- <a-table :columns="columns" :data="tableData" :pagination="pagination" :scroll="{ x: '100%', y: '400px' }">
|
|
|
- <template #detail="{ record }">
|
|
|
- <a-button @click="openDetail(record)" type="text">订单详情</a-button>
|
|
|
- </template>
|
|
|
- <template #orderStatus="{ record }">
|
|
|
- <a-tag color="orangered" v-if="record.moderationStatus == 1">待审核</a-tag>
|
|
|
- <a-tag color="arcoblue" v-if="record.moderationStatus == 2">审核通过</a-tag>
|
|
|
- <a-tag color="#f53f3f" v-if="record.moderationStatus == 3">已驳回</a-tag>
|
|
|
+ <a-table :data="tableData" :pagination="pageData" :columns="columns" @page-change="evChangePage"
|
|
|
+ :scroll="{ x: 'auto' }">
|
|
|
+ <template #image="{ record }">
|
|
|
+ <a-image width="60" height="60" :src="record.contractImg" :preview-props="{
|
|
|
+ actionsLayout: ['rotateRight', 'zoomIn', 'zoomOut'],
|
|
|
+ }">
|
|
|
+ </a-image>
|
|
|
</template>
|
|
|
<template #id="{ record }">
|
|
|
<div class="line_heis" @click="openDetail(record)">{{ record.id }}</div>
|
|
|
</template>
|
|
|
+ <template #statusType="{ record }">
|
|
|
+ <a-tag color="#ff7d00" v-if="record.moderationStatus == 1">待审核</a-tag>
|
|
|
+ <a-tag color="#00b42a" v-if="record.moderationStatus == 2">审核通过</a-tag>
|
|
|
+ <a-tag color="#f53f3f" v-if="record.moderationStatus == 3">已驳回</a-tag>
|
|
|
+ </template>
|
|
|
+ <template #LogisticsStatus="{ record }">
|
|
|
+ <a-tag color="#168cff" v-if="record.tmsStatus == 1">未发货</a-tag>
|
|
|
+ <a-tag color="#00b42a" v-if="record.tmsStatus == 2">已发货</a-tag>
|
|
|
+ </template>
|
|
|
<template #operate="{ record }">
|
|
|
- <a-button type="primary" @click="showAudit = true" v-if="record.moderationStatus==1 && record.status==2">审核</a-button>
|
|
|
+ <div class="setting">
|
|
|
+ <div v-if="userType == 1">
|
|
|
+ <a-button type="text" v-if="record.moderationStatus == 1 && record.status == 1"
|
|
|
+ @click="statusOrder(record)">审核</a-button>
|
|
|
+ </div>
|
|
|
+ <a-button @click="openPriceing(record)" type="text" v-if="record.moderationStatus == 2">上传金额</a-button>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</a-table>
|
|
|
|
|
|
+ <a-modal v-model:visible="showPrning" title="上传金额" @cancel="closeModal(showPrning, formPreing)" @ok="handelPriceing"
|
|
|
+ okText="保存" cancelText="关闭">
|
|
|
+ <a-form :model="formPreing" auto-label-width>
|
|
|
+ <a-form-item label="退货金额">
|
|
|
+ <a-input v-model="formPreing.returnAmount" placeholder="请输入退货金额" />
|
|
|
+ </a-form-item>
|
|
|
+ </a-form>
|
|
|
+ </a-modal>
|
|
|
+
|
|
|
|
|
|
- <Status v-model:modelValue="showAudit" @submit="intData()" />
|
|
|
- <<Detaile v-model:modelValue="showDetail" @submit="intData()" :FormDataList="FormDataList" />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { ref, reactive, onMounted, toRefs } from 'vue';
|
|
|
+import { ref, onMounted, toRefs } from 'vue';
|
|
|
import { Message } from '@arco-design/web-vue';
|
|
|
import { cancelOrderList } from '@/api/path/purchase';
|
|
|
-import { enum_dict } from "@/hooks/enum";
|
|
|
-import { Getdictionary } from "@/mixins/index.js";
|
|
|
-import Status from './status.vue'
|
|
|
+import { SettingPricing } from '@/api/path/order'
|
|
|
+import { Getdictionary } from '@/mixins/index.js'
|
|
|
import Search from '@/components/Search/index.vue'
|
|
|
+// 数据层
|
|
|
const state = ref({
|
|
|
- searchForm: {
|
|
|
- cardNumber: '',
|
|
|
- customerName: '',
|
|
|
- },
|
|
|
+ userName: localStorage.getItem('user_login_information')?.username,
|
|
|
+ userType: JSON.parse(localStorage.getItem('user_login_information'))?.userType, // 1平台 2用户
|
|
|
tableData: [],
|
|
|
- pagination: {
|
|
|
+ FormDataList: {},
|
|
|
+ pageData: {
|
|
|
total: 0,
|
|
|
- current: 1,
|
|
|
size: 10,
|
|
|
+ current: 1,
|
|
|
},
|
|
|
- showDetail: false,
|
|
|
- showAudit: false,
|
|
|
- FormDataList: {}
|
|
|
-})
|
|
|
-
|
|
|
-const { searchForm, tableData, pagination, showDetail, showAudit, FormDataList } = toRefs(state.value)
|
|
|
+ showStatus: false,
|
|
|
+ showPrning: false,
|
|
|
+ formPreing: {
|
|
|
+ id: '',
|
|
|
+ returnAmount: ''
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
+const {
|
|
|
+ userType,
|
|
|
+ tableData,
|
|
|
+ FormDataList,
|
|
|
+ pageData,
|
|
|
+ showStatus,
|
|
|
+ showPrning,
|
|
|
+ formPreing
|
|
|
+} = toRefs(state.value);
|
|
|
|
|
|
const columns = [
|
|
|
- { title: '序号', dataIndex: 'index', align: 'center', render: ({ rowIndex }) => rowIndex + 1 },
|
|
|
- {
|
|
|
- title: '订单编号', slotName: 'id', ellipsis: true,
|
|
|
- tooltip: true,
|
|
|
- },
|
|
|
- {
|
|
|
- title: '客户名称', dataIndex: 'userName', ellipsis: true,
|
|
|
- tooltip: true,
|
|
|
- },
|
|
|
- { title: '订单状态', slotName: 'orderStatus', ellipsis: true },
|
|
|
- {
|
|
|
- title: '供应商名称', dataIndex: 'sourceName', ellipsis: true,
|
|
|
- tooltip: true,
|
|
|
- },
|
|
|
- { title: '退卡张数', dataIndex: 'quantity', ellipsis: true },
|
|
|
- { title: '剩余时长', dataIndex: 'period_of_silence', ellipsis: true },
|
|
|
- { title: '退回金额', dataIndex: 'payment_amount', ellipsis: true },
|
|
|
+ { title: '序号', dataIndex: 'index', align: 'center', ellipsis: true },
|
|
|
+ { title: '订单编号', slotName: 'id', align: 'center', ellipsis: true },
|
|
|
+ { title: '审核状态', slotName: 'statusType', align: 'center', ellipsis: true },
|
|
|
+ { title: '物流状态', slotName: 'LogisticsStatus', align: 'center', ellipsis: true },
|
|
|
+ { title: '客户名称', dataIndex: 'userName', align: 'center', ellipsis: true },
|
|
|
+ { title: '购卡数', dataIndex: 'quantity', align: 'center', ellipsis: true },
|
|
|
+ { title: '静默期(月)', dataIndex: 'periodOfSilence', align: 'center', ellipsis: true },
|
|
|
+ { title: '卡类型', dataIndex: 'cardType', align: 'center', ellipsis: true },
|
|
|
+ { title: '运营商名称', dataIndex: 'sourceName', align: 'center', ellipsis: true },
|
|
|
+ { title: '资费', dataIndex: 'trafficName', align: 'center', ellipsis: true },
|
|
|
+ { title: '采购金额', dataIndex: 'amount', align: 'center', ellipsis: true },
|
|
|
+ { title: '合同照片', slotName: 'image', align: 'center', ellipsis: true },
|
|
|
+ { title: '下单时间', dataIndex: 'createdAt', align: 'center', ellipsis: true },
|
|
|
{ title: '操作', slotName: 'operate', align: 'center', ellipsis: true }
|
|
|
];
|
|
|
|
|
|
-// 查看订单详情
|
|
|
-const openDetail = (item) => {
|
|
|
- showDetail.value = true;
|
|
|
- FormDataList.value = item;
|
|
|
-}
|
|
|
-
|
|
|
-const resetSearch = () => {
|
|
|
- Object.keys(searchForm).forEach(key => {
|
|
|
- if (Array.isArray(searchForm[key])) {
|
|
|
- searchForm[key] = [];
|
|
|
- } else {
|
|
|
- searchForm[key] = null;
|
|
|
- }
|
|
|
- intData()
|
|
|
- });
|
|
|
- Message.success('搜索条件已重置');
|
|
|
-};
|
|
|
-
|
|
|
-// 列表-------------------------------------
|
|
|
// 订单列表
|
|
|
const intData = async () => {
|
|
|
const param = {
|
|
|
- current: pagination.value.current,
|
|
|
- size: pagination.value.size,
|
|
|
+ current: pageData.value.current,
|
|
|
+ size: pageData.value.size,
|
|
|
}
|
|
|
- const one = await Getdictionary('source')
|
|
|
- const two = await Getdictionary('cardType')
|
|
|
- const tree = await Getdictionary('subscriptionRelationshipStatus')
|
|
|
- const tive = await Getdictionary('orderAuditStatus')
|
|
|
+ const simTypeList = await Getdictionary('cardType')
|
|
|
+ let sourceList = await Getdictionary('source')
|
|
|
cancelOrderList(param).then(res => {
|
|
|
- tableData.value = (res.data.records || []).map(item => {
|
|
|
-
|
|
|
- const sourceName = one.filter((item) => item.typeKey == enum_dict.SOURCE)?.find(val => item.source == val.value)?.label
|
|
|
- const cardTypeName = two.filter((item) => item.typeKey == enum_dict.CARD_TYPE)?.find(val => item.card_type == val.value)?.label
|
|
|
- const statusName = tree.filter((item) => item.typeKey == enum_dict.SUBSCRIPTION_RELATIONSHIP_STATUS)?.find(val => item.status == val.value)?.label
|
|
|
- const moderationStatusName = tive.filter((item) => item.typeKey == enum_dict.ORDER_AUDIT_STATUS)?.find(val => item.moderation_status == val.value)?.label
|
|
|
-
|
|
|
+ tableData.value = (res.data.records || []).map((item, key) => {
|
|
|
+ const sourceName = sourceList.find(val => val.value == item.source)?.label
|
|
|
+ const cardType = simTypeList.find(val => val.value == item.simType)?.label
|
|
|
return {
|
|
|
...item,
|
|
|
- moderationStatusName,
|
|
|
- statusName,
|
|
|
- cardTypeName,
|
|
|
- sourceName
|
|
|
+ index: key + 1,
|
|
|
+ sourceName,
|
|
|
+ cardType
|
|
|
}
|
|
|
});
|
|
|
- pagination.value.total = res.data.total;
|
|
|
+ pageData.value.total = res.data.total;
|
|
|
+ })
|
|
|
+
|
|
|
+}
|
|
|
+// 分页
|
|
|
+const evChangePage = (page) => {
|
|
|
+ pageData.value.current = page
|
|
|
+ intData()
|
|
|
+}
|
|
|
+
|
|
|
+// 订单审核
|
|
|
+const statusOrder = (items) => {
|
|
|
+ FormDataList.value = items
|
|
|
+ showStatus.value = true
|
|
|
+}
|
|
|
+// 模态框取消
|
|
|
+const closeModal = (items, obj) => {
|
|
|
+ items = false
|
|
|
+ Object.keys(obj).forEach(key => {
|
|
|
+ if (obj.key) {
|
|
|
+ obj[key] = '';
|
|
|
+ }
|
|
|
})
|
|
|
+}
|
|
|
+
|
|
|
+const openPriceing = (data) => {
|
|
|
+ showPrning.value = true;
|
|
|
+ formPreing.value.id = data.id
|
|
|
+}
|
|
|
|
|
|
+const handelPriceing = async () => {
|
|
|
+ if (formPreing.value.returnAmount == '' || formPreing.value.returnAmount == 0) {
|
|
|
+ return Message.error('输入有误')
|
|
|
+ }
|
|
|
+ formPreing.value.returnAmount = Number(formPreing.value.returnAmount)
|
|
|
+ let res = await SettingPricing(formPreing.value)
|
|
|
+ if (res.code === 200) {
|
|
|
+ Message.success(res.message)
|
|
|
+ closeModal(showPrning.value, formPreing.value)
|
|
|
+ }
|
|
|
}
|
|
|
+
|
|
|
onMounted(() => {
|
|
|
intData();
|
|
|
})
|
|
|
@@ -136,6 +175,12 @@ onMounted(() => {
|
|
|
// background: #fcf;
|
|
|
}
|
|
|
|
|
|
+.setting {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
.search-section {
|
|
|
margin-bottom: 20px;
|
|
|
}
|
|
|
@@ -146,20 +191,17 @@ onMounted(() => {
|
|
|
|
|
|
.audit-txt {
|
|
|
display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
|
|
|
.audit-tag {
|
|
|
- margin-left: 20px;
|
|
|
- background: #63c2c6;
|
|
|
- color: #fff;
|
|
|
- font-size: 12px;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- padding: 0 10px;
|
|
|
- box-sizing: border-box;
|
|
|
- border-radius: 50px;
|
|
|
+ width: 180px;
|
|
|
+ color: #b2b2b2;
|
|
|
+ margin-right: 20px;
|
|
|
+
|
|
|
+ span {
|
|
|
+ color: #000;
|
|
|
+ margin-left: 20px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@@ -167,37 +209,7 @@ onMounted(() => {
|
|
|
margin-bottom: 10px;
|
|
|
}
|
|
|
|
|
|
-.detail-box {
|
|
|
- .detail-item-box {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 10px;
|
|
|
-
|
|
|
- .detail-item {
|
|
|
- //styleName: Body/Medium;
|
|
|
- font-family: PingFang SC;
|
|
|
- font-size: 14px;
|
|
|
- font-weight: 400;
|
|
|
- line-height: 22px;
|
|
|
- text-align: left;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- min-width: 350px;
|
|
|
-
|
|
|
- .item-label {
|
|
|
- color: rgba(0, 0, 0, 0.4);
|
|
|
- width: 120px;
|
|
|
- text-align: right;
|
|
|
- margin-right: 10px;
|
|
|
- }
|
|
|
|
|
|
- .item-content {
|
|
|
- color: rgba(51, 51, 51, 1);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
|
|
|
.detail-table {
|
|
|
margin-top: 20px;
|
|
|
@@ -212,4 +224,4 @@ onMounted(() => {
|
|
|
.line_heis:hover {
|
|
|
color: #168cff;
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|
