From 95c3ad6c39f6b00d25a3f2875374451d58fce389 Mon Sep 17 00:00:00 2001
From: dzc <2388224167@qq.com>
Date: Fri, 18 Apr 2025 14:35:48 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E6=AF=8F=E4=B8=AA=E8=B4=A7=E6=9F=9C?=
 =?UTF-8?q?=E7=8B=AC=E7=AB=8B=E5=BA=93=E5=AD=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/hard/hard-door-flow.ts                |   8 +
 src/api/hard/hard-door-manager.ts             |  11 ++
 src/components/Select/SelectCabinet.vue       | 115 +++++++++++++
 src/components/index.ts                       |   2 +
 src/views/hard/components/hard-door-log.vue   | 158 ++++++++++++++++++
 src/views/hard/components/shop-car.vue        |   3 +-
 .../hard/hard-after-sale/order-refund.vue     |   2 +
 src/views/hard/hard-door-flow/index.vue       |  36 +++-
 src/views/hard/hard-door-manager/index.vue    |  12 --
 src/views/hard/hard-spu-repertory/form.vue    |   8 +-
 src/views/hard/hard-spu-repertory/index.vue   |  11 +-
 11 files changed, 340 insertions(+), 26 deletions(-)
 create mode 100644 src/components/Select/SelectCabinet.vue
 create mode 100644 src/views/hard/components/hard-door-log.vue

diff --git a/src/api/hard/hard-door-flow.ts b/src/api/hard/hard-door-flow.ts
index 988c84a..df65d65 100644
--- a/src/api/hard/hard-door-flow.ts
+++ b/src/api/hard/hard-door-flow.ts
@@ -8,6 +8,14 @@ export function pageJoin(query?: Object) {
 	})
 }
 
+export function getByOrderId(query?: Object) {
+	return request({
+		url: "/hard/hard-door-flow/get-by-order-id",
+		method: "get",
+		params: query,
+	})
+}
+
 export function addObj(obj?: Object) {
 	return request({
 		url: "/hard/hard-door-flow",
diff --git a/src/api/hard/hard-door-manager.ts b/src/api/hard/hard-door-manager.ts
index 45a0f2e..8e62387 100644
--- a/src/api/hard/hard-door-manager.ts
+++ b/src/api/hard/hard-door-manager.ts
@@ -1,5 +1,16 @@
 import request from "/@/utils/request"
 
+/**
+ * 柜门下拉查询
+ */
+export function selectCabinet(params?: { hardDoorId: any; cabinetNo: any }) {
+	return request({
+		url: "/hard/hard-door-manager/select-cabinet",
+		method: "get",
+		params,
+	})
+}
+
 /**
  * 刷新智能柜货柜二维码
  * @param hardDoorId 柜子编号
diff --git a/src/components/Select/SelectCabinet.vue b/src/components/Select/SelectCabinet.vue
new file mode 100644
index 0000000..46fb83a
--- /dev/null
+++ b/src/components/Select/SelectCabinet.vue
@@ -0,0 +1,115 @@
+<template>
+	<el-select
+		style="width: 100%"
+		v-model="state.selectId"
+		:placeholder="props.placeholder"
+		:clearable="props.clearable"
+		remote-show-suffix
+		filterable
+		remote
+		:disabled="props.disabled"
+		:remote-method="remoteSearch"
+		:loading="state.loading"
+		@visible-change="(e: boolean) => e && getOptions()"
+		@change="change"
+	>
+		<el-option v-for="v in state.options" :key="v.id" :label="`${v.deviceCode}-${v.cabinetNo}`" :value="v.id">
+			<div class="flex items-center">
+				<div class="color-primary">{{ v.deviceCode }}-{{ v.cabinetNo }}</div>
+				<div class="flex items-center justify-center ml5">
+					<el-tag size="small"> {{ v.hardName }} </el-tag>
+				</div>
+			</div>
+		</el-option>
+	</el-select>
+</template>
+
+<script setup lang="ts" name="select-wallet-type">
+import { reactive } from "vue"
+import { useDict } from "/@/hooks/dict"
+import * as hardDoorManagerApi from "/@/api/hard/hard-door-manager"
+
+const emit = defineEmits(["change"])
+
+const selectId = defineModel()
+
+const props = withDefaults(
+	defineProps<{
+		placeholder?: string
+		disabled?: boolean
+		clearable?: boolean
+		autoFirst?: boolean
+		apiParams?: any
+	}>(),
+	{
+		placeholder: "请选择",
+		disabled: false,
+		clearable: true,
+		autoFirst: false,
+		apiParams: {},
+	},
+)
+
+const queryForm = reactive<any>({
+	cabinetNo: "",
+	current: 1,
+	size: 10,
+})
+
+const state = reactive<any>({
+	loading: true,
+	selectId: selectId,
+	options: [],
+	walletType: [],
+})
+
+watch(
+	selectId,
+	(newVal, oldValue) => {
+		if (newVal == oldValue) return
+		state.selectId = newVal
+		getOptions()
+	},
+	{ immediate: true },
+)
+
+async function getOptions() {
+	try {
+		state.loading = true
+		const _pa = {
+			...queryForm,
+			...props.apiParams,
+		}
+		const { data } = await hardDoorManagerApi.selectCabinet(_pa)
+		state.options = data.records ?? []
+		if (props.autoFirst && state.options.length != 0) {
+			state.selectId = state.options[0].id
+			emit("change", selectId)
+		}
+		const { wallet_type } = useDict("wallet_type")
+		state.walletType = wallet_type
+	} finally {
+		setTimeout(() => (state.loading = false), 500)
+	}
+}
+
+function remoteSearch(params: string) {
+	if (params != queryForm.cabinetNo) {
+		queryForm.cabinetNo = params
+		getOptions()
+	}
+}
+
+function clear() {
+	state.selectId = null
+	getOptions()
+}
+
+function change() {
+	emit("change", selectId)
+}
+
+onMounted(() => {
+	props.autoFirst && getOptions()
+})
+</script>
diff --git a/src/components/index.ts b/src/components/index.ts
index 8c7316c..a36b255 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -32,6 +32,7 @@ import SelectHard from "/@/components/Select/SelectHard.vue"
 import SelectHardSpu from "/@/components/Select/SelectHardSpu.vue"
 import SelectHardGroup from "/@/components/Select/selectHardGroup.vue"
 import SelectRole from "/@/components/Select/SelectRole.vue"
+import SelectCabinet from "/@/components/Select/SelectCabinet.vue"
 
 // 第三方组件
 import ElementPlus from "element-plus"
@@ -85,6 +86,7 @@ export default {
 		app.component("SelectSupplier", SelectSupplier)
 		app.component("SelectMchRule", SelectMchRule)
 		app.component("SelectRole", SelectRole)
+		app.component("SelectCabinet", SelectCabinet)
 
 		// 导入全部的elmenet-plus的图标
 		for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
diff --git a/src/views/hard/components/hard-door-log.vue b/src/views/hard/components/hard-door-log.vue
new file mode 100644
index 0000000..cce0ea5
--- /dev/null
+++ b/src/views/hard/components/hard-door-log.vue
@@ -0,0 +1,158 @@
+<template>
+	<div v-loading="loading">
+		<el-descriptions v-if="detail" title="智能柜日志">
+			<el-descriptions-item labelClassName="no-colon">
+				<el-timeline>
+					<el-timeline-item placement="top">
+						<div class="el-timeline-right-content">
+							<el-tag type="info" style="width: 120px">用户授权</el-tag>
+							<span class="color-primary ml-2">{{ detail.createTime }}</span>
+						</div>
+					</el-timeline-item>
+				</el-timeline>
+				<el-timeline v-if="detail.requestOpenTime">
+					<el-timeline-item placement="top">
+						<div class="el-timeline-right-content">
+							<el-tag type="info" style="width: 120px">智能柜申请开门</el-tag>
+							<span class="color-primary ml-2">{{ detail.requestOpenTime }}</span>
+						</div>
+					</el-timeline-item>
+				</el-timeline>
+				<el-timeline v-if="detail.openCallbackTime">
+					<el-timeline-item placement="top">
+						<div class="el-timeline-right-content">
+							<el-tag type="info" style="width: 120px">智能柜开门响应</el-tag>
+							<span class="color-primary ml-2">{{ detail.openCallbackTime }}</span>
+						</div>
+					</el-timeline-item>
+				</el-timeline>
+				<el-timeline v-if="detail.videoCallbackTime">
+					<el-timeline-item placement="top">
+						<div class="el-timeline-right-content">
+							<el-tag type="info" style="width: 120px">智能柜视频回调</el-tag>
+							<span class="color-primary ml-2">{{ detail.videoCallbackTime }}</span>
+						</div>
+					</el-timeline-item>
+				</el-timeline>
+				<el-timeline v-if="detail.skuSubmitTime">
+					<el-timeline-item placement="top">
+						<div class="el-timeline-right-content">
+							<el-tag type="info" style="width: 120px">商品提交识别</el-tag>
+							<span class="color-primary ml-2">{{ detail.skuSubmitTime }}</span>
+						</div>
+					</el-timeline-item>
+				</el-timeline>
+				<el-timeline v-if="detail.skuCallbackTime">
+					<el-timeline-item placement="top">
+						<div class="el-timeline-right-content">
+							<el-tag type="info" style="width: 120px">商品识别响应</el-tag>
+							<span class="color-primary ml-2">{{ detail.skuCallbackTime }}</span>
+						</div>
+					</el-timeline-item>
+				</el-timeline>
+				<el-timeline v-if="detail.payTime">
+					<el-timeline-item placement="top">
+						<div class="el-timeline-right-content">
+							<el-tag type="info" style="width: 120px">订单结算</el-tag>
+							<span class="color-primary ml-2">{{ detail.payTime }}</span>
+						</div>
+					</el-timeline-item>
+				</el-timeline>
+				<el-timeline v-if="detail.error && detail.errorDesc">
+					<el-timeline-item placement="top">
+						<div class="el-timeline-right-content">
+							<el-tag type="danger" style="width: 120px">错误</el-tag>
+							<span class="color-danger ml-2">{{ detail.errorDesc }}</span>
+						</div>
+					</el-timeline-item>
+				</el-timeline>
+			</el-descriptions-item>
+		</el-descriptions>
+	</div>
+</template>
+<script setup lang="ts" name="hard-door-log">
+import * as hardFlowManager from "/@/api/hard/hard-door-flow"
+
+type Props = {
+	orderId?: string
+}
+const props = withDefaults(defineProps<Props>(), { orderId: "" })
+
+const detail = ref<any>({})
+const loading = ref<boolean>(false)
+
+watch(
+	() => props.orderId,
+	() => {
+		getFlow()
+	},
+)
+
+const getFlow = async () => {
+	if (!props.orderId) return
+	loading.value = true
+	try {
+		const _pa = { orderId: props.orderId }
+		const { data } = await hardFlowManager.getByOrderId(_pa)
+		detail.value = data
+	} catch (e) {
+		console.error(e)
+	} finally {
+		loading.value = false
+	}
+}
+
+onMounted(() => {
+	getFlow()
+})
+</script>
+<style lang="scss" scoped>
+// 时间线样式调整
+:deep(.el-timeline) {
+	margin: 10px 0 0 160px;
+
+	.el-timeline-item__wrapper {
+		position: relative;
+		top: -20px;
+
+		.el-timeline-item__timestamp {
+			position: absolute !important;
+			top: 10px;
+			left: -150px;
+		}
+	}
+
+	.el-timeline-right-content {
+		display: flex;
+		align-items: center;
+		min-height: 30px;
+		padding: 10px;
+		background-color: #409eff;
+
+		&::before {
+			position: absolute;
+			top: 10px;
+			left: 13px;
+			border-color: transparent #409eff transparent transparent;
+			border-style: solid;
+			border-width: 8px;
+			content: "";
+		}
+	}
+
+	.el-timeline-item__node {
+		position: absolute;
+		left: -5px;
+		top: -50%;
+		transform: translateY(100%);
+		display: flex;
+		width: 20px;
+		height: 20px;
+		font-size: 10px;
+		background: #409eff;
+		border-radius: 50%;
+		justify-content: center;
+		align-items: center;
+	}
+}
+</style>
diff --git a/src/views/hard/components/shop-car.vue b/src/views/hard/components/shop-car.vue
index 133de39..ae6f65f 100644
--- a/src/views/hard/components/shop-car.vue
+++ b/src/views/hard/components/shop-car.vue
@@ -54,8 +54,7 @@ const state: BasicTableProps = reactive<BasicTableProps>({
 })
 
 //  table hook
-const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } =
-	useTable(state)
+const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state)
 
 // 打开弹窗
 const openDialog = (id: string) => {
diff --git a/src/views/hard/hard-after-sale/order-refund.vue b/src/views/hard/hard-after-sale/order-refund.vue
index b972503..1877139 100644
--- a/src/views/hard/hard-after-sale/order-refund.vue
+++ b/src/views/hard/hard-after-sale/order-refund.vue
@@ -124,6 +124,7 @@
 					</el-timeline>
 				</el-descriptions-item>
 			</el-descriptions>
+			<hard-door-log :orderId="globalData.detail.id" />
 		</div>
 
 		<refund-reject-form ref="refundRejectRef" @refresh="getDetail" />
@@ -142,6 +143,7 @@ import { ElLoading } from "element-plus"
 
 // 引入组件
 const RefundRejectForm = defineAsyncComponent(() => import("./refund-reject.vue"))
+const HardDoorLog = defineAsyncComponent(() => import("../components/hard-door-log.vue"))
 
 // 定义查询字典
 const { hard_pay_type, hard_order_type, hard_order_status, hard_after_sale_way, hard_after_sale_type, hard_sale_status, hard_type } =
diff --git a/src/views/hard/hard-door-flow/index.vue b/src/views/hard/hard-door-flow/index.vue
index bbca6ea..00b369e 100644
--- a/src/views/hard/hard-door-flow/index.vue
+++ b/src/views/hard/hard-door-flow/index.vue
@@ -2,6 +2,23 @@
 	<div class="layout-padding">
 		<div class="layout-padding-auto layout-padding-view">
 			<el-row>
+				<el-form ref="queryRef" :inline="true" :model="state.queryForm" @keyup.enter="getDataList">
+					<el-row>
+						<el-form-item style="width: 300px" label="用户" prop="userId">
+							<select-user v-model="state.queryForm.userId" />
+						</el-form-item>
+						<el-form-item style="width: 300px" label="流程类型" prop="bizType">
+							<dict-select v-model="state.queryForm.bizType" dict-code="hard_door_flow_biz" />
+						</el-form-item>
+						<el-form-item style="width: 400px" label="创建时间" prop="createTimeList">
+							<el-date-picker v-model="state.queryForm.createTimeList" value-format="YYYY-MM-DD" type="daterange" />
+						</el-form-item>
+						<el-form-item>
+							<el-button icon="Search" type="primary" @click="getDataList">{{ $t("common.queryBtn") }}</el-button>
+							<el-button icon="Refresh" @click="resetQuery">{{ $t("common.resetBtn") }}</el-button>
+						</el-form-item>
+					</el-row>
+				</el-form>
 				<div class="mb8" style="width: 100%">
 					<right-toolbar
 						v-model:showSearch="showSearch"
@@ -24,6 +41,19 @@
 			>
 				<el-table-column type="selection" width="40" align="center" />
 				<el-table-column type="index" label="#" width="80" />
+				<el-table-column label="流程">
+					<el-table-column prop="bizType" label="流程类型" width="120">
+						<template #default="{ row }">
+							<dict-tag :options="hard_door_flow_biz" :value="row.bizType" />
+						</template>
+					</el-table-column>
+					<el-table-column prop="flowStatus" label="当前流程" width="120">
+						<template #default="{ row }">
+							<dict-tag :options="hard_door_flow" :value="row.flowStatus" />
+						</template>
+					</el-table-column>
+					<el-table-column prop="errorDesc" label="错误描述" width="120" />
+				</el-table-column>
 				<el-table-column label="购买用户">
 					<el-table-column prop="username" label="姓名" width="120" />
 					<el-table-column prop="userMobile" label="手机号" width="120" />
@@ -77,7 +107,9 @@
 						</template>
 					</el-table-column>
 				</el-table-column>
-				<el-table-column label="操作" width="150"> </el-table-column>
+				<el-table-column label="支付流程">
+					<el-table-column prop="payTime" label="支付成功时间" width="180" />
+				</el-table-column>
 			</el-table>
 			<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
 		</div>
@@ -92,7 +124,7 @@ import { useDict } from "/@/hooks/dict"
 
 // 引入组件
 // 定义查询字典
-const { yes_no_type } = useDict("yes_no_type")
+const { yes_no_type, hard_door_flow_biz, hard_door_flow } = useDict("yes_no_type", "hard_door_flow_biz", "hard_door_flow")
 // 定义变量内容
 // 搜索变量
 const queryRef = ref()
diff --git a/src/views/hard/hard-door-manager/index.vue b/src/views/hard/hard-door-manager/index.vue
index 29835da..062f5aa 100644
--- a/src/views/hard/hard-door-manager/index.vue
+++ b/src/views/hard/hard-door-manager/index.vue
@@ -177,18 +177,6 @@
 					</div>
 				</el-tab-pane>
 			</el-tabs>
-
-			<el-descriptions title="智能柜日志">
-				<el-descriptions-item labelClassName="no-colon">
-					<el-timeline>
-						<el-timeline-item v-for="v in new Array(2).fill({})" :key="v.id" timestamp="2025-1-1 222222" placement="top">
-							<div class="el-timeline-right-content">
-								<span>{{ "121121" }}</span>
-							</div>
-						</el-timeline-item>
-					</el-timeline>
-				</el-descriptions-item>
-			</el-descriptions>
 		</div>
 
 		<!-- 柜子设置 -->
diff --git a/src/views/hard/hard-spu-repertory/form.vue b/src/views/hard/hard-spu-repertory/form.vue
index 4c8f9e9..054f513 100644
--- a/src/views/hard/hard-spu-repertory/form.vue
+++ b/src/views/hard/hard-spu-repertory/form.vue
@@ -2,6 +2,11 @@
 	<el-dialog :title="form.id ? '编辑' : '新增'" width="40%" v-model="visible" :close-on-click-modal="false" draggable>
 		<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="120px" v-loading="loading">
 			<el-row :gutter="24">
+				<el-col :span="24" class="mb20">
+					<el-form-item label="柜门" prop="cabinetId">
+						<select-cabinet v-model="form.cabinetId" />
+					</el-form-item>
+				</el-col>
 				<el-col :span="24" class="mb20">
 					<el-form-item label="商品" prop="spuId">
 						<select-hard-spu v-model="form.spuId" />
@@ -39,13 +44,14 @@ const loading = ref(false)
 const form = reactive({
 	id: "",
 	userId: "",
-	hardId: "",
+	cabinetId: "",
 	spuId: "",
 	count: 5,
 })
 
 // 定义校验规则
 const dataRules = ref({
+	cabinetId: [{ required: true, message: "请选择柜门", trigger: "change" }],
 	spuId: [{ required: true, message: "请选择商品", trigger: "change" }],
 	count: [{ required: true, message: "请输入库存量", trigger: "blur" }],
 })
diff --git a/src/views/hard/hard-spu-repertory/index.vue b/src/views/hard/hard-spu-repertory/index.vue
index aa397d5..9ac924b 100644
--- a/src/views/hard/hard-spu-repertory/index.vue
+++ b/src/views/hard/hard-spu-repertory/index.vue
@@ -69,13 +69,6 @@
 					</el-table-column>
 				</el-table-column>
 				<el-table-column prop="hardId" label="设备">
-					<el-table-column min-width="120" label="所属商家">
-						<template #default="{ row }">
-							<span class="color-primary">
-								{{ row.merchantName }}
-							</span>
-						</template>
-					</el-table-column>
 					<el-table-column min-width="120" label="设备名称">
 						<template #default="{ row }">
 							<span class="color-primary">
@@ -83,9 +76,9 @@
 							</span>
 						</template>
 					</el-table-column>
-					<el-table-column min-width="120" label="放置层数">
+					<el-table-column min-width="120" label="设备编号">
 						<template #default="{ row }">
-							<span class="color-primary"> {{ row.hardDoorNumber }}层 </span>
+							<span class="color-primary"> {{ row.deviceCode }}-{{ row.cabinetNo }} </span>
 						</template>
 					</el-table-column>
 				</el-table-column>