bonus
/
smart-bid-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

页面样式修改

This commit is contained in:
cwchen 2025-11-14 15:03:21 +08:00
parent 84092b55b3
commit 47fb3304f6
6 changed files with 114 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/views/enterpriseLibrary/technical/components/TechnicalDetail.vue
View File

@ -11,6 +11,8 @@
<el-col :span="6" class="pane-left">
<BasicInfoDetail ref="basicInfo" :detailData="detailData" />
</el-col>
</el-row>
<el-row :gutter="24" class="content-row">
<!-- 文件上传 -->
<el-col :span="6" class="pane-center">
<FileInfoDetail ref="fileInfo" :detailData="detailData" />
@ -85,25 +87,24 @@ export default {
<style scoped lang="scss">
.app-container {
height: calc(100vh - 84px);
width: 100%;
padding: 24px;
box-sizing: border-box;
background: linear-gradient(180deg, #F1F6FF 20%, #E5EFFF 100%);
min-height: 100vh;
overflow-y: auto;
display: flex;
flex-direction: column;
overflow: hidden;
position: relative;
// 当显示动画时，禁用页面点击
&.no-pointer-events {
pointer-events: none;
// 子元素也继承禁用点击
* {
pointer-events: none;
}
}
margin: 0;
}
.content-body {
flex: 1;
overflow-y: auto;
overflow-x: hidden;
margin-top: 20px;
min-height: 0; // 确保 flex 子元素可以正确收缩
}
.content-row {
@ -118,10 +119,10 @@ export default {
.pane-right {
background: #fff;
border-radius: 16px 16px 16px 16px;
min-height: 600px;
min-height: 200px;
box-shadow: 0px 4px 20px 0px rgba(31, 35, 55, 0.1);
padding: 0;
margin-bottom: 20px;
margin-bottom: 10px;
flex: 1;
min-width: 0;
}
@ -130,8 +131,8 @@ export default {
display: flex;
justify-content: flex-end;
align-items: center;
margin-bottom: 20px;
gap: 12px;
flex-shrink: 0;
}
.edit-btn {
@ -172,27 +173,4 @@ export default {
box-shadow: 0px 6px 12px 0px rgba(76, 76, 76, 0.3);
}
}
// 动画定义
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@keyframes slideInUp {
from {
opacity: 0;
transform: translateY(30px) scale(0.9);
}
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}
</style>

21
src/views/enterpriseLibrary/technical/components/TechnicalForm.vue
View File

@ -16,6 +16,8 @@
<el-col :span="6" class="pane-left">
<BasicInfo ref="basicInfo" :detailData="detailData" />
</el-col>
</el-row>
<el-row :gutter="24" class="content-row">
<!-- 文件上传 -->
<el-col :span="6" class="pane-center">
<FileInfo ref="fileInfo" :detailData="detailData" />
@ -200,11 +202,16 @@ export default {
<style scoped lang="scss">
.app-container {
height: calc(100vh - 84px);
width: 100%;
padding: 24px;
box-sizing: border-box;
background: linear-gradient(180deg, #F1F6FF 20%, #E5EFFF 100%);
min-height: 100vh;
overflow-y: auto;
display: flex;
flex-direction: column;
overflow: hidden;
position: relative;
margin: 0;
// 当显示动画时，禁用页面点击
&.no-pointer-events {
@ -305,7 +312,11 @@ export default {
}
.content-body {
flex: 1;
overflow-y: auto;
overflow-x: hidden;
margin-top: 20px;
min-height: 0; // 确保 flex 子元素可以正确收缩
}
.content-row {
@ -320,10 +331,10 @@ export default {
.pane-right {
background: #fff;
border-radius: 16px 16px 16px 16px;
min-height: 600px;
min-height: 200px;
box-shadow: 0px 4px 20px 0px rgba(31, 35, 55, 0.1);
padding: 0;
margin-bottom: 20px;
margin-bottom: 10px;
flex: 1;
min-width: 0;
}
@ -332,8 +343,8 @@ export default {
display: flex;
justify-content: flex-end;
align-items: center;
margin-bottom: 20px;
gap: 12px;
flex-shrink: 0;
}
.search-btn {

67
src/views/enterpriseLibrary/technical/components/child/BasicInfo.vue
View File

@ -5,30 +5,45 @@
<span>基础信息</span>
</div>
<el-form :model="form" :rules="rules" ref="basicInfoForm" label-width="110px" label-position="top">
<el-form-item label="电压等级" prop="voltageLevel">
<el-select v-model="form.voltageLevel" placeholder="请选择电压等级" class="form-item">
<el-option v-for="item in dict.type.voltage_level" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="建设性质" prop="natureConstruction">
<el-select v-model="form.natureConstruction" placeholder="请选择工程性质" class="form-item" multiple>
<el-option v-for="item in dict.type.construction_nature" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="结构形式" prop="structuralForm">
<el-select v-model="form.structuralForm" placeholder="请选择结构形式" class="form-item">
<el-option v-for="item in dict.type.structural_form" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="基础形式" prop="basicForm">
<el-select v-model="form.basicForm" placeholder="请选择基础形式" class="form-item">
<el-option v-for="item in dict.type.basic_form" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-row :gutter="24">
<el-col :span="8">
<el-form-item label="电压等级" prop="voltageLevel">
<el-select v-model="form.voltageLevel" placeholder="请选择电压等级" class="form-item">
<el-option v-for="item in dict.type.voltage_level" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="建设性质" prop="natureConstruction">
<el-select v-model="form.natureConstruction" placeholder="请选择工程性质" class="form-item" multiple>
<el-option v-for="item in dict.type.construction_nature" :key="item.value"
:label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="结构形式" prop="structuralForm">
<el-select v-model="form.structuralForm" placeholder="请选择结构形式" class="form-item">
<el-option v-for="item in dict.type.structural_form" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="8">
<el-form-item label="基础形式" prop="basicForm">
<el-select v-model="form.basicForm" placeholder="请选择基础形式" class="form-item">
<el-option v-for="item in dict.type.basic_form" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</template>
@ -68,9 +83,9 @@ export default {
}
},
watch: {
detailData:{
detailData: {
handler(newVal) {
if(Object.keys(newVal).length > 0){
if (Object.keys(newVal).length > 0) {
this.setFormData(newVal)
}
},

25
src/views/enterpriseLibrary/technical/components/child/BasicInfoDetail.vue
View File

@ -5,10 +5,23 @@
<span>基础信息</span>
</div>
<div class="detail-content">
<DetailItem label="电压等级" :value="form.voltageLevel" />
<DetailItem label="建设性质" :value="form.natureConstruction" />
<DetailItem label="结构形式" :value="form.structuralForm" />
<DetailItem label="基础形式" :value="form.basicForm" />
<el-row :gutter="24">
<el-col :span="8">
<DetailItem label="电压等级" :value="form.voltageLevel" />
</el-col>
<el-col :span="8">
<DetailItem label="建设性质" :value="form.natureConstruction" />
</el-col>
<el-col :span="8">
<DetailItem label="结构形式" :value="form.structuralForm" />
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="8">
<DetailItem label="基础形式" :value="form.basicForm" />
</el-col>
</el-row>
</div>
</div>
</template>
@ -37,9 +50,9 @@ export default {
}
},
watch: {
detailData:{
detailData: {
handler(newVal) {
if(Object.keys(newVal).length > 0){
if (Object.keys(newVal).length > 0) {
this.setDetailData(newVal)
}
},

29
src/views/enterpriseLibrary/technical/components/child/FileInfo.vue
View File

@ -5,12 +5,17 @@
<span>文件上传</span>
</div>
<el-form :model="form" :rules="rules" ref="fileInfoForm" label-width="110px" label-position="top">
<!-- 文件上传 -->
<el-form-item label="文件上传" prop="fileList">
<UploadMoreFile :fileList="form.fileList" @file-change="handleFileChange" @del-file="handleDelFile"
type="business_license" :uploadType="uploadType" :maxFileTips="maxFileTips"
:fileUploadRule="fileUploadRule" :limitUploadNum="limitUploadNum" :disabled="disabled" />
</el-form-item>
<el-row :gutter="24">
<el-col :span="8">
<!-- 文件上传 -->
<el-form-item label="文件上传" prop="fileList">
<UploadMoreFile :fileList="form.fileList" @file-change="handleFileChange"
@del-file="handleDelFile" type="business_license" :uploadType="uploadType"
:maxFileTips="maxFileTips" :fileUploadRule="fileUploadRule" :limitUploadNum="limitUploadNum"
:disabled="disabled" />
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</template>
@ -61,9 +66,9 @@ export default {
}
},
watch: {
detailData:{
detailData: {
handler(newVal) {
if(Object.keys(newVal).length > 0){
if (Object.keys(newVal).length > 0) {
this.limitUploadNum = 1;
this.disabled = true;
this.setFormData(newVal)
@ -98,7 +103,7 @@ export default {
// 文件删除时触发
handleDelFile(file) {
const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
if(delPath){
if (delPath) {
this.form.delFileList.push(delPath);
}
},
@ -109,13 +114,13 @@ export default {
delFileList: []
}
},
getFileList(){
getFileList() {
return this.detailData.resourceFileVoList.map(item => {
return {
name: item.fileName,
filePath: item.filePath,
lsFilePath:item.lsFilePath,
fileType:item.fileType
lsFilePath: item.lsFilePath,
fileType: item.fileType
};
});
}

6
src/views/enterpriseLibrary/technical/components/child/FileInfoDetail.vue
View File

@ -5,7 +5,11 @@
<span>文件上传</span>
</div>
<div class="detail-content">
<FileOrImageDisplay label="文件上传" :file="form.fileList[0]" :image-url="form.url" />
<el-row :gutter="24">
<el-col :span="8">
<FileOrImageDisplay label="文件上传" :file="form.fileList[0]" :image-url="form.url" />
</el-col>
</el-row>
</div>
</div>
</template>