|
@@ -1,80 +1,89 @@
|
|
<template>
|
|
<template>
|
|
<div class="device-edit page-form-container">
|
|
<div class="device-edit page-form-container">
|
|
- <el-form ref="form" label-width="130px" :model="formData" :rules="rules">
|
|
|
|
- <el-form-item label="认证方式:">
|
|
|
|
- <span>{{ authTypeName }}</span>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="设备名称:" prop="productTypeId">
|
|
|
|
- <el-select v-model="formData.productTypeId" style="width: 100%" clearable>
|
|
|
|
- <el-option
|
|
|
|
- v-for="item in productCateList"
|
|
|
|
- :key="item.productTypeId"
|
|
|
|
- :label="item.name"
|
|
|
|
- :value="item.productTypeId"
|
|
|
|
- />
|
|
|
|
- </el-select>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="设备SN码:" prop="snCode">
|
|
|
|
- <el-input v-model="formData.snCode" placeholder="设备SN码" />
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="认证日期:" prop="authDate">
|
|
|
|
- <el-date-picker v-model="formData.authDate" type="date" placeholder="选择日期" style="width: 100%" />
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="授权牌:" prop="certificateImageType">
|
|
|
|
- <el-radio-group v-model="formData.certificateImageType" size="mini">
|
|
|
|
- <el-radio :label="1">模板库生成</el-radio>
|
|
|
|
- <el-radio :label="2">自定义上传</el-radio>
|
|
|
|
- </el-radio-group>
|
|
|
|
- <template v-if="formData.certificateImageType === 1">
|
|
|
|
- <div v-if="authTempFlag">
|
|
|
|
- <preview-image v-if="formData.certificateImage" :src="formData.certificateImage" />
|
|
|
|
- </div>
|
|
|
|
- <div v-else>无</div>
|
|
|
|
- </template>
|
|
|
|
- <template v-else>
|
|
|
|
- <upload-image
|
|
|
|
- tip="建议尺寸:150px * 112px"
|
|
|
|
- :image-list="certificateImageList"
|
|
|
|
- :before-upload="beforeCertificateImageUpload"
|
|
|
|
- @success="uploadCertificateImageSuccess"
|
|
|
|
- @remove="handleCertificateImageRemove"
|
|
|
|
- />
|
|
|
|
- </template>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item v-if="authTempFlag && formData.certificateImageType === 1" label="授权牌logo:">
|
|
|
|
- <div class="form-label-tip">授权牌logo(提示:授权牌logo与机构名称组合)</div>
|
|
|
|
- <div style="margin-top: 8px">
|
|
|
|
- <upload-image
|
|
|
|
- :tip="authImageLogoUploadTip"
|
|
|
|
- :image-list="authImageLogoList"
|
|
|
|
- :before-upload="beforeAuthImageLogoUpload"
|
|
|
|
- @success="uploadAuthImageLogoSuccess"
|
|
|
|
- @remove="handleAuthImageLogoRemove"
|
|
|
|
- />
|
|
|
|
- <el-input v-show="false" v-model="formData.authImageLogo" />
|
|
|
|
- </div>
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="购买渠道:" prop="purchaseWay">
|
|
|
|
- <el-input v-model="formData.purchaseWay" placeholder="购买渠道" />
|
|
|
|
- </el-form-item>
|
|
|
|
- <el-form-item label="发票:" prop="invoiceImage">
|
|
|
|
- <upload-image
|
|
|
|
- tip="建议图片分辨率:242px*242px"
|
|
|
|
- :limit="1"
|
|
|
|
- :image-list="invoiceImageList"
|
|
|
|
- :before-upload="beforeInvoiceImageUpload"
|
|
|
|
- @success="uploadInvoiceImageSuccess"
|
|
|
|
- @remove="handleInvoiceImageRemove"
|
|
|
|
- />
|
|
|
|
- <el-input v-show="false" v-model="formData.invoiceImage" />
|
|
|
|
- </el-form-item>
|
|
|
|
- </el-form>
|
|
|
|
|
|
+ <el-form ref="form" label-width="100px" :model="formData" :rules="rules">
|
|
|
|
+ <el-tabs v-model="activeName">
|
|
|
|
+ <!-- 基础资料 -->
|
|
|
|
+ <el-tab-pane label="基础资料" name="first">
|
|
|
|
+ <el-form-item label="设备名称:" prop="productTypeId">
|
|
|
|
+ <el-select v-model="formData.productTypeId" style="width: 100%" clearable>
|
|
|
|
+ <el-option
|
|
|
|
+ v-for="item in productCateList"
|
|
|
|
+ :key="item.productTypeId"
|
|
|
|
+ :label="item.name"
|
|
|
|
+ :value="item.productTypeId"
|
|
|
|
+ />
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="设备SN码:" prop="snCode">
|
|
|
|
+ <el-input v-model="formData.snCode" placeholder="设备SN码" />
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="购买渠道:" prop="purchaseWay">
|
|
|
|
+ <el-input v-model="formData.purchaseWay" placeholder="购买渠道" />
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="发票:" prop="invoiceImage">
|
|
|
|
+ <upload-image
|
|
|
|
+ tip="建议图片分辨率:242px*242px"
|
|
|
|
+ :limit="1"
|
|
|
|
+ :image-list="invoiceImageList"
|
|
|
|
+ :before-upload="beforeInvoiceImageUpload"
|
|
|
|
+ @success="uploadInvoiceImageSuccess"
|
|
|
|
+ @remove="handleInvoiceImageRemove"
|
|
|
|
+ />
|
|
|
|
+ <el-input v-show="false" v-model="formData.invoiceImage" />
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="认证方式:">
|
|
|
|
+ <span>{{ authTypeName }}</span>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-tab-pane>
|
|
|
|
+ <!-- 授权牌资料 -->
|
|
|
|
+ <el-tab-pane label="授权牌资料" name="second">
|
|
|
|
+ <el-form-item label="授权牌:" prop="certificateImageType">
|
|
|
|
+ <el-radio-group v-model="formData.certificateImageType" size="mini">
|
|
|
|
+ <el-radio :label="1">模板库生成</el-radio>
|
|
|
|
+ <el-radio :label="2">自定义上传</el-radio>
|
|
|
|
+ </el-radio-group>
|
|
|
|
+ <template v-if="formData.certificateImageType === 1">
|
|
|
|
+ <div v-if="authTempFlag">
|
|
|
|
+ <preview-image v-if="formData.certificateImage" :src="formData.certificateImage" />
|
|
|
|
+ </div>
|
|
|
|
+ <div v-else>无</div>
|
|
|
|
+ </template>
|
|
|
|
+ <template v-else>
|
|
|
|
+ <upload-image
|
|
|
|
+ tip="建议尺寸:150px * 112px"
|
|
|
|
+ :image-list="certificateImageList"
|
|
|
|
+ :before-upload="beforeCertificateImageUpload"
|
|
|
|
+ @success="uploadCertificateImageSuccess"
|
|
|
|
+ @remove="handleCertificateImageRemove"
|
|
|
|
+ />
|
|
|
|
+ </template>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item v-if="authTempFlag && formData.certificateImageType === 1" label="授权牌logo:">
|
|
|
|
+ <div class="form-label-tip">授权牌logo(提示:授权牌logo与机构名称组合)</div>
|
|
|
|
+ <div style="margin-top: 8px">
|
|
|
|
+ <upload-image
|
|
|
|
+ :tip="authImageLogoUploadTip"
|
|
|
|
+ :image-list="authImageLogoList"
|
|
|
|
+ :before-upload="beforeAuthImageLogoUpload"
|
|
|
|
+ @success="uploadAuthImageLogoSuccess"
|
|
|
|
+ @remove="handleAuthImageLogoRemove"
|
|
|
|
+ />
|
|
|
|
+ <el-input v-show="false" v-model="formData.authImageLogo" />
|
|
|
|
+ </div>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="认证日期:" prop="authDate">
|
|
|
|
+ <el-date-picker v-model="formData.authDate" type="date" placeholder="选择日期" style="width: 100%" />
|
|
|
|
+ </el-form-item>
|
|
|
|
+
|
|
|
|
+ </el-tab-pane>
|
|
|
|
+ </el-tabs>
|
|
|
|
|
|
- <!-- 表单提交 返回 -->
|
|
|
|
- <div class="control-box">
|
|
|
|
- <el-button type="primary" @click="submit">保存</el-button>
|
|
|
|
- <el-button type="warning" @click="navigateBack">返回</el-button>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <!-- 表单提交 返回 -->
|
|
|
|
+ <div class="control-box">
|
|
|
|
+ <el-button type="primary" @click="submit">保存</el-button>
|
|
|
|
+ <el-button type="warning" @click="navigateBack">返回</el-button>
|
|
|
|
+ </div>
|
|
|
|
+ </el-form>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
@@ -95,6 +104,7 @@ export default {
|
|
callback()
|
|
callback()
|
|
}
|
|
}
|
|
return {
|
|
return {
|
|
|
|
+ activeName: 'first',
|
|
editType: 'add',
|
|
editType: 'add',
|
|
isLoading: false,
|
|
isLoading: false,
|
|
formData: {
|
|
formData: {
|
|
@@ -311,4 +321,8 @@ export default {
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
|
|
|
|
-<style lang="scss" scoped></style>
|
|
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
+.el-tab-pane {
|
|
|
|
+ margin-top: 24px;
|
|
|
|
+}
|
|
|
|
+</style>
|