linweidong
/
besure_web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style：物料档案-详情-调整字段排版

Browse Source
main
黄伟杰 3 weeks ago
parent e9ee3946ed
commit d00e0da6c1
2 changed files with 183 additions and 255 deletions
Show Stats Download Patch File Download Diff File

325
src/views/erp/product/product/ProductForm.vue
Unescape Escape View File

@ -13,19 +13,14 @@
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogBarCodeLabel')" prop="barCode"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogBarCodeLabel')" prop="barCode">
<el-row :gutter="10" style="width: 100%"> <el-row :gutter="10" style="width: 100%">
<el-col :xs="24" :sm="18" :md="16" :lg="14" :xl="20"> <el-col :xs="24" :sm="18" :md="16" :lg="14" :xl="20">
<el-input <el-input v-model="formData.barCode"
v-model="formData.barCode"
:placeholder="t('FactoryModeling.ProductInformation.dialogBarCodePlaceholder')" :placeholder="t('FactoryModeling.ProductInformation.dialogBarCodePlaceholder')"
:disabled="Boolean(formData.isCode) || formType === 'update'" :disabled="Boolean(formData.isCode) || formType === 'update'" />
/>
</el-col> </el-col>
<el-col :xs="24" :sm="6" :md="4" :lg="3" :xl="2"> <el-col :xs="24" :sm="6" :md="4" :lg="3" :xl="2">
<div> <div>
<el-switch <el-switch v-model="formData.isCode" :disabled="formType === 'update'"
v-model="formData.isCode" @change="handleCodeAutoChange" />
:disabled="formType === 'update'"
@change="handleCodeAutoChange"
/>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
@ -34,11 +29,8 @@
<el-col :span="12"> <el-col :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogCategoryTypeLabel')" prop="categoryType"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogCategoryTypeLabel')" prop="categoryType">
<el-radio-group v-model="formData.categoryType" @change="handleCategoryTypeChange"> <el-radio-group v-model="formData.categoryType" @change="handleCategoryTypeChange">
<el-radio <el-radio v-for="dict in getIntDictOptions(DICT_TYPE.MATERIAL_CLASSIFICATION_TYPE)" :key="dict.value"
v-for="dict in getIntDictOptions(DICT_TYPE.MATERIAL_CLASSIFICATION_TYPE)" :label="dict.value">
:key="dict.value"
:label="dict.value"
>
{{ dict.label }} {{ dict.label }}
</el-radio> </el-radio>
</el-radio-group> </el-radio-group>
@ -46,31 +38,22 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogNameLabel')" prop="name"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogNameLabel')" prop="name">
<el-input v-model="formData.name" :placeholder="t('FactoryModeling.ProductInformation.dialogNamePlaceholder')" /> <el-input v-model="formData.name"
:placeholder="t('FactoryModeling.ProductInformation.dialogNamePlaceholder')" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogCategoryLabel')" prop="categoryId"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogCategoryLabel')" prop="categoryId">
<el-tree-select <el-tree-select v-model="formData.categoryId" :data="categoryList" :props="defaultProps" check-strictly
v-model="formData.categoryId" default-expand-all :placeholder="t('FactoryModeling.ProductInformation.dialogCategoryPlaceholder')"
:data="categoryList" class="w-1/1" />
:props="defaultProps"
check-strictly
default-expand-all
:placeholder="t('FactoryModeling.ProductInformation.dialogCategoryPlaceholder')"
class="w-1/1"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogUnitLabel')" prop="unitId"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogUnitLabel')" prop="unitId">
<el-select v-model="formData.unitId" clearable :placeholder="t('FactoryModeling.ProductInformation.dialogUnitPlaceholder')" class="w-1/1"> <el-select v-model="formData.unitId" clearable
<el-option :placeholder="t('FactoryModeling.ProductInformation.dialogUnitPlaceholder')" class="w-1/1">
v-for="unit in unitList" <el-option v-for="unit in unitList" :key="unit.id" :label="unit.name" :value="unit.id" />
:key="unit.id"
:label="unit.name"
:value="unit.id"
/>
<template #footer> <template #footer>
<div v-if="!isAddingUnit" class="px-10px py-6px"> <div v-if="!isAddingUnit" class="px-10px py-6px">
<el-button text bg size="small" @click.stop="onAddUnit('unit')"> <el-button text bg size="small" @click.stop="onAddUnit('unit')">
@ -78,12 +61,7 @@
</el-button> </el-button>
</div> </div>
<div v-else class="px-10px py-6px"> <div v-else class="px-10px py-6px">
<el-input <el-input v-model="unitInputName" size="small" placeholder="请输入单位名称" class="mb-6px" />
v-model="unitInputName"
size="small"
placeholder="请输入单位名称"
class="mb-6px"
/>
<div class="flex gap-6px"> <div class="flex gap-6px">
<el-button type="primary" size="small" @click.stop="onConfirmAddUnit('unit')">确定</el-button> <el-button type="primary" size="small" @click.stop="onConfirmAddUnit('unit')">确定</el-button>
<el-button size="small" @click.stop="clearAddUnit()">取消</el-button> <el-button size="small" @click.stop="clearAddUnit()">取消</el-button>
@ -93,15 +71,13 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="formData.categoryType === 2 || formData.categoryType === 3" :span="12"> <el-col v-if="formData.categoryType === 2 || formData.categoryType === 3" :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogPurchaseUnitLabel')" prop="purchaseUnitId"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogPurchaseUnitLabel')"
<el-select v-model="formData.purchaseUnitId" clearable :placeholder="t('FactoryModeling.ProductInformation.dialogUnitPlaceholder')" class="w-1/1" @change="handlePurchaseUnitChange"> prop="purchaseUnitId">
<el-option <el-select v-model="formData.purchaseUnitId" clearable
v-for="unit in unitList" :placeholder="t('FactoryModeling.ProductInformation.dialogUnitPlaceholder')" class="w-1/1"
:key="unit.id" @change="handlePurchaseUnitChange">
:label="unit.name" <el-option v-for="unit in unitList" :key="unit.id" :label="unit.name" :value="unit.id" />
:value="unit.id"
/>
<template #footer> <template #footer>
<div v-if="!isAddingPurchaseUnit" class="px-10px py-6px"> <div v-if="!isAddingPurchaseUnit" class="px-10px py-6px">
<el-button text bg size="small" @click.stop="onAddUnit('purchaseUnit')"> <el-button text bg size="small" @click.stop="onAddUnit('purchaseUnit')">
@ -109,14 +85,10 @@
</el-button> </el-button>
</div> </div>
<div v-else class="px-10px py-6px"> <div v-else class="px-10px py-6px">
<el-input <el-input v-model="unitInputName" size="small" placeholder="请输入单位名称" class="mb-6px" />
v-model="unitInputName"
size="small"
placeholder="请输入单位名称"
class="mb-6px"
/>
<div class="flex gap-6px"> <div class="flex gap-6px">
<el-button type="primary" size="small" @click.stop="onConfirmAddUnit('purchaseUnit')">确定</el-button> <el-button type="primary" size="small"
@click.stop="onConfirmAddUnit('purchaseUnit')">确定</el-button>
<el-button size="small" @click.stop="clearAddUnit()">取消</el-button> <el-button size="small" @click.stop="clearAddUnit()">取消</el-button>
</div> </div>
</div> </div>
@ -124,74 +96,58 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="formData.categoryType === 2 || formData.categoryType === 3" :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogPurchaseUnitConvertLabel')"
prop="purchaseUnitConvertQuantity">
<el-input-number v-model="formData.purchaseUnitConvertQuantity" :min="0" :step="0.01" class="!w-1/1" />
<div class="form-item-tip">{{ purchaseUnitConvertTipText }}</div>
</el-form-item>
</el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogStandardLabel')" prop="standard"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogStandardLabel')" prop="standard">
<el-input v-model="formData.standard" :placeholder="t('FactoryModeling.ProductInformation.dialogStandardPlaceholder')" /> <el-input v-model="formData.standard"
:placeholder="t('FactoryModeling.ProductInformation.dialogStandardPlaceholder')" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogExpiryDayLabel')" prop="expiryDay"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogExpiryDayLabel')" prop="expiryDay">
<el-input-number <el-input-number v-model="formData.expiryDay"
v-model="formData.expiryDay" :placeholder="t('FactoryModeling.ProductInformation.dialogExpiryDayPlaceholder')" :min="0"
:placeholder="t('FactoryModeling.ProductInformation.dialogExpiryDayPlaceholder')" :precision="0" class="!w-1/1" />
:min="0"
:precision="0"
class="!w-1/1"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="isProductCategory" :span="12"> <el-col v-if="isProductCategory" :span="12">
<el-form-item label="关联设备" prop="devices"> <el-form-item label="关联设备" prop="devices">
<el-input <el-input :model-value="deviceDisplayText" placeholder="点击选择设备" readonly
:model-value="deviceDisplayText" @click="openDeviceSelectDialog" />
placeholder="点击选择设备"
readonly
@click="openDeviceSelectDialog"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="isProductCategory" :span="12"> <el-col v-if="isProductCategory" :span="12">
<el-form-item label="关联模具" prop="molds"> <el-form-item label="关联模具" prop="molds">
<el-input <el-input :model-value="moldDisplayText" placeholder="点击选择模具" readonly @click="openMoldSelectDialog" />
:model-value="moldDisplayText"
placeholder="点击选择模具"
readonly
@click="openMoldSelectDialog"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="formData.categoryType === 1" :span="12"> <el-col v-if="formData.categoryType === 1" :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogPackagingSchemeLabel')" prop="packagingSchemes"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogPackagingSchemeLabel')"
<el-input prop="packagingSchemes">
:model-value="displayPackagingSchemeText" <el-input :model-value="displayPackagingSchemeText" readonly clearable
readonly
clearable
:placeholder="t('FactoryModeling.ProductInformation.dialogPackagingSchemePlaceholder')" :placeholder="t('FactoryModeling.ProductInformation.dialogPackagingSchemePlaceholder')"
@click="openPackagingSchemeDialog" @click="openPackagingSchemeDialog" @clear="handlePackagingSchemeClear" />
@clear="handlePackagingSchemeClear"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="formData.categoryType === 2 || formData.categoryType === 3" :span="12"> <el-col v-if="formData.categoryType === 2 || formData.categoryType === 3" :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogSupplierLabel')" prop="suppliers"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogSupplierLabel')" prop="suppliers">
<el-input <el-input :model-value="displaySupplierText" readonly clearable
:model-value="displaySupplierText"
readonly
clearable
:placeholder="t('FactoryModeling.ProductInformation.dialogSupplierPlaceholder')" :placeholder="t('FactoryModeling.ProductInformation.dialogSupplierPlaceholder')"
@click="openSupplierDialog" @click="openSupplierDialog" @clear="handleSupplierClear" />
@clear="handleSupplierClear"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="formData.categoryType === 3" :span="8"> <el-col v-if="formData.categoryType === 3" :span="8">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogSparePartLevelLabel')" prop="sparePartLevel"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogSparePartLevelLabel')"
prop="sparePartLevel">
<el-radio-group v-model="formData.sparePartLevel"> <el-radio-group v-model="formData.sparePartLevel">
<el-radio <el-radio v-for="dict in getIntDictOptions(DICT_TYPE.SPARE_PARTS_LEVEL)" :key="dict.value"
v-for="dict in getIntDictOptions(DICT_TYPE.SPARE_PARTS_LEVEL)" :label="dict.value">
:key="dict.value"
:label="dict.value"
>
{{ dict.label }} {{ dict.label }}
</el-radio> </el-radio>
</el-radio-group> </el-radio-group>
@ -206,29 +162,22 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="formData.categoryType === 3" :span="8"> <el-col v-if="formData.categoryType === 3" :span="8">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogPurchaseCycleLabel')" prop="purchaseCycle"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogPurchaseCycleLabel')"
prop="purchaseCycle">
<el-input-number v-model="formData.purchaseCycle" :min="0" :precision="0" class="!w-1/1" /> <el-input-number v-model="formData.purchaseCycle" :min="0" :precision="0" class="!w-1/1" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col v-if="formData.categoryType === 3" :span="8"> <el-col v-if="formData.categoryType === 3" :span="8">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogBrandLabel')" prop="brand"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogBrandLabel')" prop="brand">
<el-input v-model="formData.brand" :placeholder="t('FactoryModeling.ProductInformation.dialogBrandPlaceholder')" /> <el-input v-model="formData.brand"
</el-form-item> :placeholder="t('FactoryModeling.ProductInformation.dialogBrandPlaceholder')" />
</el-col>
<el-col v-if="formData.categoryType === 2 || formData.categoryType === 3" :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogPurchaseUnitConvertLabel')" prop="purchaseUnitConvertQuantity">
<el-input-number v-model="formData.purchaseUnitConvertQuantity" :min="0" :step="0.01" class="!w-1/1" />
<div class="form-item-tip">{{ purchaseUnitConvertTipText }}</div>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogStatusLabel')" prop="status"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogStatusLabel')" prop="status">
<el-radio-group v-model="formData.status"> <el-radio-group v-model="formData.status">
<el-radio <el-radio v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" :key="dict.value"
v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" :label="dict.value">
:key="dict.value"
:label="dict.value"
>
{{ dict.label }} {{ dict.label }}
</el-radio> </el-radio>
</el-radio-group> </el-radio-group>
@ -237,21 +186,15 @@
<el-col v-if="formType === 'update'" :span="24"> <el-col v-if="formType === 'update'" :span="24">
<div class="flex items-start gap-20px"> <div class="flex items-start gap-20px">
<el-form-item :label="t('FactoryModeling.ProductInformation.qrcode')" prop="qrcodeUrl" class="flex-1"> <el-form-item :label="t('FactoryModeling.ProductInformation.qrcode')" prop="qrcodeUrl" class="flex-1">
<QrcodeActionCard <QrcodeActionCard :image-url="formData.qrcodeUrl" :print-id="formData.id" :print-template-type="1"
:image-url="formData.qrcodeUrl"
:print-id="formData.id"
:print-template-type="1"
:print-title="`${formData.name || '产品'}二维码打印预览`" :print-title="`${formData.name || '产品'}二维码打印预览`"
:empty-text="t('FactoryModeling.ProductInformation.qrcodeEmpty')" :empty-text="t('FactoryModeling.ProductInformation.qrcodeEmpty')" :refresh-url="getQrcodeRefreshUrl()"
:refresh-url="getQrcodeRefreshUrl()" :refresh-disabled="!formData.id || !formData.barCode" refresh-confirm-text="确认刷新该产品二维码吗？"
:refresh-disabled="!formData.id || !formData.barCode" :template-json="formData.templateJson" :print-data="buildPrintData()"
refresh-confirm-text="确认刷新该产品二维码吗？" @refresh-success="handleQrcodeRefreshSuccess" />
:template-json="formData.templateJson"
:print-data="buildPrintData()"
@refresh-success="handleQrcodeRefreshSuccess"
/>
</el-form-item> </el-form-item>
<el-form-item :label="t('FactoryModeling.ProductInformation.images')" prop="images" class="image-form-item flex-1"> <el-form-item :label="t('FactoryModeling.ProductInformation.images')" prop="images"
class="image-form-item flex-1">
<UploadImg v-model="formData.images" /> <UploadImg v-model="formData.images" />
</el-form-item> </el-form-item>
</div> </div>
@ -262,8 +205,10 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24"> <el-col :span="24">
<el-form-item :label="t('FactoryModeling.ProductInformation.dialogRemarkLabel')" prop="remark" style="margin-top: 8px;"> <el-form-item :label="t('FactoryModeling.ProductInformation.dialogRemarkLabel')" prop="remark"
<el-input type="textarea" v-model="formData.remark" :placeholder="t('FactoryModeling.ProductInformation.dialogRemarkPlaceholder')" /> style="margin-top: 8px;">
<el-input type="textarea" v-model="formData.remark"
:placeholder="t('FactoryModeling.ProductInformation.dialogRemarkPlaceholder')" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
@ -277,15 +222,9 @@
</el-button> </el-button>
</div> </div>
</div> </div>
<TableSelectDialog <TableSelectDialog ref="deviceSelectDialogRef" title="选择设备" :columns="deviceColumns"
ref="deviceSelectDialogRef" :fetch-api="fetchDeviceLedgerPage" row-key="id" @confirm="handleDeviceSelectConfirm"
title="选择设备" :query-params="mergedQueryParams">
:columns="deviceColumns"
:fetch-api="fetchDeviceLedgerPage"
row-key="id"
@confirm="handleDeviceSelectConfirm"
:query-params="mergedQueryParams"
>
<template #header> <template #header>
<el-form ref="searchFormRef" :model="searchParams" :inline="true"> <el-form ref="searchFormRef" :model="searchParams" :inline="true">
<el-form-item label="设备编号" prop="deviceCode"> <el-form-item label="设备编号" prop="deviceCode">
@ -295,21 +234,15 @@
<el-input v-model="searchParams.deviceName" placeholder="请输入名称" clearable /> <el-input v-model="searchParams.deviceName" placeholder="请输入名称" clearable />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="handleSearch">{{ t('FactoryModeling.ProductInformation.searchButtonText') }}</el-button> <el-button type="primary" @click="handleSearch">{{ t('FactoryModeling.ProductInformation.searchButtonText')
}}</el-button>
<el-button @click="resetSearch">{{ t('FactoryModeling.ProductInformation.resetButtonText') }}</el-button> <el-button @click="resetSearch">{{ t('FactoryModeling.ProductInformation.resetButtonText') }}</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</template> </template>
</TableSelectDialog> </TableSelectDialog>
<TableSelectDialog <TableSelectDialog ref="moldSelectDialogRef" title="选择模具" :columns="moldColumns" :fetch-api="MoldBrandApi.getMoldPage"
ref="moldSelectDialogRef" row-key="id" @confirm="handleMoldSelectConfirm" :query-params="mergedMoldQueryParams">
title="选择模具"
:columns="moldColumns"
:fetch-api="MoldBrandApi.getMoldPage"
row-key="id"
@confirm="handleMoldSelectConfirm"
:query-params="mergedMoldQueryParams"
>
<template #header> <template #header>
<el-form ref="searchMoldFormRef" :model="searchMoldParams" :inline="true"> <el-form ref="searchMoldFormRef" :model="searchMoldParams" :inline="true">
<el-form-item label="模具编号" prop="code"> <el-form-item label="模具编号" prop="code">
@ -319,88 +252,83 @@
<el-input v-model="searchMoldParams.name" placeholder="请输入名称" clearable /> <el-input v-model="searchMoldParams.name" placeholder="请输入名称" clearable />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="handleMoldSearch">{{ t('FactoryModeling.ProductInformation.searchButtonText') }}</el-button> <el-button type="primary" @click="handleMoldSearch">{{
t('FactoryModeling.ProductInformation.searchButtonText') }}</el-button>
<el-button @click="resetMoldSearch">{{ t('FactoryModeling.ProductInformation.resetButtonText') }}</el-button> <el-button @click="resetMoldSearch">{{ t('FactoryModeling.ProductInformation.resetButtonText') }}</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</template> </template>
</TableSelectDialog> </TableSelectDialog>
<Dialog :title="t('FactoryModeling.ProductInformation.dialogPackagingSchemeTitle')" v-model="packagingSchemeDialogVisible" :appendToBody="true" width="1200"> <Dialog :title="t('FactoryModeling.ProductInformation.dialogPackagingSchemeTitle')"
v-model="packagingSchemeDialogVisible" :appendToBody="true" width="1200">
<el-form ref="searchPackagingSchemeFormRef" :model="searchPackagingSchemeParams" :inline="true" class="-mb-15px"> <el-form ref="searchPackagingSchemeFormRef" :model="searchPackagingSchemeParams" :inline="true" class="-mb-15px">
<el-form-item :label="t('ErpStock.PackagingScheme.code')" prop="code"> <el-form-item :label="t('ErpStock.PackagingScheme.code')" prop="code">
<el-input v-model="searchPackagingSchemeParams.code" :placeholder="t('ErpStock.PackagingScheme.placeholderCode')" clearable /> <el-input v-model="searchPackagingSchemeParams.code"
:placeholder="t('ErpStock.PackagingScheme.placeholderCode')" clearable />
</el-form-item> </el-form-item>
<el-form-item :label="t('ErpStock.PackagingScheme.name')" prop="name"> <el-form-item :label="t('ErpStock.PackagingScheme.name')" prop="name">
<el-input v-model="searchPackagingSchemeParams.name" :placeholder="t('ErpStock.PackagingScheme.placeholderName')" clearable /> <el-input v-model="searchPackagingSchemeParams.name"
:placeholder="t('ErpStock.PackagingScheme.placeholderName')" clearable />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="handlePackagingSchemeSearch">{{ t('FactoryModeling.ProductInformation.searchButtonText') }}</el-button> <el-button type="primary" @click="handlePackagingSchemeSearch">{{
<el-button @click="resetPackagingSchemeSearch">{{ t('FactoryModeling.ProductInformation.resetButtonText') }}</el-button> t('FactoryModeling.ProductInformation.searchButtonText') }}</el-button>
<el-button @click="resetPackagingSchemeSearch">{{ t('FactoryModeling.ProductInformation.resetButtonText')
}}</el-button>
<el-button type="primary" plain @click="openPackagingSchemeAdd">{{ t('action.create') }}</el-button> <el-button type="primary" plain @click="openPackagingSchemeAdd">{{ t('action.create') }}</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-table <el-table ref="packagingSchemeTableRef" v-loading="packagingSchemeDialogLoading" :data="packagingSchemeDialogList"
ref="packagingSchemeTableRef" :row-key="(row) => row.id" :show-overflow-tooltip="true" :stripe="true"
v-loading="packagingSchemeDialogLoading" @selection-change="handlePackagingSchemeSelectionChange">
:data="packagingSchemeDialogList"
:row-key="(row) => row.id"
:show-overflow-tooltip="true"
:stripe="true"
@selection-change="handlePackagingSchemeSelectionChange"
>
<el-table-column type="selection" width="55" reserve-selection /> <el-table-column type="selection" width="55" reserve-selection />
<el-table-column :label="t('ErpStock.PackagingScheme.code')" prop="code" minWidth="160" /> <el-table-column :label="t('ErpStock.PackagingScheme.code')" prop="code" minWidth="160" />
<el-table-column :label="t('ErpStock.PackagingScheme.name')" prop="name" minWidth="160" /> <el-table-column :label="t('ErpStock.PackagingScheme.name')" prop="name" minWidth="160" />
<el-table-column :label="t('ErpStock.PackagingScheme.packageQuantity')" prop="packageQuantity" minWidth="120" /> <el-table-column :label="t('ErpStock.PackagingScheme.packageQuantity')" prop="packageQuantity" minWidth="120" />
<el-table-column :label="t('ErpStock.PackagingScheme.palletPackageQuantity')" prop="palletPackageQuantity" minWidth="120" /> <el-table-column :label="t('ErpStock.PackagingScheme.palletPackageQuantity')" prop="palletPackageQuantity"
<el-table-column :label="t('ErpStock.PackagingScheme.palletTotalQuantity')" prop="palletTotalQuantity" minWidth="120" /> minWidth="120" />
<el-table-column :label="t('FactoryModeling.ProductInformation.dialogDefaultStatusLabel')" width="130" align="center"> <el-table-column :label="t('ErpStock.PackagingScheme.palletTotalQuantity')" prop="palletTotalQuantity"
minWidth="120" />
<el-table-column :label="t('FactoryModeling.ProductInformation.dialogDefaultStatusLabel')" width="130"
align="center">
<template #default="{ row }"> <template #default="{ row }">
<el-radio <el-radio v-model="packagingSchemeDefaultId" :label="row.id"
v-model="packagingSchemeDefaultId" :disabled="!packagingSchemeSelectedRows.some((item) => item.id === row.id)">
:label="row.id"
:disabled="!packagingSchemeSelectedRows.some((item) => item.id === row.id)"
>
&nbsp; &nbsp;
</el-radio> </el-radio>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<div class="flex justify-end mt-15px"> <div class="flex justify-end mt-15px">
<Pagination <Pagination v-model:page="packagingSchemeDialogPageNo" v-model:limit="packagingSchemeDialogPageSize"
v-model:page="packagingSchemeDialogPageNo" :total="packagingSchemeDialogTotal" @pagination="getPackagingSchemeDialogList" />
v-model:limit="packagingSchemeDialogPageSize"
:total="packagingSchemeDialogTotal"
@pagination="getPackagingSchemeDialogList"
/>
</div> </div>
<template #footer> <template #footer>
<el-button type="primary" @click="confirmPackagingSchemeSelect">{{ t('common.ok') }}</el-button> <el-button type="primary" @click="confirmPackagingSchemeSelect">{{ t('common.ok') }}</el-button>
<el-button @click="packagingSchemeDialogVisible = false">{{ t('common.cancel') }}</el-button> <el-button @click="packagingSchemeDialogVisible = false">{{ t('common.cancel') }}</el-button>
</template> </template>
</Dialog> </Dialog>
<Dialog :title="t('FactoryModeling.ProductInformation.dialogSupplierTitle')" v-model="supplierDialogVisible" :appendToBody="true" width="1000"> <Dialog :title="t('FactoryModeling.ProductInformation.dialogSupplierTitle')" v-model="supplierDialogVisible"
:appendToBody="true" width="1000">
<el-form ref="searchSupplierFormRef" :model="searchSupplierParams" :inline="true" class="-mb-15px"> <el-form ref="searchSupplierFormRef" :model="searchSupplierParams" :inline="true" class="-mb-15px">
<el-form-item :label="t('ErpPurchase.Supplier.name')" prop="name"> <el-form-item :label="t('ErpPurchase.Supplier.name')" prop="name">
<el-input v-model="searchSupplierParams.name" :placeholder="t('ErpPurchase.Supplier.placeholderName')" clearable /> <el-input v-model="searchSupplierParams.name" :placeholder="t('ErpPurchase.Supplier.placeholderName')"
clearable />
</el-form-item> </el-form-item>
<el-form-item :label="t('ErpPurchase.Supplier.mobile')" prop="mobile"> <el-form-item :label="t('ErpPurchase.Supplier.mobile')" prop="mobile">
<el-input v-model="searchSupplierParams.mobile" :placeholder="t('ErpPurchase.Supplier.placeholderMobile')" clearable /> <el-input v-model="searchSupplierParams.mobile" :placeholder="t('ErpPurchase.Supplier.placeholderMobile')"
clearable />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="handleSupplierSearch">{{ t('FactoryModeling.ProductInformation.searchButtonText') }}</el-button> <el-button type="primary" @click="handleSupplierSearch">{{
<el-button @click="resetSupplierSearch">{{ t('FactoryModeling.ProductInformation.resetButtonText') }}</el-button> t('FactoryModeling.ProductInformation.searchButtonText') }}</el-button>
<el-button @click="resetSupplierSearch">{{ t('FactoryModeling.ProductInformation.resetButtonText')
}}</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-table <el-table ref="supplierTableRef" v-loading="supplierDialogLoading" :data="supplierDialogList"
ref="supplierTableRef" :row-key="(row) => row.id" :show-overflow-tooltip="true" :stripe="true"
v-loading="supplierDialogLoading" @selection-change="handleSupplierSelectionChange">
:data="supplierDialogList"
:row-key="(row) => row.id"
:show-overflow-tooltip="true"
:stripe="true"
@selection-change="handleSupplierSelectionChange"
>
<el-table-column type="selection" width="55" reserve-selection /> <el-table-column type="selection" width="55" reserve-selection />
<el-table-column :label="t('ErpPurchase.Supplier.name')" prop="name" minWidth="160" /> <el-table-column :label="t('ErpPurchase.Supplier.name')" prop="name" minWidth="160" />
<el-table-column :label="t('ErpPurchase.Supplier.contact')" prop="contact" minWidth="100" /> <el-table-column :label="t('ErpPurchase.Supplier.contact')" prop="contact" minWidth="100" />
@ -408,23 +336,16 @@
<el-table-column :label="t('ErpPurchase.Supplier.telephone')" prop="telephone" minWidth="120" /> <el-table-column :label="t('ErpPurchase.Supplier.telephone')" prop="telephone" minWidth="120" />
<el-table-column label="是否默认供应商" width="130" align="center"> <el-table-column label="是否默认供应商" width="130" align="center">
<template #default="{ row }"> <template #default="{ row }">
<el-radio <el-radio v-model="supplierDefaultId" :label="row.id"
v-model="supplierDefaultId" :disabled="!supplierSelectedRows.some((item) => item.id === row.id)">
:label="row.id"
:disabled="!supplierSelectedRows.some((item) => item.id === row.id)"
>
&nbsp; &nbsp;
</el-radio> </el-radio>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<div class="flex justify-end mt-15px"> <div class="flex justify-end mt-15px">
<Pagination <Pagination v-model:page="supplierDialogPageNo" v-model:limit="supplierDialogPageSize"
v-model:page="supplierDialogPageNo" :total="supplierDialogTotal" @pagination="getSupplierDialogList" />
v-model:limit="supplierDialogPageSize"
:total="supplierDialogTotal"
@pagination="getSupplierDialogList"
/>
</div> </div>
<template #footer> <template #footer>
<el-button type="primary" @click="confirmSupplierSelect">{{ t('common.ok') }}</el-button> <el-button type="primary" @click="confirmSupplierSelect">{{ t('common.ok') }}</el-button>
@ -557,11 +478,11 @@ const normalizeRelationList = (
fallbackPrefix: string fallbackPrefix: string
): { id: number; name: string }[] => { ): { id: number; name: string }[] => {
const fallbackMap = new Map<number, string>() const fallbackMap = new Map<number, string>()
;(fallbackRows || []).forEach((row) => { ; (fallbackRows || []).forEach((row) => {
const id = Number(row?.id) const id = Number(row?.id)
if (!Number.isFinite(id)) return if (!Number.isFinite(id)) return
fallbackMap.set(id, getRelationName(row, nameKeys, fallbackPrefix, id)) fallbackMap.set(id, getRelationName(row, nameKeys, fallbackPrefix, id))
}) })
const parseArray = (source: unknown): any[] => { const parseArray = (source: unknown): any[] => {
if (Array.isArray(source)) return source if (Array.isArray(source)) return source
if (typeof source === 'string') { if (typeof source === 'string') {
@ -1025,8 +946,8 @@ const open = async (type: string, id?: number) => {
'模具' '模具'
) )
const templateJson = productData?.templateJson const templateJson = productData?.templateJson
const parsedTemplateJson = typeof templateJson === 'string' const parsedTemplateJson = typeof templateJson === 'string'
? JSON.parse(templateJson) ? JSON.parse(templateJson)
: templateJson : templateJson
formData.value = { formData.value = {
...formData.value, ...formData.value,

113
src/views/erp/product/product/index.vue
Unescape Escape View File

@ -147,6 +147,18 @@
/> />
<el-empty v-else :image-size="64" :description="t('FactoryModeling.ProductInformation.qrcodeEmpty')" /> <el-empty v-else :image-size="64" :description="t('FactoryModeling.ProductInformation.qrcodeEmpty')" />
</div> </div>
<div class="detail-qrcode-box">
<div class="detail-image-label">{{ t('FactoryModeling.ProductInformation.qrcode') }}</div>
<el-image
v-if="productDetail.qrcodeUrl"
class="detail-qrcode"
:src="productDetail.qrcodeUrl"
fit="contain"
:preview-src-list="[productDetail.qrcodeUrl]"
preview-teleported
/>
<el-empty v-else :image-size="48" :description="t('FactoryModeling.ProductInformation.qrcodeEmpty')" />
</div>
</div> </div>
<div class="detail-info"> <div class="detail-info">
@ -170,6 +182,21 @@
<span class="field-label">{{ t('FactoryModeling.ProductInformation.dialogUnitLabel') }}：</span> <span class="field-label">{{ t('FactoryModeling.ProductInformation.dialogUnitLabel') }}：</span>
<span class="field-value">{{ formatValue(productDetail.unitName) }}</span> <span class="field-value">{{ formatValue(productDetail.unitName) }}</span>
</div> </div>
<!-- 物料/备件类型：供应商 -->
<template v-if="productDetail.categoryType === 2 || productDetail.categoryType === 3">
<div class="detail-field">
<span class="field-label">{{ t('FactoryModeling.ProductInformation.dialogPurchaseUnitLabel') }}：</span>
<span class="field-value">{{ formatValue(productDetail.purchaseUnitName) }}</span>
</div>
<div class="detail-field">
<span class="field-label">{{ t('FactoryModeling.ProductInformation.dialogPurchaseUnitConvertLabel') }}：</span>
<span class="field-value">{{ formatPurchaseUnitConvert(productDetail) }}</span>
</div>
<!-- <div class="detail-field">
<span class="field-label">{{ t('FactoryModeling.ProductInformation.dialogSupplierLabel') }}：</span>
<span class="field-value">{{ formatSupplierText(productDetail) }}</span>
</div> -->
</template>
<div class="detail-field"> <div class="detail-field">
<span class="field-label">{{ t('FactoryModeling.ProductInformation.dialogStandardLabel') }}：</span> <span class="field-label">{{ t('FactoryModeling.ProductInformation.dialogStandardLabel') }}：</span>
<span class="field-value">{{ formatValue(productDetail.standard || productDetail.deviceSpec || productDetail.model) }}</span> <span class="field-value">{{ formatValue(productDetail.standard || productDetail.deviceSpec || productDetail.model) }}</span>
@ -193,21 +220,6 @@
<span class="field-value">{{ formatMoldText(productDetail) }}</span> <span class="field-value">{{ formatMoldText(productDetail) }}</span>
</div> </div>
</template> </template>
<!-- 物料/备件类型：供应商 -->
<template v-if="productDetail.categoryType === 2 || productDetail.categoryType === 3">
<div class="detail-field">
<span class="field-label">{{ t('FactoryModeling.ProductInformation.dialogPurchaseUnitLabel') }}：</span>
<span class="field-value">{{ formatValue(productDetail.purchaseUnitName) }}</span>
</div>
<div class="detail-field">
<span class="field-label">{{ t('FactoryModeling.ProductInformation.dialogPurchaseUnitConvertLabel') }}：</span>
<span class="field-value">{{ formatPurchaseUnitConvert(productDetail) }}</span>
</div>
<div class="detail-field">
<span class="field-label">{{ t('FactoryModeling.ProductInformation.dialogSupplierLabel') }}：</span>
<span class="field-value">{{ formatSupplierText(productDetail) }}</span>
</div>
</template>
<!-- 备件类型：备件等级、是否易损件、采购周期、品牌 --> <!-- 备件类型：备件等级、是否易损件、采购周期、品牌 -->
<template v-if="productDetail.categoryType === 3"> <template v-if="productDetail.categoryType === 3">
<div class="detail-field"> <div class="detail-field">
@ -257,43 +269,37 @@
<span>默认供应商：{{ defaultSupplierText }}</span> <span>默认供应商：{{ defaultSupplierText }}</span>
</div> </div>
</template> </template>
<div class="detail-qrcode-box" style="margin-top: 12px;">
<div class="detail-image-label">{{ t('FactoryModeling.ProductInformation.qrcode') }}</div>
<el-image
v-if="productDetail.qrcodeUrl"
class="detail-qrcode"
:src="productDetail.qrcodeUrl"
fit="contain"
:preview-src-list="[productDetail.qrcodeUrl]"
preview-teleported
/>
<el-empty v-else :image-size="48" :description="t('FactoryModeling.ProductInformation.qrcodeEmpty')" />
</div>
</div>
<!-- 产品类型：包装方案表格 --> <!-- 产品类型：包装方案表格 -->
<div v-if="productDetail.categoryType === 1" class="detail-table-box"> <div v-if="productDetail.categoryType === 1" class="detail-table-box">
<div class="detail-table-title"> <div class="detail-table-title">
<span>{{ t('FactoryModeling.ProductInformation.dialogPackagingSchemeLabel') }}</span> <span>{{ t('FactoryModeling.ProductInformation.dialogPackagingSchemeLabel') }}</span>
<span>共 {{ packagingSchemeCount }} 个</span> <span>共 {{ packagingSchemeCount }} 个</span>
</div>
<el-table :data="productDetail.packagingSchemes || []" border size="small" :show-overflow-tooltip="true">
<el-table-column :label="t('ErpStock.PackagingScheme.name')" prop="packagingSchemeName" min-width="130" />
<el-table-column :label="t('ErpStock.PackagingScheme.packageQuantity')" prop="packageQuantity" min-width="100" />
<el-table-column :label="t('ErpStock.PackagingScheme.palletPackageQuantity')" prop="palletPackageQuantity" min-width="100" />
</el-table>
</div> </div>
<el-table :data="productDetail.packagingSchemes || []" border size="small" :show-overflow-tooltip="true"> <!-- 物料/备件类型：供应商表格 -->
<el-table-column :label="t('ErpStock.PackagingScheme.name')" prop="packagingSchemeName" min-width="130" /> <div v-else-if="productDetail.categoryType === 2 || productDetail.categoryType === 3" class="detail-table-box">
<el-table-column :label="t('ErpStock.PackagingScheme.packageQuantity')" prop="packageQuantity" min-width="100" /> <div class="detail-table-title">
<el-table-column :label="t('ErpStock.PackagingScheme.palletPackageQuantity')" prop="palletPackageQuantity" min-width="100" /> <span>{{ t('FactoryModeling.ProductInformation.dialogSupplierLabel') }}</span>
</el-table> <span>共 {{ supplierCount }} 个</span>
</div> </div>
<!-- 物料/备件类型：供应商表格 --> <el-table :data="productDetail.suppliers || []" border size="small" :show-overflow-tooltip="true">
<div v-else-if="productDetail.categoryType === 2 || productDetail.categoryType === 3" class="detail-table-box"> <el-table-column :label="t('ErpPurchase.Supplier.name')" prop="supplierName" min-width="160">
<div class="detail-table-title"> <template #default="{ row }">{{ formatValue(row.supplierName) }}</template>
<span>{{ t('FactoryModeling.ProductInformation.dialogSupplierLabel') }}</span> </el-table-column>
<span>共 {{ supplierCount }} 个</span> <el-table-column :label="t('ErpPurchase.Supplier.contact')" prop="supplierContact" min-width="100">
<template #default="{ row }">{{ formatValue(row.supplierContact) }}</template>
</el-table-column>
<el-table-column :label="t('ErpPurchase.Supplier.mobile')" prop="supplierMobile" min-width="120">
<template #default="{ row }">{{ formatValue(row.supplierMobile) }}</template>
</el-table-column>
</el-table>
</div> </div>
<el-table :data="productDetail.suppliers || []" border size="small" :show-overflow-tooltip="true">
<el-table-column :label="t('ErpPurchase.Supplier.name')" prop="supplierName" min-width="160" />
<el-table-column :label="t('ErpPurchase.Supplier.contact')" prop="supplierContact" min-width="100" />
<el-table-column :label="t('ErpPurchase.Supplier.mobile')" prop="supplierMobile" min-width="120" />
</el-table>
</div> </div>
</div> </div>
</template> </template>
@ -658,7 +664,7 @@ const formatDateTime = (value: any) => {
.detail-card { .detail-card {
display: grid; display: grid;
grid-template-columns: 200px 1fr 300px 1fr; grid-template-columns: 220px minmax(0, 1fr) minmax(360px, 500px);
gap: 16px; gap: 16px;
padding: 16px; padding: 16px;
border: 1px solid var(--el-border-color-lighter); border: 1px solid var(--el-border-color-lighter);
@ -687,6 +693,7 @@ const formatDateTime = (value: any) => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 6px; gap: 6px;
align-items: center;
} }
.detail-qrcode { .detail-qrcode {
@ -721,7 +728,7 @@ const formatDateTime = (value: any) => {
.detail-image-item { .detail-image-item {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: left; align-items: center;
gap: 6px; gap: 6px;
} }
@ -762,6 +769,7 @@ const formatDateTime = (value: any) => {
} }
.detail-table-box { .detail-table-box {
margin-top: 20px;
min-width: 0; min-width: 0;
} }
@ -783,8 +791,7 @@ const formatDateTime = (value: any) => {
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
} }
.detail-summary, .detail-summary {
.detail-table-box {
grid-column: 1 / -1; grid-column: 1 / -1;
} }
} }

Write Preview
Loading…
Cancel
Save