From ff1169ac5114c68e96c5686a0caa5d69d8a60b8a Mon Sep 17 00:00:00 2001
From: zhouwx <1175765986@qq.com>
Date: 星期五, 12 十二月 2025 16:55:39 +0800
Subject: [PATCH] 修改
---
src/views/build/conpanyFunctionConsult/companyInfo/overview/components/overviewDialog.vue | 567 +++++++++++++++++++++++++++++++++++---------------------
1 files changed, 353 insertions(+), 214 deletions(-)
diff --git a/src/views/build/conpanyFunctionConsult/companyInfo/overview/components/overviewDialog.vue b/src/views/build/conpanyFunctionConsult/companyInfo/overview/components/overviewDialog.vue
index 0f15ffa..136e78e 100644
--- a/src/views/build/conpanyFunctionConsult/companyInfo/overview/components/overviewDialog.vue
+++ b/src/views/build/conpanyFunctionConsult/companyInfo/overview/components/overviewDialog.vue
@@ -1,52 +1,96 @@
<template>
- <div class="notice">
- <el-dialog
- v-model="dialogVisible"
- :title="title"
- width="800px"
- :before-close="handleClose"
- >
- <el-form :model="state.noticeForm" size="default" ref="noticeRef" :rules="title === '新增' || title === '编辑' ? state.formRules : {}" label-width="110px" >
- <el-form-item label="企业名称:" prop="companyName" v-if="state.isAdmin">
- <el-select
- v-model="state.noticeForm.companyName"
- filterable
- remote
- :disabled="title == '查看' || !state.isAdmin"
- @change="selectValue"
- reserve-keyword
- placeholder="请输入企业名称"
- remote-show-suffix
- :remote-method="getCompanyList"
- style="width: 100%"
- >
- <el-option
- v-for="item in state.companyList"
- :key="item.id"
- :label="item.name"
- :value="item.name"
- />
- </el-select>
- </el-form-item>
- <el-form-item label="企业概括:" v-if="showEditor" required>
- <t-editor style="width: 800px" ref="myEditor" :value="state.noticeForm.companySummary" ></t-editor>
- </el-form-item>
- <el-form-item label="企业概括:" v-else>
- <div class="ql-container ql-snow" style="height: 500px;width: 100%;margin-top: 10px;" >
- <div class="ql-editor">
- <div class="reviewTable" v-html="state.noticeForm.companySummary" @click="showFile($event)"></div>
- </div>
- </div>
- </el-form-item>
- </el-form>
- <template #footer v-if="!isReview">
+ <div class="notice">
+ <el-dialog
+ v-model="dialogVisible"
+ :title="title"
+ width="800px"
+ :before-close="handleClose"
+ >
+ <el-form :model="state.noticeForm" size="default" ref="noticeRef"
+ :rules="title === '新增' || title === '编辑' ? state.formRules : {}" label-width="140px">
+ <el-form-item v-if="state.isAdmin" label="单位：" prop="companyId">
+ <el-select v-model="state.noticeForm.companyId" placeholder="请选择" clearable filterable style="width: 100%"
+ :disabled="title == '查看' || title == '编辑' || !state.isAdmin">
+ <el-option
+
+ v-for="item in state.companyList"
+ :key="item.id"
+ :label="item.name"
+ :value="item.id">
+ </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="单位类型：" prop="companyType">
+ <el-select v-model="state.noticeForm.companyType" placeholder="请选择" clearable filterable
+ style="width: 100%" :disabled="title == '查看'">
+ <el-option :key="1" label="民营" :value="1"></el-option>
+ <el-option :key="2" label="私营" :value="2"></el-option>
+ <el-option :key="3" label="企事业单位" :value="3"></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="行业：" prop="industry">
+ <el-input v-model.trim="state.noticeForm.industry" :disabled="title === '查看'"/>
+ </el-form-item>
+ <el-form-item label="社会信用代码：" prop="legalPersonCode">
+ <el-input v-model.trim="state.noticeForm.legalPersonCode" :disabled="title === '查看'"/>
+ </el-form-item>
+ <el-form-item label="法人代表：" prop="legalPerson">
+ <el-input v-model.trim="state.noticeForm.legalPerson" :disabled="title === '查看'"/>
+ </el-form-item>
+ <el-form-item label="注册资本：" prop="registeredCapital">
+ <el-input v-model.trim="state.noticeForm.registeredCapital" :disabled="title === '查看'"/>
+ </el-form-item>
+ <el-form-item label="总办公地址：" prop="officeAddress">
+ <el-input v-model.trim="state.noticeForm.officeAddress" :rows="2" type="textarea"
+ :disabled="title === '查看'"/>
+ </el-form-item>
+ <el-form-item label="其他分场所地址：" prop="otherAddress">
+ <el-input v-model.trim="state.noticeForm.otherAddress" :rows="3" type="textarea"
+ :disabled="title === '查看'"/>
+ </el-form-item>
+ <el-form-item label="单位概况简介:" v-if="showEditor" required>
+ <t-editor style="width: 800px" ref="myEditor" :toolbar="toolbar"
+ :value="state.noticeForm.companySummary"></t-editor>
+ </el-form-item>
+ <el-form-item label="单位概况简介:" v-else>
+ <div class="ql-container ql-snow" style="height: 500px;width: 100%;margin-top: 10px;">
+ <div class="ql-editor">
+ <div class="reviewTable" v-html="state.noticeForm.companySummary" @click="showFile($event)"></div>
+ </div>
+ </div>
+ </el-form-item>
+ <el-form-item label="营业执照:" prop="filePath" v-if="showEditor">
+ <el-upload accept=".jpg,.jpeg,.png,.pdf" :action="state.uploadUrl" :headers="state.header" method="post"
+ :on-success="(res, uploadFile)=>handleAvatarSuccess(res, uploadFile)" :on-exceed="showTip"
+ :limit='state.fileLimit' v-model:file-list="state.fileList" :before-upload="picSize"
+ :on-remove="(file, uploadFiles)=>handleRemove(file, uploadFiles)">
+ <el-button type="primary">点击上传</el-button>
+ <template #tip>
+ <div class="el-upload__tip">尺寸小于5M，最多可上传1张</div>
+ </template>
+ </el-upload>
+ </el-form-item>
+ <el-form-item label="营业执照:" prop="filePath" v-else>
+ <div v-if="state.fileType === 'pdf'" class="pdf-preview">
+ <iframe
+ :src="state.fileUrl"
+ width="650px"
+ height="800px"
+ ></iframe>
+ </div>
+ <div v-else class="image-preview">
+ <img :src="state.fileUrl" style="width:650px" alt="预览图片" class="preview-image"/>
+ </div>
+ </el-form-item>
+ </el-form>
+ <template #footer v-if="!isReview">
<span class="dialog-footer">
<el-button @click="handleClose" size="default">取 消</el-button>
- <el-button type="primary" @click="onSubmit" size="default" v-preReClick>确认</el-button>
+ <el-button type="primary" @click="onSubmit" size="default" v-preReClick>确认</el-button>
</span>
- </template>
- </el-dialog>
- </div>
+ </template>
+ </el-dialog>
+ </div>
</template>
<script setup>
import {nextTick, onMounted, reactive, ref, toRefs, watch} from 'vue'
@@ -61,228 +105,323 @@
import {addCom, editCom} from "@/api/companyInfo/overview";
import Cookies from "js-cookie";
import {getCompany} from "@/api/onlineEducation/company";
+import {delPic} from "@/api/onlineEducation/banner";
const emit = defineEmits(["getList"]);
const dialogVisible = ref(false);
const title = ref("");
+const toolbar = ref('fontsizeselect | undo redo')
const noticeRef = ref();
const fileList = ref([]);
const myEditor = ref();
const isReview = ref(false);
const showEditor = ref(true);
const state = reactive({
- noticeForm: {
- id: '',
- companySummary: '',
- companyId:null,
- companyName: ''
- },
- formRules:{
- companyName: [{ required: true, message: '请选择企业', trigger: 'blur' }],
- companySummary: [{ required: true, message: '企业概况', trigger: 'blur' }],
- },
+ noticeForm: {
+ id: '',
+ companySummary: '',
+ companyId: null,
+ companyName: '',
+ filePath: '',
+ fileName: '',
+ companyType: null,
+ industry: '',
+ legalPersonCode: '',
+ legalPerson: '',
+ registeredCapital: '',
+ officeAddress: '',
+ otherAddress: ''
+ },
+ formRules: {
+ companyId: [{required: true, message: '请选择单位', trigger: 'blur'}],
+ companySummary: [{required: true, message: '单位概况', trigger: 'blur'}],
+ filePath: [{required: true, message: '请上传营业执照', trigger: 'blur'}],
+ companyType: [{required: true, message: '单位类型', trigger: 'blur'}],
+ industry: [{required: true, message: '行业', trigger: 'blur'}],
+ legalPersonCode: [{required: true, message: '证书编号', trigger: 'blur'}],
+ legalPerson: [{required: true, message: '法人代表', trigger: 'blur'}],
+ registeredCapital: [{required: true, message: '注册资本', trigger: 'blur'}],
+ officeAddress: [{required: true, message: '总办公地址', trigger: 'blur'}]
+ },
isAdmin: false,
- companyList: []
+ companyList: [],
+ uploadUrl: import.meta.env.VITE_APP_BASE_API + '/system/common/uploadFile',
+ header: {
+ Authorization: getToken()
+ },
+ fileLimit: 1,
+ fileList: [],
+ fileType: '',
+ fileUrl: ''
})
onMounted(() => {
-
});
-const openDialog = async (type, value) => {
- const userInfo = JSON.parse(Cookies.get('userInfo'))
- state.isAdmin = userInfo.userType === 0;
- isReview.value = false;
- showEditor.value = false
- title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ;
- if(type === 'edit' || type === 'review') {
- state.noticeForm.companySummary = value.companySummary
- state.noticeForm.id = value.id
- if(state.isAdmin){
- state.noticeForm.companyId = value.companyId
- state.noticeForm.companyName = value.companyName
+const openDialog = async (type, value, companyList) => {
+
+ const userInfo = JSON.parse(Cookies.get('userInfo'))
+ state.isAdmin = userInfo.userType === 0;
+ if (state.isAdmin) {
+ state.companyList = companyList
+ }
+ isReview.value = false;
+ showEditor.value = false
+ title.value = type === 'add' ? '新增' : type === 'edit' ? '编辑' : '查看';
+ if (type === 'edit' || type === 'review') {
+ Object.keys(state.noticeForm).forEach(key => {
+ if (key in value) {
+ state.noticeForm[key] = value[key]
}
+ })
+ state.noticeForm.companySummary = value.companySummary
+ state.noticeForm.id = value.id
+ if (state.isAdmin) {
+ state.noticeForm.companyId = value.companyId
+ state.noticeForm.companyName = value.companyName
}
- if(type === 'review') {
- showEditor.value = false
- isReview.value = true;
+
+ if (value.filePath) {
+ const obj = {
+ url: value.filePath,
+ name: value.fileName
+ }
+ state.fileType = value.fileName.split('.')[1]
+ state.fileUrl = import.meta.env.VITE_APP_BASE_API + '/' + value.filePath
+ state.fileList = [obj]
}
- if(type === 'edit' || type === 'add') {
- showEditor.value = true;
- isReview.value = false;
- }
- if(type === 'add'){
- reset()
- }
+ }
+ if (type === 'review') {
+ showEditor.value = false
+ isReview.value = true;
+ }
+ if (type === 'edit' || type === 'add') {
+ showEditor.value = true;
+ isReview.value = false;
+ }
+ if (type === 'add') {
+ reset()
+ }
dialogVisible.value = true;
}
-const getEditorData = (val) =>{
- state.noticeForm.companySummary = val;
+const getEditorData = (val) => {
+ state.noticeForm.companySummary = val;
}
const showFile = (e) => {
- if(e.target.nodeName === 'A'){
- console.log("e",e)
- e.preventDefault();
- const file = {
- fileUrl: e.target.href,
- fileName: e.target.innerHTML
+ if (e.target.nodeName === 'A') {
+ console.log("e", e)
+ e.preventDefault();
+ const file = {
+ fileUrl: e.target.href,
+ fileName: e.target.innerHTML
+ }
+ axios.get(file.fileUrl, {
+ headers:
+ {
+ 'Content-Type': 'application/json',
+ 'Authorization': getToken(),
+ },
+ responseType: 'blob'
}
- axios.get( file.fileUrl,{
- headers:
- {
- 'Content-Type': 'application/json',
- 'Authorization':getToken(),
- },
- responseType: 'blob'
- }
- ).then(res=>{
- if (res) {
- const link = document.createElement('a')
- let blob = new Blob([res.data],{type: res.data.type})
- link.style.display = "none";
- link.href = URL.createObjectURL(blob); // 创建URL
- link.setAttribute("download", file.fileName);
- document.body.appendChild(link);
- link.click();
- document.body.removeChild(link);
- } else {
- this.$message.error('获取文件失败')
- }
- // handleClose();
- })
- }
+ ).then(res => {
+ if (res) {
+ const link = document.createElement('a')
+ let blob = new Blob([res.data], {type: res.data.type})
+ link.style.display = "none";
+ link.href = URL.createObjectURL(blob); // 创建URL
+ link.setAttribute("download", file.fileName);
+ document.body.appendChild(link);
+ link.click();
+ document.body.removeChild(link);
+ } else {
+ this.$message.error('获取文件失败')
+ }
+ // handleClose();
+ })
+ }
}
-const getCompanyList = async (val)=>{
- if(val != ""){
- const queryParams = {
- name: val
- }
- const res = await getCompany(queryParams)
- if (res.code == 200) {
- state.companyList = res.data.list
- } else {
- ElMessage.warning(res.message)
+
+const onSubmit = async () => {
+ state.noticeForm.companySummary = tinyMCE.activeEditor.getContent();
+ if (!state.isAdmin) {
+ const userInfo = JSON.parse(Cookies.get('userInfo'))
+ state.noticeForm.companyId = userInfo.companyId
+ state.noticeForm.companyName = userInfo.companyName
+ }
+ // // myEditor.value.submit();
+ const valid = await noticeRef.value.validate();
+ if (valid) {
+ if (state.noticeForm.companySummary == "") {
+ ElMessage({
+ type: 'warning',
+ message: '请输入单位概况'
+ });
+ return;
+ }
+ if (title.value === '新增') {
+ const {id, ...data} = JSON.parse(JSON.stringify(state.noticeForm))
+ const res = await addCom(data)
+ if (res.code === 200) {
+ ElMessage({
+ type: 'success',
+ message: '新增成功'
+ });
+ } else {
+ ElMessage.warning(res.message)
+ }
+ emit("getList")
+ reset();
+ showEditor.value = false
+ myEditor.value.clear();
+ noticeRef.value.clearValidate();
+ dialogVisible.value = false;
+ } else if (title.value === '编辑') {
+ const {...data} = JSON.parse(JSON.stringify(state.noticeForm))
+ const res = await editCom(data)
+ if (res.code === 200) {
+ ElMessage({
+ type: 'success',
+ message: '编辑成功'
+ });
+ } else {
+ ElMessage.warning(res.message)
+ }
+ emit("getList")
+ reset();
+ showEditor.value = false
+ myEditor.value.clear();
+ noticeRef.value.clearValidate();
+ dialogVisible.value = false;
}
}
}
-const onSubmit = async () => {
- state.noticeForm.companySummary = tinyMCE.activeEditor.getContent();
- if(!state.isAdmin){
- const userInfo = JSON.parse(Cookies.get('userInfo'))
- state.noticeForm.companyId = userInfo.companyId
- state.noticeForm.companyName = userInfo.companyName
- }
- // // myEditor.value.submit();
- const valid = await noticeRef.value.validate();
- if(valid){
- if(state.noticeForm.companySummary == "") {
- ElMessage({
- type: 'warning',
- message: '请输入企业概况'
- });
- return;
- }
- if(title.value === '新增'){
- const {id,...data} = JSON.parse(JSON.stringify(state.noticeForm))
- const res = await addCom(data)
- if(res.code === 200){
- ElMessage({
- type: 'success',
- message: '新增成功'
- });
- }else{
- ElMessage.warning(res.message)
- }
- emit("getList")
- reset();
- showEditor.value=false
- myEditor.value.clear();
- noticeRef.value.clearValidate();
- dialogVisible.value = false;
- }else if(title.value === '编辑') {
- const {...data} = JSON.parse(JSON.stringify(state.noticeForm))
- const res = await editCom(data)
- if(res.code === 200){
- ElMessage({
- type: 'success',
- message: '编辑成功'
- });
- }else{
- ElMessage.warning(res.message)
- }
- emit("getList")
- reset();
- showEditor.value=false
- myEditor.value.clear();
- noticeRef.value.clearValidate();
- dialogVisible.value = false;
- }
- }
-}
-
const selectValue = (val) => {
state.companyList.forEach(item => {
- if(item.name === val){
+ if (item.name === val) {
state.noticeForm.companyId = item.id
}
})
}
const handleClose = () => {
- if(title.value ==="新增"|| title.value ==='编辑'){
- myEditor.value.clear();
- showEditor.value=false
- }
+ if (title.value === "新增" || title.value === '编辑') {
+ myEditor.value.clear();
+ showEditor.value = false
+ }
- // reset()
- state.companyList = []
- noticeRef.value.clearValidate();
- dialogVisible.value = false;
+ // reset()
+ state.fileList = []
+ state.companyList = []
+ noticeRef.value.clearValidate();
+ dialogVisible.value = false;
}
const reset = () => {
- state.noticeForm = {
- id: '',
- companySummary: '',
- companyId:null,
- companyName: ''
- }
- state.companyList = []
+ state.noticeForm = {
+ id: '',
+ companySummary: '',
+ companyId: null,
+ companyName: '',
+ filePath: '',
+ fileName: '',
+ companyType: null,
+ industry: '',
+ legalPersonCode: '',
+ legalPerson: '',
+ registeredCapital: '',
+ officeAddress: '',
+ otherAddress: ''
+ }
+ state.fileList = []
+}
+const handleAvatarSuccess = (res, uploadFile) => {
+ if (res.code == 200) {
+ state.noticeForm.fileName = res.data.originName
+ state.noticeForm.filePath = res.data.path
+ } else {
+ state.fileList = []
+ ElMessage({
+ type: 'warning',
+ message: '文件上传失败'
+ })
+ }
}
+const showTip = () => {
+ ElMessage({
+ type: 'warning',
+ message: '超出文件上传数量'
+ });
+}
+const picSize = async (rawFile) => {
+ if (rawFile.size / 1024 / 1024 > 5) {
+ ElMessage({
+ type: 'warning',
+ message: '文件大小不能超过5M'
+ });
+ return false
+ }
+};
+const handleRemove = async (file, uploadFiles) => {
+
+ let path = state.noticeForm.filePath;
+ await delPic({path: path}).then(res => {
+ if (res.code == 200) {
+ // ElMessage({
+ // type: 'success',
+ // message: '文件已删除'
+ // })
+ state.noticeForm.filePath = ''
+ state.noticeForm.fileName = ''
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.message
+ })
+ }
+ }).catch(() => {
+ state.noticeForm.filePath = ''
+ });
+}
+
+
defineExpose({
- openDialog
+ openDialog
});
</script>
<style scoped lang="scss">
-.notice{
- :deep(.el-form .el-form-item__label) {
- font-size: 15px;
- }
- .file {
- display: flex;
- flex-direction: column;
- align-items: flex-start;
- }
+.notice {
+ :deep(.el-form .el-form-item__label) {
+ font-size: 15px;
+ }
+
+ .file {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ }
}
+
.reviewTable {
- :deep(table){
- border: 1px solid #ccc;
- text-align: center;
- }
- :deep(table td){
- border: 1px solid #ccc;
- text-align: center;
- padding: 0 5px;
- }
- :deep(table th){
- border: 1px solid #ccc;
- }
+ :deep(table) {
+ border: 1px solid #ccc;
+ text-align: center;
+ }
+
+ :deep(table td) {
+ border: 1px solid #ccc;
+ text-align: center;
+ padding: 0 5px;
+ }
+
+ :deep(table th) {
+ border: 1px solid #ccc;
+ }
}
--
Gitblit v1.9.2