|
@@ -1,11 +1,107 @@
|
|
<template>
|
|
<template>
|
|
|
|
+ <HcCard actionUi="text-center">
|
|
|
|
+ <div class="hc-tabs-simple-extra-btn" v-if="infoData.pdfUrl">
|
|
|
|
+ <el-button size="large" type="primary" hc-btn @click="reuploadClick">
|
|
|
|
+ <HcIcon name="upload-cloud-2"/>
|
|
|
|
+ <span>点击重新上传</span>
|
|
|
|
+ </el-button>
|
|
|
|
+ </div>
|
|
|
|
|
|
|
|
+ <div class="hc-project-contract-form-file">
|
|
|
|
+ <div class="hc-form-file-pdf" v-show="infoData.pdfUrl">
|
|
|
|
+ <HcPdf :src="infoData.pdfUrl"/>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="hc-form-file-upload" v-show="!infoData.pdfUrl">
|
|
|
|
+ <HcUploadFile ref="HcUploadFileRef" :options="UploadFileOptions" @success="HcUploadFileSuccess" drop>
|
|
|
|
+ <div class="accept-tip">支持的文件格式:图片(png、jpg、jpeg)、 Excel(xls、xlsx) PDF 、Word(doc、docx)</div>
|
|
|
|
+ </HcUploadFile>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <template #action>
|
|
|
|
+ <el-button size="large" type="info" hc-btn @click="goBackClick">
|
|
|
|
+ <HcIcon name="arrow-go-back"/>
|
|
|
|
+ <span v-if="isDisabled">返回上一级</span>
|
|
|
|
+ <span v-else>取消并返回</span>
|
|
|
|
+ </el-button>
|
|
|
|
+ <el-button size="large" type="primary" hc-btn @click="saveClick" v-if="!isDisabled">
|
|
|
|
+ <HcIcon name="check-double"/>
|
|
|
|
+ <span>提交保存</span>
|
|
|
|
+ </el-button>
|
|
|
|
+ </template>
|
|
|
|
+ </HcCard>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
|
|
+import {ref, watch} from "vue";
|
|
|
|
+import {useRouter} from 'vue-router'
|
|
|
|
+import {getObjValue} from "js-fast-way";
|
|
|
|
+import {getTokenHeader} from "~src/api/request/header";
|
|
|
|
+
|
|
|
|
+const router = useRouter()
|
|
|
|
+
|
|
|
|
+//参数
|
|
|
|
+const props = defineProps({
|
|
|
|
+ datas: {
|
|
|
|
+ type: Object,
|
|
|
|
+ default: () => ({})
|
|
|
|
+ },
|
|
|
|
+ disabled: {
|
|
|
|
+ type: Boolean,
|
|
|
|
+ default: false
|
|
|
|
+ },
|
|
|
|
+})
|
|
|
|
+
|
|
|
|
+const infoData = ref(props.datas)
|
|
|
|
+const isDisabled = ref(props.disabled)
|
|
|
|
+
|
|
|
|
+//深度监听
|
|
|
|
+watch(() => [
|
|
|
|
+ props.datas,
|
|
|
|
+], ([datas]) => {
|
|
|
|
+ infoData.value = datas
|
|
|
|
+}, {deep: true})
|
|
|
|
+
|
|
|
|
+//监听
|
|
|
|
+watch(() => [
|
|
|
|
+ props.disabled,
|
|
|
|
+], ([disabled]) => {
|
|
|
|
+ isDisabled.value = disabled
|
|
|
|
+})
|
|
|
|
|
|
|
|
+//上传配置
|
|
|
|
+const HcUploadFileRef = ref(null)
|
|
|
|
+const UploadFileOptions = {
|
|
|
|
+ headers: getTokenHeader(), //此处设置header
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+// 文件上传成功的回调
|
|
|
|
+const HcUploadFileSuccess = (res) => {
|
|
|
|
+ const { pdfUrl } = getObjValue(res.resData)
|
|
|
|
+ infoData.value.pdfUrl = pdfUrl
|
|
|
|
+ HcUploadFileRef.value?.setModalShow(false);
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+//重新上传
|
|
|
|
+const reuploadClick = () => {
|
|
|
|
+ HcUploadFileRef.value?.selectFile()
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+//返回
|
|
|
|
+const goBackClick = () => {
|
|
|
|
+ router.back()
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+//提交保存
|
|
|
|
+const saveClick = () => {
|
|
|
|
+
|
|
|
|
+}
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
<style scoped lang="scss">
|
|
|
|
+@import "~src/styles/project/contract/form.scoped.scss";
|
|
|
|
+</style>
|
|
|
|
|
|
|
|
+<style lang="scss">
|
|
|
|
+@import "~src/styles/project/contract/form.scss";
|
|
</style>
|
|
</style>
|