From 464d8c08220b066df7aca8e5e4c24b15b82b27e6 Mon Sep 17 00:00:00 2001
From: hwj <huangweijie@gdngsk.com>
Date: Fri, 26 Jun 2026 10:50:39 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E5=BA=93=E5=8C=BA=E4=BF=A1?=
 =?UTF-8?q?=E6=81=AF-=E6=B7=BB=E5=8A=A0=E4=BA=8C=E7=BB=B4=E7=A0=81/?=
 =?UTF-8?q?=E6=9D=A1=E5=BD=A2=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/erp/stock/warehousearea/index.ts      |  4 +
 src/locales/en.ts                             |  7 +-
 src/locales/zh-CN.ts                          |  7 +-
 .../erp/warehousearea/WarehouseAreaForm.vue   | 88 ++++++++++++++++++-
 4 files changed, 100 insertions(+), 6 deletions(-)

diff --git a/src/api/erp/stock/warehousearea/index.ts b/src/api/erp/stock/warehousearea/index.ts
index 5d0b9296..78923b50 100644
--- a/src/api/erp/stock/warehousearea/index.ts
+++ b/src/api/erp/stock/warehousearea/index.ts
@@ -4,6 +4,10 @@ export interface WarehouseAreaVO {
   id: number
   warehouseId: number
   areaCode: string
+  isCode?: boolean
+  qrcode?: string
+  qrcodeUrl?: string
+  templateJson?: string | any
   areaName: string
   areaSize: number
   description: string
diff --git a/src/locales/en.ts b/src/locales/en.ts
index 2c2a74e2..d6a68856 100644
--- a/src/locales/en.ts
+++ b/src/locales/en.ts
@@ -300,6 +300,7 @@ export default {
       areaSize: 'Area Size (�?',
       description: 'Description',
       status: 'Status',
+      qrcode: 'QR Code/Barcode',
       createTime: 'Create Time',
       placeholderWarehouseId: 'Please select warehouse',
       placeholderAreaCode: 'Please enter area code',
@@ -310,7 +311,11 @@ export default {
       validatorWarehouseIdRequired: 'Warehouse is required',
       validatorAreaCodeRequired: 'Area code is required',
       validatorAreaNameRequired: 'Area name is required',
-      validatorStatusRequired: 'Status is required'
+      validatorStatusRequired: 'Status is required',
+      qrcodeLoadError: 'Failed to load QR code',
+      qrcodeEmpty: 'No QR code',
+      qrcodeRefreshConfirm: 'Confirm to refresh this warehouse area QR code?',
+      qrcodePrintTitle: '{name} QR code print preview'
     },
     WarehouseLocation: {
       warehouseId: 'Warehouse',
diff --git a/src/locales/zh-CN.ts b/src/locales/zh-CN.ts
index d2a1407c..080f8ddb 100644
--- a/src/locales/zh-CN.ts
+++ b/src/locales/zh-CN.ts
@@ -300,6 +300,7 @@ export default {
       areaSize: '面积(㎡)',
       description: '库区描述',
       status: '开启状态',
+      qrcode: '二维码/条形码',
       createTime: '创建时间',
       placeholderWarehouseId: '请选择所属仓库',
       placeholderAreaCode: '请输入库区编码',
@@ -310,7 +311,11 @@ export default {
       validatorWarehouseIdRequired: '所属仓库不能为空',
       validatorAreaCodeRequired: '库区编码不能为空',
       validatorAreaNameRequired: '库区名称不能为空',
-      validatorStatusRequired: '开启状态不能为空'
+      validatorStatusRequired: '开启状态不能为空',
+      qrcodeLoadError: '二维码加载失败',
+      qrcodeEmpty: '暂无二维码',
+      qrcodeRefreshConfirm: '确认刷新该库区二维码吗？',
+      qrcodePrintTitle: '{name}二维码打印预览'
     },
     WarehouseLocation: {
       warehouseId: '所属仓库',
diff --git a/src/views/erp/warehousearea/WarehouseAreaForm.vue b/src/views/erp/warehousearea/WarehouseAreaForm.vue
index 83e87a00..91dfa37b 100644
--- a/src/views/erp/warehousearea/WarehouseAreaForm.vue
+++ b/src/views/erp/warehousearea/WarehouseAreaForm.vue
@@ -28,7 +28,7 @@
           </el-col>
           <el-col :xs="24" :sm="6" :md="4" :lg="3" :xl="2">
             <div>
-              <el-switch v-model="formData.isCode" :disabled="formType === 'update'" />
+              <el-switch v-model="formData.isCode" :disabled="formType === 'update'" @change="handleCodeAutoChange" />
             </div>
           </el-col>
         </el-row>
@@ -51,6 +51,21 @@
       <el-form-item :label="t('ErpStock.WarehouseArea.status')" prop="status">
         <el-switch v-model="formData.status" :active-value="CommonStatusEnum.ENABLE" :inactive-value="CommonStatusEnum.DISABLE" />
       </el-form-item>
+      <el-form-item v-if="formType === 'update'" :label="t('ErpStock.WarehouseArea.qrcode')" prop="qrcodeUrl">
+        <QrcodeActionCard
+          :image-url="currentQrcodeUrl"
+          :print-id="formData.id"
+          :print-title="t('ErpStock.WarehouseArea.qrcodePrintTitle', { name: formData.areaName || t('ErpStock.WarehouseArea.areaName') })"
+          :empty-text="t('ErpStock.WarehouseArea.qrcodeEmpty')"
+          :error-text="t('ErpStock.WarehouseArea.qrcodeLoadError')"
+          :refresh-url="getQrcodeRefreshUrl()"
+          :refresh-disabled="!formData.id || !formData.areaCode"
+          :refresh-confirm-text="t('ErpStock.WarehouseArea.qrcodeRefreshConfirm')"
+          :template-json="formData.templateJson"
+          :print-data="buildPrintData()"
+          @refresh-success="handleQrcodeRefreshSuccess"
+        />
+      </el-form-item>
     </el-form>
     <template #footer>
       <el-button @click="submitForm" type="primary" :disabled="formLoading">{{ t('common.ok') }}</el-button>
@@ -60,10 +75,10 @@
 </template>
 
 <script setup lang="ts">
-import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
 import { WarehouseAreaApi, WarehouseAreaVO } from '@/api/erp/stock/warehousearea'
 import { WarehouseApi } from '@/api/erp/stock/warehouse'
 import { CommonStatusEnum } from '@/utils/constants'
+import QrcodeActionCard from '@/components/QrcodeActionCard/index.vue'
 
 defineOptions({ name: 'WarehouseAreaForm' })
 
@@ -74,23 +89,40 @@ const dialogVisible = ref(false)
 const dialogTitle = ref('')
 const formLoading = ref(false)
 const formType = ref('')
-const formData = ref({
+const formData = ref<any>({
   id: undefined,
   warehouseId: undefined,
   areaCode: undefined,
+  qrcode: undefined,
+  qrcodeUrl: undefined,
+  templateJson: undefined,
   areaName: undefined,
   areaSize: undefined,
   description: undefined,
   status: undefined,
   isCode: true
 })
+const validateAreaCode = (_rule: any, value: any, callback: any) => {
+  if (Boolean(formData.value.isCode)) {
+    callback()
+    return
+  }
+  if (value === undefined || value === null || String(value).trim() === '') {
+    callback(new Error(t('ErpStock.WarehouseArea.validatorAreaCodeRequired')))
+    return
+  }
+  callback()
+}
+
 const formRules = reactive({
   warehouseId: [{ required: true, message: t('ErpStock.WarehouseArea.validatorWarehouseIdRequired'), trigger: 'blur' }],
+  areaCode: [{ validator: validateAreaCode, trigger: ['blur', 'change'] }],
   areaName: [{ required: true, message: t('ErpStock.WarehouseArea.validatorAreaNameRequired'), trigger: 'blur' }],
   status: [{ required: true, message: t('ErpStock.WarehouseArea.validatorStatusRequired'), trigger: 'blur' }]
 })
 const formRef = ref()
 const warehouseList = ref<any[]>([])
+const currentQrcodeUrl = computed(() => formData.value.qrcodeUrl || formData.value.qrcode || '')
 
 const open = async (type: string, id?: number) => {
   dialogVisible.value = true
@@ -101,7 +133,14 @@ const open = async (type: string, id?: number) => {
   if (id) {
     formLoading.value = true
     try {
-      formData.value = await WarehouseAreaApi.getWarehouseArea(id)
+      const areaData = await WarehouseAreaApi.getWarehouseArea(id)
+      const templateJson = areaData?.templateJson
+      formData.value = {
+        ...formData.value,
+        ...areaData,
+        templateJson: typeof templateJson === 'string' ? JSON.parse(templateJson) : templateJson,
+        isCode: false
+      }
     } finally {
       formLoading.value = false
     }
@@ -115,6 +154,9 @@ const submitForm = async () => {
   formLoading.value = true
   try {
     const data = { ...formData.value } as unknown as WarehouseAreaVO
+    delete (data as any).qrcode
+    delete (data as any).qrcodeUrl
+    delete (data as any).templateJson
     if (data.isCode) {
       data.areaCode = undefined
     }
@@ -132,11 +174,49 @@ const submitForm = async () => {
   }
 }
 
+const handleCodeAutoChange = (value: boolean) => {
+  if (value) {
+    formData.value.areaCode = undefined
+  }
+  formRef.value?.clearValidate('areaCode')
+}
+
+const getQrcodeRefreshUrl = () => {
+  if (!formData.value.id || !formData.value.areaCode) return ''
+  return `/erp/warehouse-area/regenerate-code?id=${formData.value.id}&code=${encodeURIComponent(String(formData.value.areaCode))}`
+}
+
+const buildPrintData = () => {
+  return {
+    id: formData.value.id,
+    areaCode: formData.value.areaCode,
+    areaName: formData.value.areaName,
+    warehouseId: formData.value.warehouseId,
+    description: formData.value.description,
+    qrcodeUrl: currentQrcodeUrl.value
+  }
+}
+
+const handleQrcodeRefreshSuccess = async (data: any) => {
+  const qrcode = data?.qrcodeUrl ?? data?.qrcode
+  if (qrcode) {
+    formData.value.qrcodeUrl = qrcode
+    return
+  }
+  if (!formData.value.id) return
+  const areaData = await WarehouseAreaApi.getWarehouseArea(formData.value.id)
+  formData.value.qrcodeUrl = areaData?.qrcodeUrl ?? areaData?.qrcode
+  formData.value.areaCode = areaData?.areaCode ?? formData.value.areaCode
+}
+
 const resetForm = () => {
   formData.value = {
     id: undefined,
     warehouseId: undefined,
     areaCode: undefined,
+    qrcode: undefined,
+    qrcodeUrl: undefined,
+    templateJson: undefined,
     areaName: undefined,
     areaSize: undefined,
     description: undefined,