From 8c1c96a03da69b980a8822a02603123d78d8b4e1 Mon Sep 17 00:00:00 2001 From: zhengyiming <540361168@qq.com> Date: 星期一, 30 六月 2025 21:28:47 +0800 Subject: [PATCH] feat: v2.2 --- /dev/null | 61 ---------- vite.config.ts | 3 src/constants/temp.ts | 45 ++++++ src/utils/storage/storage.ts | 14 + package.json | 2 src/assets/home/icon-taiping-logo.png | 0 src/components/Preview/PreviewOffice.vue | 25 ++++ src/views/Home/components/InsureInstructionsDialog.vue | 153 +++++++++++++++++++++++++ src/views/Home/Home.vue | 10 + 9 files changed, 242 insertions(+), 71 deletions(-) diff --git a/package.json b/package.json index bcfa5c4..8700bd6 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,7 @@ "build:jy": "cross-env NODE_OPTIONS=--max_old_space_size=16000 VITE_AppType=jy vite build --mode jy", "build:other": "cross-env NODE_OPTIONS=--max_old_space_size=16000 VITE_AppType=other vite build --mode other", "build:backup": "cross-env NODE_OPTIONS=--max_old_space_size=16000 VITE_AppType=backup vite build --mode backup", - "build:all": "run-p build:jx build:jy build:other build:backup", + "build:all": "run-p build:jx build:tp", "build:staging": "cross-env vite build --mode staging", "build:staging:yx": "cross-env vite build --mode stagingone", "build:staging:other": "cross-env VITE_AppType=other vite build --mode staging", diff --git a/src/assets/home/icon-taiping-logo.png b/src/assets/home/icon-taiping-logo.png new file mode 100644 index 0000000..cbf94c6 --- /dev/null +++ b/src/assets/home/icon-taiping-logo.png Binary files differ diff --git a/src/components/Preview/PreviewOffice.vue b/src/components/Preview/PreviewOffice.vue new file mode 100644 index 0000000..6130cc2 --- /dev/null +++ b/src/components/Preview/PreviewOffice.vue @@ -0,0 +1,25 @@ +<template> + <div class="office-wrapper"> + <iframe :src="url" class="previewBody"></iframe> + </div> +</template> + +<script lang="ts"> +export default { + name: 'PreviewOffice', +}; +</script> + +<script setup lang="ts"> +import { computed } from 'vue'; + +type Props = { + fileUrl: string; +}; + +const props = defineProps<Props>(); + +const url = computed( + () => `https://view.officeapps.live.com/op/view.aspx?src=${props.fileUrl}?${Date.now()}` +); +</script> diff --git a/src/constants/temp.ts b/src/constants/temp.ts index b9c3a3d..59db30a 100644 --- a/src/constants/temp.ts +++ b/src/constants/temp.ts @@ -10,13 +10,13 @@ // 鑱屼笟绫诲瀷瀵圭収琛� export const InsuranceOccupationTypeTempPath = `${TempFolderPath}/%E8%81%8C%E4%B8%9A%E7%B1%BB%E5%9E%8B%E5%AF%B9%E7%85%A7%E8%A1%A8.xls`; // 浜у搧淇濋殰鏂规 -export const InsuranceProtocolTempPath1 = `${TempFolderPath}/%E4%BA%A7%E5%93%81%E4%BF%9D%E9%9A%9C%E6%96%B9%E6%A1%88.xlsx`; +export const InsuranceProtocolTempPath1 = `${TempFolderPath}/%E4%BA%A7%E5%93%81%E4%BF%9D%E9%9A%9C%E6%96%B9%E6%A1%88.pdf`; // 鍏嶈矗鏉℃ -export const InsuranceProtocolTempPath2 = `${TempFolderPath}/%E5%85%8D%E8%B4%A3%E6%9D%A1%E6%AC%BE.docx`; +export const InsuranceProtocolTempPath2 = `${TempFolderPath}/%E5%85%8D%E8%B4%A3%E6%9D%A1%E6%AC%BE.pdf`; // 鐞嗚禂椤荤煡 -export const InsuranceProtocolTempPath3 = `${TempFolderPath}/%E7%90%86%E8%B5%94%E9%A1%BB%E7%9F%A5.docx`; +export const InsuranceProtocolTempPath3 = `${TempFolderPath}/%E7%90%86%E8%B5%94%E9%A1%BB%E7%9F%A5.pdf`; // 鎶曚繚椤荤煡鍙婂0鏄� -export const InsuranceProtocolTempPath4 = `${TempFolderPath}/%E6%8A%95%E4%BF%9D%E9%A1%BB%E7%9F%A5%E5%8F%8A%E5%A3%B0%E6%98%8E.docx`; +export const InsuranceProtocolTempPath4 = `${TempFolderPath}/%E6%8A%95%E4%BF%9D%E9%A1%BB%E7%9F%A5%E5%8F%8A%E5%A3%B0%E6%98%8E.pdf`; // 澶钩璐骇淇濋櫓鏈夐檺鍏徃涓汉浜鸿韩鎰忓浼ゅ淇濋櫓锛堜簰鑱旂綉涓撳睘2022鐗堬級-鏉℃ export const InsuranceProtocolTempPath5 = `${TempFolderPath}/%E5%A4%AA%E5%B9%B3%E8%B4%A2%E4%BA%A7%E4%BF%9D%E9%99%A9%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8%E4%B8%AA%E4%BA%BA%E4%BA%BA%E8%BA%AB%E6%84%8F%E5%A4%96%E4%BC%A4%E5%AE%B3%E4%BF%9D%E9%99%A9%EF%BC%88%E4%BA%92%E8%81%94%E7%BD%91%E4%B8%93%E5%B1%9E2022%E7%89%88%EF%BC%89-%E6%9D%A1%E6%AC%BE.pdf`; // 澶钩璐骇淇濋櫓鏈夐檺鍏徃鍏叡浜ら�氬伐鍏蜂箻瀹㈡剰澶栦激瀹充繚闄╋紙浜掕仈缃戜笓灞�2022鐗堬級-鏉℃ @@ -24,4 +24,39 @@ // 澶钩璐骇淇濋櫓鏈夐檺鍏徃闄勫姞鎰忓浼ゅ浣忛櫌娲ヨ创淇濋櫓锛堜簰鑱旂綉涓撳睘锛�-鏉℃ export const InsuranceProtocolTempPath7 = `${TempFolderPath}/%E5%A4%AA%E5%B9%B3%E8%B4%A2%E4%BA%A7%E4%BF%9D%E9%99%A9%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8%E9%99%84%E5%8A%A0%E6%84%8F%E5%A4%96%E4%BC%A4%E5%AE%B3%E4%BD%8F%E9%99%A2%E6%B4%A5%E8%B4%B4%E4%BF%9D%E9%99%A9%EF%BC%88%E4%BA%92%E8%81%94%E7%BD%91%E4%B8%93%E5%B1%9E%EF%BC%89-%E6%9D%A1%E6%AC%BE.pdf`; // 澶钩璐骇淇濋櫓鏈夐檺鍏徃闄勫姞鎰忓浼ゅ鍖荤枟淇濋櫓锛堜簰鑱旂綉涓撳睘2022鐗堬級-鏉℃ -export const InsuranceTempPath8 = `${TempFolderPath}/%E5%A4%AA%E5%B9%B3%E8%B4%A2%E4%BA%A7%E4%BF%9D%E9%99%A9%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8%E9%99%84%E5%8A%A0%E6%84%8F%E5%A4%96%E4%BC%A4%E5%AE%B3%E5%8C%BB%E7%96%97%E4%BF%9D%E9%99%A9%EF%BC%88%E4%BA%92%E8%81%94%E7%BD%91%E4%B8%93%E5%B1%9E2022%E7%89%88%EF%BC%89-%E6%9D%A1%E6%AC%BE.pdf`; +export const InsuranceProtocolTempPath8 = `${TempFolderPath}/%E5%A4%AA%E5%B9%B3%E8%B4%A2%E4%BA%A7%E4%BF%9D%E9%99%A9%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8%E9%99%84%E5%8A%A0%E6%84%8F%E5%A4%96%E4%BC%A4%E5%AE%B3%E5%8C%BB%E7%96%97%E4%BF%9D%E9%99%A9%EF%BC%88%E4%BA%92%E8%81%94%E7%BD%91%E4%B8%93%E5%B1%9E2022%E7%89%88%EF%BC%89-%E6%9D%A1%E6%AC%BE.pdf`; + +export const InsuranceTempList = [ + { + type: 'pdf', + url: InsuranceProtocolTempPath1, + }, + { + type: 'pdf', + url: InsuranceProtocolTempPath2, + }, + { + type: 'pdf', + url: InsuranceProtocolTempPath3, + }, + { + type: 'pdf', + url: InsuranceProtocolTempPath4, + }, + { + type: 'pdf', + url: InsuranceProtocolTempPath5, + }, + { + type: 'pdf', + url: InsuranceProtocolTempPath6, + }, + { + type: 'pdf', + url: InsuranceProtocolTempPath7, + }, + { + type: 'pdf', + url: InsuranceProtocolTempPath8, + }, +]; diff --git a/src/utils/storage/storage.ts b/src/utils/storage/storage.ts index 50f5804..f60ec37 100644 --- a/src/utils/storage/storage.ts +++ b/src/utils/storage/storage.ts @@ -1,9 +1,13 @@ +import { loadEnv } from '@build/index'; + interface ProxyStorage { getItem(key: string): any; setItem(Key: string, value: string): void; removeItem(key: string): void; clear(): void; } + +const { VITE_PUBLIC_PATH } = loadEnv(); //sessionStorage operate class sessionStorageProxy implements ProxyStorage { @@ -13,19 +17,23 @@ this.storage = storageModel; } + getKey(key: string): string { + return `${VITE_PUBLIC_PATH}_${key}`; + } + // 瀛� public setItem(key: string, value: any): void { - this.storage.setItem(key, JSON.stringify(value)); + this.storage.setItem(this.getKey(key), JSON.stringify(value)); } // 鍙� public getItem<T = any>(key: string): null | T { - return JSON.parse(this.storage.getItem(key)); + return JSON.parse(this.storage.getItem(this.getKey(key))); } // 鍒� public removeItem(key: string): void { - this.storage.removeItem(key); + this.storage.removeItem(this.getKey(key)); } // 娓呯┖ diff --git a/src/views/Home/Home.vue b/src/views/Home/Home.vue index 0a2e6dc..1ef5d59 100644 --- a/src/views/Home/Home.vue +++ b/src/views/Home/Home.vue @@ -111,6 +111,7 @@ </AppContainer> <UploadInsurePersonDialog v-bind="dialogProps" /> <UploadStampFileDialog v-bind="dialogStampFileProps" /> + <InsureInstructionsDialog v-bind="dialogInstructionsProps" /> </LoadingLayout> </template> @@ -129,6 +130,7 @@ SearchInput, FieldRadio, XLSXUtils, + useDialog, } from '@bole-core/components'; import * as insuranceOrderServices from '@/services/api/InsuranceOrder'; import { Message, OrderInputType, downloadFileByUrl } from '@bole-core/core'; @@ -152,6 +154,7 @@ } from '@/constants'; import dayjs from 'dayjs'; import _ from 'lodash'; +import InsureInstructionsDialog from './components/InsureInstructionsDialog.vue'; defineOptions({ name: 'Home', @@ -264,6 +267,7 @@ onMounted(async () => { await getList(); state.loading = false; + handleOpenInstructions(); }); const { @@ -391,6 +395,12 @@ } catch (error) {} } +const { dialogProps: dialogInstructionsProps, dialogState: dialogInstructionsState } = useDialog(); + +function handleOpenInstructions() { + dialogInstructionsState.dialogVisible = true; +} + function handleUpload() { handleAdd({ serialNum: `${dayjs().format('YYYYMMDD')}${_.random(0, 9999).toString().padStart(4, '0')}`, diff --git a/src/views/Home/components/InsureInstructions.vue b/src/views/Home/components/InsureInstructions.vue deleted file mode 100644 index 0885deb..0000000 --- a/src/views/Home/components/InsureInstructions.vue +++ /dev/null @@ -1,61 +0,0 @@ -<template> - <el-dialog v-model="visible" @close="onDialogClose" destroy-on-close draggable> - <div>dasfdsfsfs</div> - <!-- <template #footer> - <span class="dialog-footer"> - <el-button @click="emit('onCancel')">鍙� 娑�</el-button> - </span> - </template> --> - </el-dialog> -</template> - -<script setup lang="ts"> -import { FormInstance } from 'element-plus'; -import { - ProDialog, - ProForm, - ProFormItemV2, - ProFormText, - UploadUserFile, -} from '@bole-core/components'; - -defineOptions({ - name: 'InsureInstructions', -}); - -// type Props = {}; - -// const props = withDefaults(defineProps<Props>(), {}); - -const visible = defineModel({ type: Boolean }); - -type Form = { - title: string; - name: string; -}; - -const form = defineModel<Form>('form'); - -const emit = defineEmits<{ - (e: 'onConfirm'): void; - (e: 'onCancel'): void; -}>(); - -const dialogForm = ref<FormInstance>(); - -function onDialogClose() { - if (!dialogForm.value) return; - dialogForm.value.resetFields(); -} - -function handleConfirm() { - if (!dialogForm.value) return; - dialogForm.value.validate((valid) => { - if (valid) { - emit('onConfirm'); - } else { - return; - } - }); -} -</script> diff --git a/src/views/Home/components/InsureInstructionsDialog.vue b/src/views/Home/components/InsureInstructionsDialog.vue new file mode 100644 index 0000000..588ff25 --- /dev/null +++ b/src/views/Home/components/InsureInstructionsDialog.vue @@ -0,0 +1,153 @@ +<template> + <el-dialog + v-model="visible" + destroy-on-close + draggable + center + class="insureInstructionsDialog" + width="600px" + :close-on-click-modal="false" + :close-on-press-escape="false" + > + <div class="insureInstructionsDialog-content"> + <!-- <img :src="IconTaipingLogo" alt="" class="logo" /> --> + <div class="tips-title">娓╅Θ鎻愮ず锛屾偍宸茶繘鍏ユ姇淇濇祦绋嬶細</div> + <div class="tips-item"> + 璇蜂粩缁嗛槄璇讳繚闄╂潯娆撅紝鎶曚繚椤荤煡绛夊唴瀹癸紝涓轰簡淇濋殰鎮ㄧ殑鍚堟硶鏉冪泭锛屾偍鐨勬搷浣滆建杩瑰皢琚褰� + </div> + </div> + <template #footer> + <span class="dialog-footer"> + <el-button type="primary" @click="handleInstructionsNext">鍚屾剰骞剁户缁�</el-button> + </span> + </template> + </el-dialog> + <ProDialog + v-model="visibleFiles" + destroy-on-close + draggable + center + class="insureInstructionsFilesDialog" + width="1000px" + :close-on-click-modal="false" + :close-on-press-escape="false" + top="5vh" + > + <div class="insureInstructionsFilesDialog-content"> + <template v-for="(item, index) in InsuranceTempList" :key="item.url"> + <iframe + :src="item.url" + class="preview-pdf" + v-if="item.type === 'pdf'" + :style="{ display: isCurrent(`step${index}`) ? 'block' : 'none' }" + ></iframe> + <PreviewOffice + :file-url="item.url" + v-else + :style="{ display: isCurrent(`step${index}`) ? 'block' : 'none' }" + /> + </template> + </div> + <template #footer> + <span class="dialog-footer"> + <el-button @click="goToPrevious()" v-if="!isFirst">涓婁竴椤�</el-button> + <el-button type="primary" @click="goToNext()" v-if="!isLast">涓嬩竴椤�</el-button> + <el-button type="primary" @click="handleConfirm" v-if="isLast">鎴戝凡闃呰骞跺悓鎰�</el-button> + </span> + </template> + </ProDialog> +</template> + +<script setup lang="ts"> +import { + ProDialog, + ProForm, + ProFormItemV2, + ProFormText, + UploadUserFile, +} from '@bole-core/components'; +import IconTaipingLogo from '@/assets/home/icon-taiping-logo.png'; +import { useStepper } from '@vueuse/core'; +import { InsuranceTempList } from '@/constants'; + +defineOptions({ + name: 'InsureInstructionsDialog', +}); + +// type Props = {}; + +// const props = withDefaults(defineProps<Props>(), {}); + +const visible = defineModel({ type: Boolean }); + +const emit = defineEmits<{ + (e: 'onConfirm'): void; + (e: 'onCancel'): void; +}>(); + +function handleInstructionsNext() { + visible.value = false; + visibleFiles.value = true; +} + +function handleConfirm() { + visibleFiles.value = false; + emit('onConfirm'); +} + +const visibleFiles = ref(false); + +const { isCurrent, goToNext, goToPrevious, isLast, isFirst } = useStepper( + InsuranceTempList.map((x, index) => `step${index}`) +); +</script> + +<style lang="scss"> +@use '@/style/common.scss' as *; + +.insureInstructionsDialog { + header { + display: none; + } + + .insureInstructionsDialog-content { + .logo { + display: block; + margin: 0 auto 32px; + height: 55px; + } + + .tips-title { + margin-bottom: 8px; + font-size: 18px; + text-align: center; + color: getCssVar('text-color', 'primary'); + line-height: 24px; + } + + .tips-item { + font-size: 16px; + text-align: center; + color: getCssVar('text-color', 'secondary'); + line-height: 20px; + } + } +} + +.insureInstructionsFilesDialog { + header { + display: none; + } + + .insureInstructionsFilesDialog-content { + height: 600px; + + .office-wrapper, + .preview-pdf, + .office-wrapper iframe { + width: 100%; + height: 100%; + } + } +} +</style> diff --git a/vite.config.ts b/vite.config.ts index 3d4f572..f623cc6 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -2,6 +2,7 @@ import { warpperEnv } from './build'; import { getPluginsList } from './build/plugins'; import { UserConfigExport, ConfigEnv, loadEnv, AliasOptions } from 'vite'; +import dayjs from 'dayjs'; export const projRoot = resolve(__dirname, '..', '..'); export const pkgRoot = resolve(projRoot, 'packages'); @@ -96,7 +97,7 @@ __INTLIFY_PROD_DEVTOOLS__: false, }, build: { - outDir: `dist/dist-jybfront-${VITE_AppType}-${mode}`, + outDir: `dist/dist-jybfront-${VITE_AppType}-${mode}-${dayjs().format('YYYYMMDD')}`, }, optimizeDeps: { include: [ -- Gitblit v1.9.1