yiyun-fe
/
yiyunjianzhu-vue
4
0
Fork 0
Code Pull-Requests 0 Releases 0 Aktivität
Quellcode durchsuchen

update

dev
zhengzhou vor 4 Jahren
Ursprung
02e608d981
Commit
082af9d73d
4 geänderte Dateien mit 400 neuen und 146 gelöschten Zeilen
Geteilte Ansicht
Diff-Optionen
Statistiken anzeigen Patch-Datei herunterladen Vergleichs-Datei herunterladen
  1. +1
    -0
      src/utils/request.js
  2. +127
    -0
      src/views/main_web/watchall/components/Introduce.vue
  3. +1
    -0
      src/views/main_web/watchall/components/NoteContentItem.vue
  4. +271
    -146
      src/views/main_web/watchall/watchall.vue

+ 1
- 0
src/utils/request.js Datei anzeigen

@@ -136,6 +136,7 @@ function mapApiPathToFullPath(path) {
case "operation/record":
case "file/updateProjArchiveHistory":
case "templateCompany/addTemplateCompany":
case "project/addProjectGobalConfig":
// case 'template/deleteTemplateNodeModelFile':
method = 'POST';
break;


+ 127
- 0
src/views/main_web/watchall/components/Introduce.vue Datei anzeigen

@@ -0,0 +1,127 @@
<template>
<div class="text-com">
<Title topTitle="项目概况"/>
<NoteContentItem class="text-container">
<template v-slot:main>
<el-input
ref="textarea"
type="textarea"
class="text-content"
:class="{ editing: editing }"
v-model="content"
:readonly="!editing"
resize="none"
/>
<div class="btn-group" :style="{ display: editing ? 'block':'' }">
<el-button v-if="!editing" size="mini" type="primary" @click.stop="startEdit">编辑</el-button>
<templat v-else>
<el-button size="mini" type="primary" @click.stop="confirmEdit" :loading="loading">完成</el-button>
<el-button size="mini" @click.stop="cancelEdit">取消</el-button>
</templat>
</div>
</template>
</NoteContentItem>
</div>
</template>

<script>
// 显示文字信息的组件
import Title from "./title";
import NoteContentItem from "./NoteContentItem";
import { firstCharToUpperCase } from '@/utils/tool';
import { wrapErrorHint } from '@/utils/request';
export default {
components: {
Title,
NoteContentItem
},
props: {
content: {
type: String,
default: '',
}
},
data() {
return {
editing: false,
loading: false,
originContent: '',
}
},
methods: {
startEdit() {
this.editing = true;
this.originContent = this.content;
this.$refs.textarea.focus();
},
cancelEdit() {
this.editing = false;
console.log(this.originContent);
this.content = this.originContent;
},
async confirmEdit() {
this.loading = true;
this.$emit('updateIntroduce', this.content, (res) => {
this.loading = false;
wrapErrorHint(res);
if(res.Code) { return; }
this.originContent = this.content;
this.editing = false;
});
}
}
}
</script>

<style lang="less" scoped>
.text-com {
.text-container {
position: relative;
height: calc(100% - 40px);
&:hover {
.btn-group {
display: block;
}
}
.btn-group {
display: none;
position: absolute;
top: 10px;
right: 10px;
}
}
.content-title {
font-size: 12px;
color: rgb(109,109,109);
margin: 0 0 4px 0;
}
.content-body {
font-size: 14px;
color: #32323c;
}
.text-content {
width: 100%;
height: 100%;
border-bottom: 1px solid #eaeaea;
box-sizing: border-box;
::v-deep .el-textarea__inner {
padding: 11px 18px 13px 24px;
height: 100%;
background-color: transparent;
border: none;
font-size: inherit;
color: inherit;
transition: padding .2s linear;
}
&.editing {
::v-deep .el-textarea__inner {
padding-top: 32px;
}
}
}
.text-content:last-child {
border-bottom: none;
}
}
</style>

+ 1
- 0
src/views/main_web/watchall/components/NoteContentItem.vue Datei anzeigen

@@ -24,6 +24,7 @@
color: #32323c;
border-bottom-left-radius: 14px;
border-bottom-right-radius: 14px;
box-sizing: border-box;
}

</style>

+ 271
- 146
src/views/main_web/watchall/watchall.vue Datei anzeigen

@@ -1,175 +1,300 @@
<template>
<div class="watch-all-page">
<app-header backBtnTitle="我的项目" theme="basis"
:title="joinProjName" :showUserCenter="false" :showBackBtn="true"
:onBackBtnClick="backToIndex"/>
<ChangeModelBtn ref="topModelBtn" :titleList="titleList"
v-show="!isShowLeftPage" class="top-change-model-btn"
@changeModelBtnClick="changeModelBtnClick"/>
<app-header
backBtnTitle="我的项目"
theme="basis"
:title="joinProjName"
:showUserCenter="false"
:showBackBtn="true"
:onBackBtnClick="backToIndex"
/>
<ChangeModelBtn
ref="topModelBtn"
:titleList="titleList"
v-show="!isShowLeftPage"
class="top-change-model-btn"
@changeModelBtnClick="changeModelBtnClick"
/>
<div class="main-content">
<div class="control-btn" @click.stop="changeShowLeftPageClick" :style="{left: btnLeft }"><img src="static/img/收起与弹出.svg" alt :style="iconRotateStyle"/></div>
<div class="left-page" v-show="isShowLeftPage">
<ChangeModelBtn ref="leftModelBtn" :titleList="titleList"
@changeModelBtnClick="changeModelBtnClick"
class="left-change-model-btn"/>
<div v-for="(textNote, ti) in textData" :key="ti + '1'">
<div
class="control-btn"
@click.stop="changeShowLeftPageClick"
:style="{left: btnLeft }"
><img
src="static/img/收起与弹出.svg"
alt
:style="iconRotateStyle"
/></div>
<div
class="left-page"
v-show="isShowLeftPage"
>
<ChangeModelBtn
ref="leftModelBtn"
:titleList="titleList"
@changeModelBtnClick="changeModelBtnClick"
class="left-change-model-btn"
/>
<!-- <div v-for="(textNote, ti) in textData" :key="ti + '1'">
<TextItem :textItem="textNote"/>
</div>
<div v-for="(progressNote, pi) in progressData" :key="pi + '2'">
</div> -->
<Introduce
:content="config.projectIntroduce"
:style="{ height: `${896 - 58}px` }"
@updateIntroduce="updateIntroduce"
/>
<!-- <div v-for="(progressNote, pi) in progressData" :key="pi + '2'">
<ProgressItem :progressItem="progressNote"/>
</div>
<div v-for="(graphNote, gi) in graphData" :key="gi + '3'">
</div> -->
<!-- <div v-for="(graphNote, gi) in graphData" :key="gi + '3'">
<GraphItem :graphItem="graphNote"/>
</div>
</div> -->
</div>
<div class="right-show-area">
<iframe :src="rightPartUrl" frameborder="0"></iframe>
</div>
<el-carousel ref="watchCarousel" class="watch-carousel" height="100%" :autoplay="false" indicator-position="none" arrow="never">
<el-carousel-item key="forge">
<iframe v-if="config.forgeUrl" :key="config.forgeUrl" :src="config.forgeUrl" frameborder="0" />
</el-carousel-item>
<el-carousel-item key="supermap">
<iframe v-if="config.gsUrl" :key="config.gsUrl" :src="config.gsUrl" frameborder="0" />
</el-carousel-item>
</el-carousel>
<!-- <iframe :src="rightPartUrl" frameborder="0"></iframe> -->
<el-popover
placement="top-start"
:width="400"
:offset="500"
ref="urlModal"
trigger="click">
<el-form :model="urlForm">
<el-form-item label="forgeURL">
<el-input v-model="urlForm.forgeUrl" placeholder="http://" />
</el-form-item>
<el-form-item label="超图URL">
<el-input v-model="urlForm.gsUrl" placeholder="http://" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click.stop="onChangeUrl">修改</el-button>
<el-button @click.stop="resetUrl">取消</el-button>
</el-form-item>
</el-form>
<el-button slot="reference" class="popover-btn" type="primary" size="mini">设置URL</el-button>
</el-popover>
</div>
</div>
</div>
</template>

<script>
import AppHeader from "@/components/app-header";
import ChangeModelBtn from './components/ChangeModelBtn';
import TextItem from "./components/TextItem";
import ProgressItem from "./components/ProgressItem";
import GraphItem from "./components/GraphItem";
import { getDetailTextData, getProgressData, getGraphData, getGraphData2 } from "./service";
export default {
components: {
AppHeader,
ChangeModelBtn,
TextItem,
ProgressItem,
GraphItem
},
data() {
import AppHeader from "@/components/app-header";
import ChangeModelBtn from "./components/ChangeModelBtn";
import TextItem from "./components/TextItem";
import { pick } from 'lodash';
// import ProgressItem from "./components/ProgressItem";
// import GraphItem from "./components/GraphItem";
import {
getDetailTextData,
getProgressData,
getGraphData,
getGraphData2,
} from "./service";
import Introduce from "./components/Introduce.vue";
import { firstCharToLowerCase, firstCharToUpperCase } from '@/utils/tool';
import { wrapErrorHint } from '@/utils/request';

export default {
components: {
AppHeader,
ChangeModelBtn,
// TextItem,
Introduce,
// ProgressItem,
// GraphItem
},
data() {
return {
projectId: sessionStorage.projId,
titleList: ["forge模型", "超图"],
joinProjName: `观全局-${sessionStorage.projName}`,
textData: [],
progressData: [],
graphData: [],
isShowLeftPage: true, //是否显示左边部分的信息
btnLeft: 24, //控制按钮的位置
iconRotateDeg: 90,
// rightPartUrl: "",
// superMapUrl: "http://www.lockingos.org:9001/?scene=http://cim.azut.cn:8090/iserver/services/3D-FuHuaYuan/rest/realspace",
// forgeModelUrl: "http://www.lockingos.org:9000/fhy-model/fhy/index.html",
// temp: ["341999987607363584", "341984912360235008", "342002217261621248"],
// 概览配置
config: {},
urlForm: {
gsUrl: '',
forgeUrl: '',
}
};
},
mounted() {
this.getWatchAllGeneralData();
this.rightPartUrl = this.temp.includes(sessionStorage.projId)
? "http://www.lockingos.org:9000/fhy-model/forgemd2020120603/index.html"
: "http://www.lockingos.org:9000/fhy-model/fhy/index.html";
this.forgeModelUrl = this.temp.includes(sessionStorage.projId)
? "http://www.lockingos.org:9000/fhy-model/forgemd2020120603/index.html"
: "http://www.lockingos.org:9000/fhy-model/fhy/index.html";
},
computed: {
iconRotateStyle() {
return {
titleList: ['forge模型', '超图'],
joinProjName:`观全局-${sessionStorage.projName}`,
textData: [],
progressData: [],
graphData: [],
isShowLeftPage: true,//是否显示左边部分的信息
btnLeft: 24,//控制按钮的位置
iconRotateDeg: 90,
rightPartUrl: '',
superMapUrl: 'http://www.lockingos.org:9001/?scene=http://cim.azut.cn:8090/iserver/services/3D-FuHuaYuan/rest/realspace',
forgeModelUrl: 'http://www.lockingos.org:9000/fhy-model/fhy/index.html',
temp:['341999987607363584','341984912360235008','342002217261621248'],
transform: `rotate(${this.iconRotateDeg}deg)`,
};
},
},
methods: {
async getWatchAllGeneralData() {
const [configRes, res1, res2, res3, res4] = await Promise.all([
this.$fetchApi('project/queryProjectGobalConfig', { id: this.projectId }),
getDetailTextData(),
getProgressData(),
getGraphData(),
getGraphData2(),
]);

this.config = firstCharToLowerCase(configRes.Data || { id: this.projectId });
this.urlForm = pick(this.config, ['gsUrl', 'forgeUrl']);
this.textData = [{ ...res1 }];
this.progressData = [{ ...res2 }];
this.graphData = [{ ...res3 }];
this.graphData.push(res4);
this.graphData = [...this.graphData];
},
async updateIntroduce(introStr, callback) {
const res = await this.updateConfig({ projectIntroduce: introStr });
callback(res);
},
async updateConfig(partialConfig) {
const nextCfg = {...this.config, ...partialConfig };
const res = await this.$fetchApi('project/addProjectGobalConfig', firstCharToUpperCase(nextCfg));
if(!res.Code) {
this.config = nextCfg;
}
return res;
},
async onChangeUrl() {
const res = await this.updateConfig(this.urlForm);
wrapErrorHint(res);
if(res.Code) { return; }
this.$refs.urlModal.doClose();
},
mounted() {
this.getWatchAllGeneralData();
this.rightPartUrl = this.temp.includes(sessionStorage.projId) ? 'http://www.lockingos.org:9000/fhy-model/forgemd2020120603/index.html' : 'http://www.lockingos.org:9000/fhy-model/fhy/index.html';
this.forgeModelUrl = this.temp.includes(sessionStorage.projId) ? 'http://www.lockingos.org:9000/fhy-model/forgemd2020120603/index.html' : 'http://www.lockingos.org:9000/fhy-model/fhy/index.html';
resetUrl() {
// console.log(this.$refs.urlModal);
this.$refs.urlModal.doClose();
this.urlForm = pick(this.config, ['gsUrl', 'forgeUrl']);
},
computed: {
iconRotateStyle() {
return {
'transform': `rotate(${this.iconRotateDeg}deg)`
}
// 切换左边部分显示
changeShowLeftPageClick() {
this.isShowLeftPage = !this.isShowLeftPage;
this.btnLeft = this.isShowLeftPage ? "24px" : "0";
if (this.btnLeft == "24px") {
this.iconRotateDeg = 90;
} else {
this.iconRotateDeg = -90;
}
},
methods: {
getWatchAllGeneralData() {
let res = Promise.all([
getDetailTextData(),
getProgressData(),
getGraphData(),
getGraphData2()
]).then(([res1, res2, res3, res4]) => {
this.textData = [{...res1}];
this.progressData = [{...res2}];
this.graphData = [{...res3}];
this.graphData.push(res4);
this.graphData = [...this.graphData];
// 保持两个切换模型的组件是一致的
changeModelBtnClick(i) {
// this.viewType = i == 0 ? 'forge' : 'supermap';
this.$refs.topModelBtn.currentIndex = i;
this.$refs.leftModelBtn.currentIndex = i;
this.$refs.watchCarousel.setActiveItem(i);
// if (i == 0) {
// this.rightPartUrl = this.forgeModelUrl;
// } else if (i == 1) {
// this.rightPartUrl = this.superMapUrl;
// }
},
// 按到后退按钮返回主界面
backToIndex() {
this.$router
.push({
path: "index",
})
},
// 切换左边部分显示
changeShowLeftPageClick() {
this.isShowLeftPage = !this.isShowLeftPage;
this.btnLeft = this.isShowLeftPage ? '24px' : '0';
if(this.btnLeft == '24px') {
this.iconRotateDeg = 90;
} else {
this.iconRotateDeg = -90;
}
},
// 保持两个切换模型的组件是一致的
changeModelBtnClick(i) {
this.$refs.topModelBtn.currentIndex = i;
this.$refs.leftModelBtn.currentIndex = i;
if(i == 0) {
this.rightPartUrl = this.forgeModelUrl;
} else if(i == 1) {
this.rightPartUrl = this.superMapUrl;
}
},
// 按到后退按钮返回主界面
backToIndex() {
this.$router.push({
path: 'index'
}).catch(err => {
.catch((err) => {
console.log(err);
})
}
}
}
});
},
},
};
</script>

<style scoped>
.watch-all-page {
background-color: #f6f6f6;
}
.watch-all-page .main-content {
position: relative;
display: flex;
margin: 18px 0 0 0;
padding: 0 64px;
}
.top-change-model-btn {
margin: 0 auto 20px;
width: 22.4%;
}
.left-change-model-btn {
margin: 0 0 26px 0;
}
.control-btn {
position: fixed;
top: 352px;
width: 32px;
left: 24px;
height: 56px;
border-radius: 8px;
margin-right: 8px;
background-color: rgba(252, 252, 252, 1);
box-shadow: 0px 4px 10px 1px rgba(0, 0, 0, 0.1), 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
cursor: pointer;
}
.control-btn img {
/* 位置和大小要根据图标再修正 */
display: block;
width: 22px;
margin: 18px auto;
}
.left-page {
width: 22.4%;
margin: 0 32px 0 0;
}
.right-show-area {
flex: 1;
border-radius: 16px;
margin: 0 0 64px 0;
background-color: #ededed;
height: 896px;
min-width: 1%;
overflow: hidden;
<style lang="less" scoped>
.watch-all-page {
background-color: #f6f6f6;
}
.watch-all-page .main-content {
position: relative;
display: flex;
margin: 18px 0 0 0;
padding: 0 64px;
}
.top-change-model-btn {
margin: 0 auto 20px;
width: 22.4%;
}
.left-change-model-btn {
margin: 0 0 26px 0;
}
.control-btn {
position: fixed;
top: 352px;
width: 32px;
left: 24px;
height: 56px;
border-radius: 8px;
margin-right: 8px;
background-color: rgba(252, 252, 252, 1);
box-shadow: 0px 4px 10px 1px rgba(0, 0, 0, 0.1),
0px 1px 3px 0px rgba(0, 0, 0, 0.1);
cursor: pointer;
}
.control-btn img {
/* 位置和大小要根据图标再修正 */
display: block;
width: 22px;
margin: 18px auto;
}
.left-page {
width: 22.4%;
margin: 0 32px 0 0;
}
.right-show-area {
position: relative;
flex: 1;
border-radius: 16px;
margin: 0 0 64px 0;
background-color: #ededed;
height: 896px;
min-width: 1%;
/* overflow: hidden; */
.watch-carousel {
height: 100%;
}
.right-show-area iframe {
iframe {
width: 100%;
height: 100%;
border-radius: 16px;
}
&:hover {
.popover-btn {
display: block;
}
}
.popover-btn {
display: none;
position: absolute;
bottom: -24px;
right: 10px;
}
}
</style>

Verfassen Vorschau
Laden…
Abbrechen
Speichern