796 lines
25 KiB
Vue
796 lines
25 KiB
Vue
<template>
|
||
<!-- 表格形式的项目信息页面 -- 简易版 -->
|
||
<div class="extendInfo whiteBlock">
|
||
<vue-scroll style="width: 100%">
|
||
<div class="btn_wrap">
|
||
<el-button
|
||
v-permission="{key: 'xmkzxx_edit', menuPath: '/project/summary/extendInfo'}"
|
||
type="primary"
|
||
size="medium"
|
||
@click="editBtn">{{$t("message.companyDiagram.Table.edit")}}
|
||
</el-button>
|
||
</div>
|
||
<div>
|
||
<div class="custom_tab">
|
||
<div class="title">
|
||
{{ $t("message.extendInfo.projectExtension") }}
|
||
</div>
|
||
<div class="flex4">
|
||
<div class="type_content">
|
||
<!-- 施工合同额 -->
|
||
<div class="flex3">
|
||
<span class="width_35">
|
||
{{ $t("message.extendInfo.contractPrice") }}
|
||
</span>
|
||
<span class="width_65">{{ projectDetail.contractPrice }}</span>
|
||
</div>
|
||
<!-- 总投资额(万元) -->
|
||
<div class="flex3">
|
||
<span class="width_35">
|
||
{{ $t("message.extendInfo.investmentPrice") }}
|
||
</span>
|
||
<span class="width_65">{{ projectDetail.investmentPrice }}</span>
|
||
</div>
|
||
|
||
<div class="flex3">
|
||
<span class="width_35">
|
||
{{ $t("message.extendInfo.contractSigning") }}
|
||
</span>
|
||
<span class="width_65">{{
|
||
projectDetail.contractSignTime
|
||
}}</span>
|
||
</div>
|
||
<div class="flex3">
|
||
<span class="width_35">
|
||
{{ $t("message.extendInfo.contractProjectTime") }}
|
||
</span>
|
||
<span class="width_65 bg_color"
|
||
>{{ projectDetail.contractPeriodStartTime }} /
|
||
{{ projectDetail.contractPeriodEndTime }}</span
|
||
>
|
||
</div>
|
||
<div class="flex3">
|
||
<span class="width_35">
|
||
{{ $t("message.extendInfo.actualConstructionTime") }}
|
||
</span>
|
||
<span class="width_65"
|
||
>{{ projectDetail.realPeriodStartTime }} /
|
||
{{ projectDetail.realPeriodEndTime }}
|
||
</span>
|
||
</div>
|
||
<div class="flex3">
|
||
<span class="width_35">
|
||
{{ $t("message.extendInfo.toryBurchOnSale") }}
|
||
</span>
|
||
<span class="width_65 bg_color">{{
|
||
projectDetail.bidWinner
|
||
}}</span>
|
||
</div>
|
||
<div class="flex3">
|
||
<span class="width_35">
|
||
{{ $t("message.extendInfo.architect") }}
|
||
</span>
|
||
<span class="width_65">{{ projectDetail.designUnit }}</span>
|
||
</div>
|
||
<div class="flex3">
|
||
<span class="width_35 bg_color">
|
||
{{ $t("message.extendInfo.ownersUnit") }}
|
||
</span>
|
||
<span class="width_65 bg_color" style="padding: 0 15px">{{
|
||
projectDetail.ownerUnit
|
||
}}</span>
|
||
</div>
|
||
|
||
<div class="flex3" style="height: 120px">
|
||
<span class="width_35">
|
||
{{ $t("message.extendInfo.projectProfile") }}
|
||
</span>
|
||
<span
|
||
class="position"
|
||
style="padding: 0 15px; box-sizing: border-box"
|
||
>{{ projectDetail.projectOverview }}</span
|
||
>
|
||
</div>
|
||
</div>
|
||
<div class="type_content">
|
||
<div class="flex3">
|
||
<!-- <span class="width_35"></span> -->
|
||
<span class="width_65"></span>
|
||
</div>
|
||
<div class="flex3">
|
||
<!-- <span class="width_35"></span> -->
|
||
<span class="width_65"></span>
|
||
</div>
|
||
<div class="flex3">
|
||
<!-- <span class="width_35"></span> -->
|
||
<span class="width_65"></span>
|
||
</div>
|
||
<div class="flex3">
|
||
<span
|
||
class="width_35 bg_color"
|
||
style="width: 35%; height: 60px; border: none"
|
||
></span>
|
||
<span class="width_65 bg_color"></span>
|
||
</div>
|
||
<div class="flex3">
|
||
<!-- <span class="width_35"></span> -->
|
||
<span class="width_65"></span>
|
||
</div>
|
||
<div class="flex3">
|
||
<span class="width_35 border_l">
|
||
{{ $t("message.extendInfo.constructionUnit") }}
|
||
</span>
|
||
<span class="width_65 bg_color">{{
|
||
projectDetail.constructionUnit
|
||
}}</span>
|
||
</div>
|
||
<div class="flex3">
|
||
<span class="width_35 border_l">
|
||
{{ $t("message.extendInfo.supervisingUnit") }}
|
||
</span>
|
||
<span class="width_65">{{ projectDetail.supervisorUnit }}</span>
|
||
</div>
|
||
<!-- <div class="flex3">
|
||
<span class="width_35 border_l">
|
||
{{'代建单位'}}
|
||
</span>
|
||
<span class="width_65">{{ projectDetail.supervisorUnit }}</span>
|
||
</div> -->
|
||
<div class="flex3">
|
||
<span class="width_35 border_l">
|
||
安全教育培训
|
||
</span>
|
||
<span class="width_65 bg_color">{{ projectDetail.eduCourseName }}</span>
|
||
</div>
|
||
<div class="flex3" style="height: 120px">
|
||
<span class=""></span>
|
||
<span class="width_65"></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</vue-scroll>
|
||
<!-- 项目弹框 -->
|
||
<el-dialog
|
||
:modal-append-to-body="false"
|
||
class="projectDialog"
|
||
:title="projectDialogTitle"
|
||
:visible.sync="editProjectDialog"
|
||
width="700px"
|
||
:close-on-click-modal="false"
|
||
>
|
||
<div class="dialog_content" style="padding: 0 100px">
|
||
<el-form
|
||
ref="editProjectForm"
|
||
:model="editProjectForm"
|
||
label-width="140px"
|
||
:rules="editProjectFormRules"
|
||
size="medium"
|
||
>
|
||
<el-form-item
|
||
:label="$t('message.extendInfo.contractPrice')"
|
||
prop="contractPrice"
|
||
>
|
||
<el-input
|
||
type="number"
|
||
@change="checkValue()"
|
||
v-model="editProjectForm.contractPrice"
|
||
placeholder="请输入数字类型"
|
||
></el-input>
|
||
<!-- <el-input-number
|
||
type="number"
|
||
@change="checkValue()"
|
||
style="width: 100%"
|
||
v-model="editProjectForm.contractPrice"
|
||
:min="0"
|
||
:placeholder="$t('message.extendInfo.pleaseEnter')"
|
||
></el-input-number> -->
|
||
</el-form-item>
|
||
<el-form-item
|
||
:label="$t('message.extendInfo.investmentPrice')"
|
||
prop="investmentPrice"
|
||
>
|
||
<el-input
|
||
type="number"
|
||
@change="checkValue()"
|
||
v-model="editProjectForm.investmentPrice"
|
||
placeholder="请输入数字类型"
|
||
></el-input>
|
||
<!-- <el-input-number
|
||
type="number"
|
||
@change="checkValue()"
|
||
style="width: 100%"
|
||
v-model="editProjectForm.contractPrice"
|
||
:min="0"
|
||
:placeholder="$t('message.extendInfo.pleaseEnter')"
|
||
></el-input-number> -->
|
||
</el-form-item>
|
||
<el-form-item
|
||
:label="$t('message.extendInfo.contractSigning')"
|
||
prop="contractSignTime"
|
||
>
|
||
<el-date-picker
|
||
style="width: 100%"
|
||
v-model="editProjectForm.contractSignTime"
|
||
type="date"
|
||
value-format="yyyy-MM-dd"
|
||
:placeholder="$t('message.extendInfo.optionDate')"
|
||
>
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
<el-form-item
|
||
:label="$t('message.extendInfo.contractProjectTime')"
|
||
prop="contractPeriodEndTime"
|
||
>
|
||
<!-- 合同 -->
|
||
<el-date-picker
|
||
v-model="editProjectForm.contractTime"
|
||
type="daterange"
|
||
unlink-panels
|
||
range-separator="至"
|
||
start-placeholder="开始日期"
|
||
end-placeholder="结束日期"
|
||
clearable
|
||
value-format="yyyy-MM-dd"
|
||
format="yyyy-MM-dd"
|
||
style="width: 100%"
|
||
@input="getContractTime"
|
||
>
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
<el-form-item
|
||
:label="$t('message.extendInfo.actualConstructionTime')"
|
||
prop="realPeriodStartTime"
|
||
>
|
||
<!-- 实际 -->
|
||
<el-date-picker
|
||
v-model="editProjectForm.realTime"
|
||
type="daterange"
|
||
unlink-panels
|
||
range-separator="至"
|
||
start-placeholder="开始日期"
|
||
end-placeholder="结束日期"
|
||
clearable
|
||
style="width: 100%"
|
||
value-format="yyyy-MM-dd"
|
||
format="yyyy-MM-dd"
|
||
@input="getRealTime"
|
||
>
|
||
</el-date-picker>
|
||
<!-- <el-date-picker
|
||
style="width: 100%"
|
||
v-model="editProjectForm.realTime"
|
||
type="daterange"
|
||
value-format="yyyy-MM-dd"
|
||
:range-separator="$t('message.extendInfo.to')"
|
||
:start-placeholder="$t('message.extendInfo.startDate')"
|
||
:end-placeholder="$t('message.extendInfo.endingDate')"
|
||
@change="getRealTime"
|
||
>
|
||
</el-date-picker> -->
|
||
</el-form-item>
|
||
<el-form-item
|
||
:label="$t('message.extendInfo.toryBurchOnSale')"
|
||
prop="bidWinner"
|
||
>
|
||
<el-input
|
||
v-model="editProjectForm.bidWinner"
|
||
:placeholder="$t('message.extendInfo.pleaseEnter')"
|
||
></el-input>
|
||
</el-form-item>
|
||
<el-form-item
|
||
:label="$t('message.extendInfo.architect')"
|
||
prop="designUnit"
|
||
>
|
||
<el-input
|
||
v-model="editProjectForm.designUnit"
|
||
:placeholder="$t('message.extendInfo.pleaseEnter')"
|
||
></el-input>
|
||
</el-form-item>
|
||
<el-form-item
|
||
:label="$t('message.extendInfo.constructionUnit')"
|
||
prop="constructionUnit"
|
||
>
|
||
<el-input
|
||
v-model="editProjectForm.constructionUnit"
|
||
:placeholder="$t('message.extendInfo.pleaseEnter')"
|
||
></el-input>
|
||
</el-form-item>
|
||
<el-form-item
|
||
:label="$t('message.extendInfo.supervisingUnit')"
|
||
prop="supervisorUnit"
|
||
>
|
||
<el-input
|
||
v-model="editProjectForm.supervisorUnit"
|
||
:placeholder="$t('message.extendInfo.pleaseEnter')"
|
||
></el-input>
|
||
</el-form-item>
|
||
<el-form-item
|
||
:label="$t('message.extendInfo.ownersUnit')"
|
||
prop="ownerUnit"
|
||
>
|
||
<el-input
|
||
v-model="editProjectForm.ownerUnit"
|
||
:placeholder="$t('message.extendInfo.pleaseEnter')"
|
||
></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="安全教育培训" prop="educationId">
|
||
<el-select
|
||
v-model="editProjectForm.educationId"
|
||
style="width: 100%"
|
||
placeholder="请选择"
|
||
>
|
||
<el-option
|
||
v-for="item in educationList"
|
||
:key="item.id"
|
||
:label="item.eduCourseName"
|
||
:value="item.id"
|
||
>
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item
|
||
:label="$t('message.extendInfo.projectProfile')"
|
||
prop="projectOverview"
|
||
>
|
||
<el-input
|
||
v-model="editProjectForm.projectOverview"
|
||
:placeholder="$t('message.extendInfo.pleaseEnter')"
|
||
type="textarea"
|
||
></el-input>
|
||
</el-form-item>
|
||
<!-- <el-form-item
|
||
label="配置现场大屏视频"
|
||
>
|
||
<div class="videoBtn">
|
||
<div class="videoInner" v-for="(item, index) in dialogInfo.videoUploadList" :key="index" >
|
||
<el-upload
|
||
ref="upload"
|
||
class="upload-demo"
|
||
:action="$store.state.UPLOADURL"
|
||
:on-success="file => handleSuccess(file, index)"
|
||
:beforeUpload="handleBeforeUploadVideo"
|
||
name="files"
|
||
:show-file-list="false"
|
||
>
|
||
<el-button type="primary" size="medium">{{item.title}}<i class="el-icon-upload"></i></el-button>
|
||
</el-upload>
|
||
</div>
|
||
|
||
</div>
|
||
</el-form-item> -->
|
||
</el-form>
|
||
<div class="dialog-footer">
|
||
<el-button
|
||
class="cancleBtn"
|
||
@click="editProjectDialog = false"
|
||
icon="el-icon-circle-close"
|
||
size="medium"
|
||
>{{ $t("message.companyDiagram.cancel") }}</el-button
|
||
>
|
||
<el-button
|
||
type="primary"
|
||
icon="el-icon-circle-check"
|
||
size="medium"
|
||
@click="onSubmit('editProjectForm')"
|
||
>{{ $t("message.companyDiagram.determine") }}</el-button
|
||
>
|
||
</div>
|
||
</div>
|
||
</el-dialog>
|
||
<!-- 查看大图 -->
|
||
<el-dialog :modal-append-to-body="false" :visible.sync="bigImageDialog">
|
||
<img width="100%" :src="bigImageUrl" alt />
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
<script>
|
||
import {
|
||
getProjectExtendInfoApi,
|
||
editProjectExtendApi,
|
||
getSafeEducationDataApi,
|
||
configWeekVideoListApi,
|
||
configWeekVideoSaveApi
|
||
} from "@/assets/js/api/baseInfo.js";
|
||
import axios from "axios";
|
||
export default {
|
||
name: "extendInfo",
|
||
data() {
|
||
return {
|
||
videoConfigData:'',
|
||
dialogInfo:{
|
||
postData:'',
|
||
videoUploadList:[{id:1,title:'周一'},{id:1,title:'周二'},{id:1,title:'周三'},{id:1,title:'周四'},{id:1,title:'周五'},{id:1,title:'周六'},{id:1,title:'周日'}],
|
||
},
|
||
projectDialogTitle: this.$t("message.extendInfo.editProjectInfo"),
|
||
editProjectDialog: false,
|
||
editProjectForm: {
|
||
contractTime: ["", ""],
|
||
realTime: [],
|
||
contractSignTime: "",
|
||
contractPeriodEndTime: "",
|
||
contractPeriodStartTime: "",
|
||
realPeriodStartTime: "",
|
||
realPeriodEndTime: "",
|
||
bidWinner: "",
|
||
designUnit: "",
|
||
constructionUnit: "",
|
||
supervisorUnit: "",
|
||
ownerUnit: "",
|
||
projectOverview: "",
|
||
educationId: "",
|
||
contractPrice: "",
|
||
investmentPrice: ""
|
||
},
|
||
educationList: [],
|
||
editProjectFormRules: this.$t("message.extendInfo.editProjectFormRules"),
|
||
projectSn: "",
|
||
projectDetail: {},
|
||
bigImageDialog: false,
|
||
bigImageUrl: "",
|
||
provincesCityArr: [],
|
||
provincesCityList: [],
|
||
cascaderProps: {
|
||
label: "name",
|
||
children: "childrenlist",
|
||
value: "code",
|
||
},
|
||
showMap: false,
|
||
};
|
||
},
|
||
created() {
|
||
this.projectSn = this.$store.state.projectSn;
|
||
console.log(axios.defaults.baseURL,"777777777777777")
|
||
this.getProjectExtendInfo();
|
||
this.getEducationListFn();
|
||
},
|
||
methods: {
|
||
async configWeekVideoListFn(){
|
||
let data = {
|
||
projectSn: ''
|
||
}
|
||
if(axios.defaults.baseURL == 'http://182.90.224.237:51234/' || axios.defaults.baseURL == 'http://192.168.34.221:9111/') data.projectSn = 'BD3137498CB84BF0969979E0342CDBCA'
|
||
if(axios.defaults.baseURL == 'http://42.180.188.17:9809/' || axios.defaults.baseURL == 'http://42.180.188.17:11211/') data.projectSn = '471568F45EB247A3912A0D10EA1BFCEB'
|
||
await configWeekVideoListApi(data).then(res =>{
|
||
if (res.result) {
|
||
this.videoConfigData = res.result;
|
||
}
|
||
})
|
||
},
|
||
async configWeekVideoEditFn(url,weekIndex){
|
||
console.log(url);
|
||
let requestData = {
|
||
// projectSn: this.$store.state.projectSn,
|
||
projectSn: "",
|
||
type: 3
|
||
};
|
||
if(axios.defaults.baseURL == 'http://182.90.224.237:51234/' || axios.defaults.baseURL == 'http://192.168.34.221:9111/') requestData.projectSn = 'BD3137498CB84BF0969979E0342CDBCA'
|
||
if(axios.defaults.baseURL == 'http://42.180.188.17:9809/' || axios.defaults.baseURL == 'http://42.180.188.17:11211/') requestData.projectSn = '471568F45EB247A3912A0D10EA1BFCEB'
|
||
// 星期参数
|
||
console.log("=============================")
|
||
console.log(weekIndex,"weekIndex")
|
||
console.log("=============================")
|
||
// const today = weekIndex == 6 ? 0 : weekIndex + 1;
|
||
// const weekParamsKey = ["sun", "mon", "tues", "wed", "thur", "fri", "sat"];
|
||
// requestData[weekParamsKey[+today]] = url;
|
||
if(weekIndex == 0) requestData.mon = url
|
||
if(weekIndex == 1) requestData.tues = url
|
||
if(weekIndex == 2) requestData.wed = url
|
||
if(weekIndex == 3) requestData.thur = url
|
||
if(weekIndex == 4) requestData.fri = url
|
||
if(weekIndex == 5) requestData.sat = url
|
||
if(weekIndex == 6) requestData.sun = url
|
||
|
||
// type参数
|
||
// 项目看板：1 总览大屏：2 现场大屏：3
|
||
requestData.type = 3
|
||
// id参数
|
||
if (this.videoConfigData && this.videoConfigData.length) {
|
||
requestData.id = this.videoConfigData[0].id;
|
||
}
|
||
const res = await configWeekVideoSaveApi(requestData);
|
||
if (res.success) {
|
||
console.log("修改成功", res);
|
||
this.$message({
|
||
showClose: true,
|
||
message: "上传成功",
|
||
type: "success"
|
||
});
|
||
// configWeekVideoListFn(true);
|
||
// emits("updateConfig");
|
||
}
|
||
},
|
||
handleSuccess(file,index){
|
||
if (file.code == 200 || file.status == "SUCCESS") {
|
||
console.log(file, "上传成功");
|
||
let url = file.data[0].imageUrl;
|
||
// this.imgUrl = url;
|
||
this.configWeekVideoEditFn( url, index);
|
||
}
|
||
},
|
||
handleBeforeUploadVideo(file){
|
||
console.log(file, "上传之前");
|
||
let fileType = file.type.split("/")[0];
|
||
if (fileType == "video") {
|
||
return true;
|
||
} else {
|
||
this.$message({
|
||
showClose: true,
|
||
message: "请选择正确的视频文件",
|
||
type: "warning"
|
||
});
|
||
return false;
|
||
}
|
||
},
|
||
getEducationListFn() {
|
||
let requestData = {
|
||
projectSn: this.projectSn,
|
||
pageSize: -1
|
||
}
|
||
getSafeEducationDataApi(requestData).then(res => {
|
||
console.log(res,'123测试520')
|
||
if(res.code == 200){
|
||
this.educationList = res.result.records;
|
||
} else {
|
||
this.educationList = [];
|
||
}
|
||
})
|
||
},
|
||
checkValue() {
|
||
var value = "" + this.editProjectForm.contractPrice.toString();
|
||
value = value
|
||
.replace(/[^\d.]/g, "") // 清除“数字”和“.”以外的字符
|
||
.replace(/\.{2,}/g, ".") // 只保留第一个. 清除多余的
|
||
.replace(/^\./g, "") //保证第一个为数字而不是.
|
||
.replace(".", "$#$")
|
||
.replace(/\./g, "")
|
||
.replace("$#$", ".")
|
||
.replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3"); // 只能输入两个小数
|
||
if (value.indexOf(".") < 0 && value != "") {
|
||
// 以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额
|
||
value = parseFloat(value);
|
||
}
|
||
value = Number(value).toFixed(2); //不足补位
|
||
this.editProjectForm.contractPrice = value;
|
||
},
|
||
//获取列表信息
|
||
getProjectExtendInfo() {
|
||
let data = {
|
||
projectSn: this.projectSn,
|
||
};
|
||
getProjectExtendInfoApi(data).then((res) => {
|
||
if (res.code == 200) {
|
||
this.projectDetail = res.result
|
||
? JSON.parse(JSON.stringify(res.result))
|
||
: this.editProjectForm;
|
||
this.editProjectForm = res.result
|
||
? JSON.parse(JSON.stringify(res.result))
|
||
: this.editProjectForm;
|
||
}
|
||
});
|
||
},
|
||
|
||
// 编辑按钮
|
||
editBtn() {
|
||
this.editProjectDialog = true;
|
||
if (this.editProjectForm.id) {
|
||
let data = JSON.parse(JSON.stringify(this.editProjectForm));
|
||
data.contractTime = [];
|
||
data.realTime = [];
|
||
this.editProjectForm = data;
|
||
this.editProjectForm.contractTime = [
|
||
data.contractPeriodStartTime,
|
||
data.contractPeriodEndTime,
|
||
];
|
||
this.editProjectForm.realTime = [
|
||
data.realPeriodStartTime,
|
||
data.realPeriodEndTime,
|
||
];
|
||
}
|
||
},
|
||
|
||
//获取合同工期
|
||
getContractTime(value) {
|
||
if (value) {
|
||
this.editProjectForm.contractPeriodStartTime = value[0];
|
||
this.editProjectForm.contractPeriodEndTime = value[1];
|
||
} else {
|
||
this.editProjectForm.contractPeriodStartTime = "";
|
||
this.editProjectForm.contractPeriodEndTime = "";
|
||
}
|
||
},
|
||
//获取实际工期
|
||
getRealTime(value) {
|
||
if (value) {
|
||
this.editProjectForm.realPeriodStartTime = value[0];
|
||
this.editProjectForm.realPeriodEndTime = value[1];
|
||
} else {
|
||
this.editProjectForm.realPeriodStartTime = "";
|
||
this.editProjectForm.realPeriodEndTime = "";
|
||
}
|
||
},
|
||
|
||
onSubmit(formName) {
|
||
this.$refs[formName].validate((valid) => {
|
||
if (valid) {
|
||
let data = this.editProjectForm;
|
||
data.projectSn = this.projectSn;
|
||
editProjectExtendApi(data).then((res) => {
|
||
if (res.code == 200) {
|
||
this.$message.success(
|
||
this.$t("message.extendInfo.modifySuccessfully")
|
||
);
|
||
this.editProjectDialog = false;
|
||
this.getProjectExtendInfo();
|
||
}
|
||
});
|
||
} else {
|
||
console.log("error submit!!");
|
||
return false;
|
||
}
|
||
});
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
<style lang="less" scoped>
|
||
.videoBtn{
|
||
width: 320px;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
.videoInner{
|
||
width: 80px;
|
||
}
|
||
}
|
||
.flex {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.flex2 {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-around;
|
||
}
|
||
.flex3 {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.flex4 {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
.flex5 {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
.extendInfo {
|
||
width: 100%;
|
||
height: 100%;
|
||
// background: #ffffff;
|
||
padding: 15px;
|
||
box-sizing: border-box;
|
||
.btn_wrap {
|
||
text-align: right;
|
||
}
|
||
.custom_tab {
|
||
width: 100%;
|
||
height: 100%;
|
||
box-sizing: border-box;
|
||
border: 1px solid rgba(148, 148, 148, 0.5);
|
||
border-bottom: none;
|
||
margin-top: 23px;
|
||
// color: #333;
|
||
.title {
|
||
width: 100%;
|
||
font-size: 14px;
|
||
padding: 12px 20px;
|
||
border-bottom: 1px solid rgba(148, 148, 148, 0.5);
|
||
box-sizing: border-box;
|
||
height: 60px;
|
||
background: #eeeeee;
|
||
line-height: 35px;
|
||
}
|
||
|
||
.type_content {
|
||
width: 50%;
|
||
div {
|
||
font-size: 14px;
|
||
// padding: 12px 0;
|
||
height: 60px;
|
||
// line-height: 60px;
|
||
// display: inline-flex;
|
||
// align-items: center;
|
||
box-sizing: border-box;
|
||
border-bottom: 1px solid rgba(148, 148, 148, 0.5);
|
||
}
|
||
}
|
||
|
||
.width_65 {
|
||
width: 65%;
|
||
display: inline-flex;
|
||
align-items: center;
|
||
box-sizing: border-box;
|
||
height: 100%;
|
||
padding: 0 15px;
|
||
word-break: break-all;
|
||
}
|
||
.width_35 {
|
||
height: 100%;
|
||
width: 35%;
|
||
display: inline-flex;
|
||
align-items: center;
|
||
box-sizing: border-box;
|
||
border-right: 1px solid rgba(148, 148, 148, 0.5);
|
||
padding: 0 15px;
|
||
text-align: right;
|
||
background: rgba(235, 234, 234, 0.5);
|
||
}
|
||
}
|
||
.bg_color {
|
||
background: rgba(235, 234, 234, 0.5);
|
||
display: inline-flex;
|
||
align-items: center;
|
||
box-sizing: border-box;
|
||
}
|
||
.border_l {
|
||
border-left: 1px solid rgba(148, 148, 148, 0.5);
|
||
}
|
||
|
||
/deep/ .el-dialog {
|
||
margin-top: 80px !important;
|
||
}
|
||
.avatar-uploader {
|
||
border: 1px dashed #d9d9d9;
|
||
border-radius: 6px;
|
||
cursor: pointer;
|
||
position: relative;
|
||
// overflow: hidden;
|
||
height: 178px;
|
||
}
|
||
|
||
.avatar-uploader:hover {
|
||
border-color: #409eff;
|
||
}
|
||
|
||
.avatar-uploader-icon {
|
||
font-size: 28px;
|
||
color: #8c939d;
|
||
width: 178px;
|
||
height: 178px;
|
||
line-height: 178px;
|
||
text-align: center;
|
||
}
|
||
|
||
.avatar {
|
||
width: 178px;
|
||
height: 178px;
|
||
display: block;
|
||
}
|
||
|
||
.imgBox {
|
||
position: relative;
|
||
|
||
.el-icon-error {
|
||
font-size: 20px;
|
||
position: absolute;
|
||
right: -10px;
|
||
top: -10px;
|
||
cursor: pointer;
|
||
}
|
||
}
|
||
.position {
|
||
position: absolute;
|
||
right: 0;
|
||
width: calc(100% - 17.5%);
|
||
z-index: 2;
|
||
height: 60px;
|
||
top: auto;
|
||
display: inline-flex;
|
||
align-items: center;
|
||
}
|
||
}
|
||
</style>
|