126 lines
4.4 KiB
Vue
126 lines
4.4 KiB
Vue
<template>
|
|
<div>
|
|
<el-card class="!border-none mb-4" shadow="never">
|
|
<el-tabs v-model="activeName" class="demo-tabs" @tab-change="tabChange">
|
|
<el-tab-pane label="概况" name="detail">
|
|
<el-descriptions class="margin-top" :column="4" border>
|
|
<!-- <template #extra>
|
|
<el-button type="primary">Operation</el-button>
|
|
</template> -->
|
|
<el-descriptions-item :span="4" label="单据编号">
|
|
{{ form.number }}
|
|
</el-descriptions-item>
|
|
<el-descriptions-item :span="2" label="单据金额">
|
|
{{ form.total }}
|
|
</el-descriptions-item>
|
|
<el-descriptions-item :span="2" label="抵扣金额">
|
|
{{ form.deduction_price }}
|
|
</el-descriptions-item>
|
|
<el-descriptions-item :span="2" label="实际金额">
|
|
{{ form.actual }}
|
|
</el-descriptions-item>
|
|
<el-descriptions-item :span="2" label="实收金额">
|
|
{{ form.money }}
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="所属商户">
|
|
{{ form.merchant_name }}
|
|
</el-descriptions-item>
|
|
</el-descriptions>
|
|
<el-table :data="pager.lists" border style="width: 100%; margin-top: 20px">
|
|
<el-table-column prop="id" label="ID" width="120" />
|
|
<el-table-column prop="goods_name" label="商品名称" />
|
|
<el-table-column prop="price" label="单价(元)" />
|
|
<el-table-column prop="unit_name" label="单位" />
|
|
<el-table-column prop="nums" label="数量" />
|
|
<el-table-column prop="total" label="合计(元)" />
|
|
<el-table-column prop="nums_count" label="已采纳数量" />
|
|
<el-table-column prop="is_push" label="推送状态">
|
|
<template #default="{ row }">
|
|
<span v-if="row.is_push == 0" style="color: #e6a23c;">未推送</span>
|
|
<span v-else>已推送</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="摊贩订单" name="order">
|
|
<subOrder ref="subOrderRef" />
|
|
</el-tab-pane>
|
|
<!-- <el-tab-pane label="报价列表" name="offer">
|
|
<goodsOffer ref="goodsOfferRef" />
|
|
</el-tab-pane>
|
|
<el-tab-pane label="未推送商品" name="notPushedGoods">
|
|
<el-button type="primary" @click="rePush">
|
|
重新推送
|
|
</el-button>
|
|
<el-table :data="pager.lists">
|
|
<el-table-column label="商品名称" prop="goods_name" show-overflow-tooltip />
|
|
<el-table-column label="单位" prop="unit_name" show-overflow-tooltip />
|
|
<el-table-column label="单价(元)" prop="price" show-overflow-tooltip />
|
|
<el-table-column prop="nums" label="数量" />
|
|
<el-table-column prop="total" label="合计(元)" />
|
|
<el-table-column label="备注" prop="data" show-overflow-tooltip />
|
|
</el-table>
|
|
</el-tab-pane> -->
|
|
</el-tabs>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup name="opurchaseclassDetail">
|
|
import { usePaging } from "@/hooks/usePaging";
|
|
import { useDictData } from "@/hooks/useDictOptions";
|
|
import {
|
|
apiOpurchaseclassLists,
|
|
apiOpurchaseclassDelete,
|
|
apiOpurchaseclassDetail,
|
|
apiOpurchaseinfoListList,
|
|
} from "@/api/opurchaseclass";
|
|
import { useRoute } from "vue-router";
|
|
import subOrder from "./component/subOrder.vue";
|
|
import goodsOffer from "./component/goodsOffer.vue";
|
|
|
|
const route = useRoute();
|
|
const form = ref({});
|
|
|
|
const activeName = ref("detail");
|
|
const activeMap = ref(
|
|
new Map([
|
|
["detail", true],
|
|
["order", false],
|
|
["offer", false],
|
|
["notPushedGoods", false],
|
|
])
|
|
);
|
|
const getDetail = async () => {
|
|
const data = await apiOpurchaseclassDetail({
|
|
id: route.query.id,
|
|
});
|
|
form.value = data;
|
|
};
|
|
getDetail();
|
|
|
|
const subOrderRef = ref(null);
|
|
const goodsOfferRef = ref(null);
|
|
const tabChange = (type: any) => {
|
|
if (!activeMap.value.get(type)) {
|
|
if (type == "order") subOrderRef.value?.getLists();
|
|
if (type == "offer") goodsOfferRef.value?.getLists();
|
|
activeMap.value.set(type, true);
|
|
}
|
|
};
|
|
|
|
|
|
// 查询条件
|
|
const queryParams = reactive({
|
|
id: route.query.id,
|
|
})
|
|
|
|
// 分页相关
|
|
const { pager, getLists, resetParams, resetPage } = usePaging({
|
|
fetchFun: apiOpurchaseinfoListList,
|
|
params: queryParams
|
|
})
|
|
getLists()
|
|
|
|
</script>
|