Skip to content

X
xcLab
提交 052a3fc2 authored 作者: Lxq's avatar Lxq
浏览文件
操作

合并分支 'lxq' 到 'master'

改版样式 查看合并请求 !16
上级 ba353165 0319e1dd
隐藏空白字符变更
内嵌 并排
正在显示 包含 1379 行增加 和 28 行删除
config.js
浏览文件 @ 052a3fc2
......@@ -4,8 +4,8 @@
// 服务地址
// const IP = 'https://www.easy-mock.com/mock/5b70ec93ad23a1570071a34e/Interview'; // easymock
const IP = 'http://192.168.1.246:8077';
const WS = '192.168.1.54:8077';
const IP = 'http://120.55.57.35:8077';
const WS = '120.55.57.35:8077';
// const IP = 'http://120.55.57.35:8077';
// const WS = '120.55.57.35:8077';
......
src/components/dial/reapply.vue 0 → 100644
浏览文件 @ 052a3fc2
<!-- 重新审请页面 -->
<template>
<div class="newApply">
<p> <span>技术路线</span></p>
<div class="newApply-box" >
<div class="whole" v-for="(item,index) in val ">
<div class="newApply-title">
<!--<el-radio v-model="tech" :label="1">{{item.name}}</el-radio>-->
<span @click="check(index)"> <i :class="(index == isCheck - 1) ? 'isActive': ''"></i> </span>
<div>{{item.name}}</div>
</div>
<div class="newApply-content">
<div>
<span>操作系统：<i>{{item.os.version}}</i></span>
<span>数据库：<i>{{item.db.version}}</i></span>
<span>中间件：<i>{{item.midWare.version}}</i></span>
</div>
</div>
</div>
</div>
<div class="line"></div>
<div class="newApplyBtn">
<span class="Btn-cancle" @click="cancle">取消</span>
<span class="Btn-makeSure" @click="makeSure">确定</span>
</div>
</div>
</template>
<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
// 例如：import 《组件名称》 from '《组件路径》';
export default {
name: 'reapply',
// import引入的组件需要注入到对象中才能使用
components: {},
props: ['val','applyId','osId'],
data () {
// 这里存放数据
return {
tech: '',
isCheck: '',
itemId: ''
};
},
// 方法集合
methods: {
cancle() {
this.$emit('on-close');
},
check(i) {
console.log('选中',i)
console.log(this.isCheck)
this.isCheck = i + 1
console.log(this.isCheck)
},
makeSure() {
let a = this.applyId;
let b = this.isCheck;
let obj = {
id: a,
techId: b
}
this.$server.postMidify(obj).then(res => {
console.log('postMidify',res);
this.$emit('on-close');
this.$emit('on-closeWeb');
this.$emit('on-project');
// this.$emit('on-websocket');
}).catch(err => {
console.log(err)
this.$message.error('请求失败')
})
}
},
// 监听属性 类似于data概念
computed: {},
// 监控data中的数据变化
watch: {
'val': function(val) {
console.log('技术路线数据',val)
},
'applyId': function(applyId) {
console.log('项目id',applyId)
},
'osId': function(osId) {
console.log('osIdid',osId)
this.isCheck = this.osId
},
},
//生命周期 - 创建完成（可以访问当前this实例）
created () {
},
// 生命周期 - 挂载完成（可以访问DOM元素）
mounted () {
console.log(this.osId)
this.isCheck = this.osId
console.log('122222',this.isCheck)
},
// 生命周期 - 创建之前
beforeCreate () {},
// 生命周期 - 挂载之前
beforeMount () {},
// 生命周期 - 更新之前
beforeUpdate () {},
// 生命周期 - 更新之后
updated () {
// this.check(this.osId);
},
// 生命周期 - 销毁之前
beforeDestroy () {},
// 生命周期 - 销毁完成
destroyed () {},
// 如果页面有keep-alive缓存功能，这个函数会触发
activated () {},
}
</script>
<style scoped>
.newApply {
width: 810px;
height: 518px;
background: #fff;
border-radius: 11px;
position: absolute;
top: 17px;
left: -425px;
}
.newApply p {
width: 100%;
height: 58px;
font-size: 18px;
line-height: 58px;
background: #ebf0f8;
text-align: left;
font-weight: bold;
color: #151033;
}
.newApply p span {
display: inline-block;
padding-left: 35px;
}
.newApply-box{
display: flex;
justify-content: space-around;
align-items: center;
}
.newApply-title {
text-align: center;
margin: 25px 0;
}
.newApply-title span i{
display: inline-block;
width: 12px;
height: 12px;
border-radius: 50%;
border: 1px solid #666;
margin-left: 58px;
margin-top: 3px;
float: left;
}
.newApply-content {
display: flex;
justify-content: center;
align-items: center;
padding: 20px 0;
}
.newApply-content div {
text-align: right;
}
.newApply-content div span {
display: block;
height: 45px;
line-height: 45px;
color: #666;
margin-bottom: 20px;
width: 200px;
}
.newApply-content div span i {
display: inline-block;
width: 64%;
background: #f5f8fd;
height: 35px;
border: 1px solid rgba(8,104,157,.3);
text-align: center;
color: #333;
}
.newApplyBtn {
text-align: center;
}
.newApplyBtn span {
display: inline-block;
width: 100px;
height: 34px;
line-height: 34px;
color: #fff;
text-align: center;
margin-left: 60px;
}
/*.newApplyBtn span:hover {*/
/*!*background: #1c45a4;*!*/
/*}*/
.Btn-cancle {
background: #acb6d1;
}
.Btn-makeSure {
background: #151033;
}
.Btn-cancle:hover {
background: #ccd1dd;
}
.Btn-makeSure:hover {
background: #3b3b56;
}
.line {
width: 71%;
margin: 0 auto;
border: 1px solid rgba(8,104,157,.1);
margin-bottom: 50px;
}
.isActive {
/*background: #1E8255;*/
/*border: 1px solid red;*/
width: 14px;
height: 14px;
background: url("../../assets/img/check.png") no-repeat;
background-size: 100% 100%;
background-color: transparent;
border: none;
}
</style>
\ No newline at end of file
src/router/index.js
浏览文件 @ 052a3fc2
......@@ -31,39 +31,63 @@ const routes = [
path: '/',
name: 'Home',
component: Home,
redirect: '/verifyEnvironment',
redirect: '/labSystem1',
children: [
// {
// path: '/labSystem',
// name: 'labSystem',
// // route level code-splitting
// // this generates a separate chunk (about.[hash].js) for this route
// // which is lazy-loaded when the route is visited.
// component: () => import(/* webpackChunkName: "about" */ '../views/labSystem.vue')
// },
// {
// path: '/verifyEnvironment',
// name: 'verifyEnvironment',
// // route level code-splitting
// // this generates a separate chunk (about.[hash].js) for this route
// // which is lazy-loaded when the route is visited.
// component: () => import(/* webpackChunkName: "about" */ '../views/verifyEnvironment.vue')
// },
// {
// path: '/qualityResult',
// name: 'qualityResult',
// // route level code-splitting
// // this generates a separate chunk (about.[hash].js) for this route
// // which is lazy-loaded when the route is visited.
// component: () => import(/* webpackChunkName: "about" */ '../views/qualityResult.vue')
// },
{
path: '/labSystem',
name: 'labSystem',
path: '/testAnalysis',
name: 'testAnalysis',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '../views/testAnalysis.vue')
},
{
path: '/labSystem1',
name: 'labSystem1',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '../views/labSystem.vue')
component: () => import(/* webpackChunkName: "about" */ '../views/labSystem1.vue')
},
{
path: '/verifyEnvironment',
name: 'verifyEnvironment',
path: '/verifyEnvironment1',
name: 'verifyEnvironment1',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '../views/verifyEnvironment.vue')
component: () => import(/* webpackChunkName: "about" */ '../views/verifyEnvironment1.vue')
},
{
path: '/qualityResult',
name: 'qualityResult',
path: '/qualityResult1',
name: 'qualityResult1',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '../views/qualityResult.vue')
},
{
path: '/testAnalysis',
name: 'testAnalysis',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '../views/testAnalysis.vue')
component: () => import(/* webpackChunkName: "about" */ '../views/qualityResult1.vue')
},
]
},
......
src/views/labSystem1.vue 0 → 100644
浏览文件 @ 052a3fc2
<!-- XC lab系统页面 -->
<template>
<div class="labSystem">
<div class="labContent">
<div class="labContent-title">
<img src="../assets/image/logo.png" alt="">
<p >XC lab系统</p>
</div>
<div class="theme">
<div class="themeContent">
<div class="themeName"> <i></i> {{name}} </div>
<div class="themeOne">
<div class="themeOneLeft">
<div>
<img src="../assets/image/adress.png" alt="">
<p>地址详情</p>
</div>
</div>
<div class="themeOneRight">
<p class="themeOne-title"> <!--<span class="edit"><img src="../assets/image/edit.png" alt="">编辑</span>--> </p>
<div class="themeOneRight-div">项目路径： <span class="themeOne-pint themeOneRight-span" @click="openAnother(path)"> <i>{{path}}</i> </span></div>
<div class="themeOneRight-div">gitlab地址： <span class="themeOneRight-span">{{gitPath}}</span> </div>
</div>
</div>
<div class="themeOne">
<div class="themeOneLeft">
<div>
<img src="../assets/image/configure.png" alt="">
<p>配置详情</p>
</div>
</div>
<div class="themeOneRight">
<p class="themeOne-title"> <span class="edit"><img src="../assets/image/save.png" alt="">保存</span> </p>
<div style="padding-left: 25px">
<el-row>
<el-col :span="8">
<div>
<span class="">打包方式：</span>
<el-select v-model="pack" placeholder="请选择">
<el-option label="maven" :value="0"></el-option>
<el-option label="cnpm" :value="1"></el-option>
</el-select>
</div>
</el-col>
<el-col :span="8">
<div>
<span class="">代码类型：</span>
<el-select v-model="codeType" placeholder="请选择">
<el-option label="js/html/css" :value="0"></el-option>
<el-option label="java" :value="1"></el-option>
</el-select>
</div>
</el-col>
<el-col :span="8">
<div>
<span class="">日志保存时间：</span>
<el-input style="width:117px;" v-model="rate" placeholder="请输入"></el-input>
天
</div>
</el-col>
</el-row>
<el-row style="margin-top:32px;">
<el-col :span="8">
<div>
<span class="">编译版本：</span>
<el-select v-model="compile" placeholder="请选择">
<el-option label="jdk1.8" :value="0"></el-option>
<el-option label="nodejs10.16" :value="1"></el-option>
</el-select>
</div>
</el-col>
</el-row>
</div>
</div>
</div>
<div class="themeOne">
<div class="themeOneLeft themeElseH">
<div>
<img src="../assets/image/proenv.png" alt="">
<p>项目环境</p>
</div>
</div>
<div class="themeOneRight themeElseH">
<p class="themeOne-title">
<span class="edit" @click="apply"><img src="../assets/image/apply.png" alt="">重新申请</span>
</p>
<!--<p class="themeOne-second"><span class="deploy" @click="deploy">部署</span></p>-->
<div class="themeThree">
<span class="deploy" @click="deploy">部署</span>
<p style="line-height: 50px">
访问路径：
<span>
<a v-if="editLink === false" @click="openLink(pathSuffix)" class="aLinkClick">{{pathSuffix}}</a>
<el-input
v-if="editLink === true"
type="textarea"
rows="1"
resize="none"
placeholder="请输入demo链接"
v-model="pathSuffix">
</el-input>
</span>
<i class="edit editPlus" v-if="editLink === false" @click="editLinkClick"><img src="../assets/image/edit.png" alt=""> 编辑</i>
<i class="edit editPlus" v-if="editLink === true" @click="saveLinkClick"><img src="../assets/image/save.png" alt=""> 保存</i>
</p>
<div>
<i></i>
服务器：
<span>型号/版本: <a>{{os.version}}</a> </span>
<span>ip: <a>{{os.ip}}</a></span>
</div>
<div>
<i></i>
中间件：
<span>型号/版本: <a>{{mid.version}}</a> </span>
<span>ip: <a>{{mid.ip}}</a></span>
<span>端口号：<a>{{mid.port}}</a> </span>
</div>
<div>
<i></i>
数据库：
<span>型号/版本: <a>{{db.version}}</a> </span>
<span>ip: <a>{{db.ip}}</a></span>
<span>端口号：<a>{{db.port}}</a> </span>
<span>用户名：<a>{{db.userName}}</a></span>
<span>密码：<a>{{db.password}}</a></span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="themeLog">
<div class="themeLog-box">
<div class="themeFour">
<div class="themeOneLeft themeLogH">
<div>
<img src="../assets/image/log.png" alt="">
<p>运行日志</p>
</div>
</div>
<div class="themeOneRight themeLogH">
<p class="themeOne-title"> <span class="edit"><img src="../assets/image/refresh.png" alt="">刷新</span> </p>
<div class="themeFour-Context">
<div class="logData">
<!--<el-scrollbar ref="myScrollbar" class="myScrollbar" style="height: 38vh">-->
<textarea ref="myScrollbar" class="logTextarea">
{{logData}}
</textarea>
<!--</el-scrollbar>-->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--重新申请弹窗-->
<el-dialog :visible.sync="applyModal" width="0%" >
<reapply :val="applyMessage" :applyId="applyId" :osId="osId" @on-closeWeb="websocketCosle" @on-websocket="newWebsocket()" @on-project="newProject()" @on-close="reset()"></reapply>
<img src="../assets/img/close.png" class="closeModel" @click="reset()">
</el-dialog>
<!--重新申请弹窗-->
</div>
</template>
<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
// 例如：import 《组件名称》 from '《组件路径》';
import reapply from '../components/dial/reapply';
import baseUrl from '../../config';
export default {
name: 'lab-system1',
// import引入的组件需要注入到对象中才能使用
components: { reapply },
props: {},
data () {
// 这里存放数据
return {
id: 1, //
name:'XC lab', // 项目名字
path:'12121212', // 项目路径
gitPath: '1212121', // git路径
pack: '', // 打包方式
codeType: '', // 代码类型
rate: '', // 编译频率
compile: '', // 编译版本
os: '', // 服务器
mid: '', // 中间件
db: '', // 数据库
applyModal: false, // 重新申请弹窗
applyMessage: '', // 弹窗数据
applyId:'', // 传给弹窗的项目id
editLink: false, // 编辑链接
pathSuffix: '', // 链接
jenkinsName: '', // webstock
logData:'', // 日志
techId: '', // techID技术路线
osId: '', // 传给子组件 用于选中对比的id
};
},
// 方法集合
methods: {
getProject() {
console.log(3333)
this.$server.getProject(this.id).then(res => {
console.log(res.data);
this.path = res.data.path
this.gitPath = res.data.gitPath
this.name = res.data.name
this.pack = res.data.pack
this.codeType = res.data.codeType
this.rate = res.data.rate
this.compile = res.data.compile
this.os = res.data.os;
// console.log('服务器',this.os)
this.mid = res.data.mid;
// console.log('中间件',this.mid)
this.db = res.data.db;
// console.log('数据库',this.db)
this.pathSuffix = res.data.pathSuffix
this.jenkinsName = res.data.jenkinsName
this.copyWebsocket(res.data.jenkinsName)
this.techId = res.data.techId;
}).catch(err => {
// console.log(err);
this.$message.error('数据请求失败');
})
},
// 重新申请
apply() {
// console.log(1)
this.applyModal = true
this.$server.findAll().then(res => {
console.log(res.data);
this.applyMessage = res.data
this.applyId = this.id
this.osId = this.techId
// console.log('909090',this.osId)
// console.log('77777',this.applyId)
}).catch(err => {
// console.log(err)
this.$message.error('请求失败')
})
},
reset(){
this.applyModal = false;
},
openLink(val) {
console.log(val)
},
// 编辑
editLinkClick() {
this.editLink = !this.editLink;
},
// 保存
saveLinkClick() {
console.log(this.pathSuffix)
let obj = {
"pathSuffix": this.pathSuffix,
"id": this.id,
}
console.log(obj)
this.$server.setPath(obj).then(res => {
console.log(res.data);
console.log('77777')
this.editLink = false
this.getProject();
}).catch(err => {
console.log(err)
this.$message.error('请求失败')
})
},
// 打开项目路径链接新页面
openAnother(val) {
// console.log(val)
window.open(val, '_blank').location;
},
// 部署
deploy() {
this.$server.getDeploy(this.id).then(res => {
console.log(res.data);
console.log('77777');
}).catch(err => {
console.log(err)
this.$message.error('请求失败')
})
},
// websocket
copyWebsocket(val) {
// console.log(this.val,this.close)
var that = this;
// Create WebSocket connection.
// console.log('this.jenkinsName2121',this.jenkinsName)
// const socket = new WebSocket('ws://' + baseUrl.WS_CONT + '/webServer/${this.jenkinsName}');
const socket = new WebSocket(`ws://${baseUrl.WS_CONT}/webServer/${val}`);
this.WS = socket;
// Connection opened
socket.addEventListener('open', function (event) {
socket.send('Hello Server!');
});
// Listen for messages
socket.addEventListener('message', function (event) {
// console.log('Message from server ', event.data);
that.logData += event.data
// console.log('this.logData777', that.logData)
});
},
scrollDown() { // 滚动条置低
// this.$refs['myScrollbar'].wrap.scrollTop = this.$refs['myScrollbar'].wrap.scrollHeight
let t = document.getElementsByTagName("textarea")[0];
t.scrollTop = t.scrollHeight;
},
newProject(){
console.log(1)
this.getProject();
},
websocketCosle(e){
this.WS.close()
}
},
// 监听属性 类似于data概念
computed: {},
// 监控data中的数据变化
watch: {},
//生命周期 - 创建完成（可以访问当前this实例）
created () {},
// 生命周期 - 挂载完成（可以访问DOM元素）
mounted () {
this.getProject();
},
// 生命周期 - 创建之前
beforeCreate () {},
// 生命周期 - 挂载之前
beforeMount () {},
// 生命周期 - 更新之前
beforeUpdate () {},
// 生命周期 - 更新之后
updated () {
this.scrollDown()
},
// 生命周期 - 销毁之前
beforeDestroy () {},
// 生命周期 - 销毁完成
destroyed () {},
// 如果页面有keep-alive缓存功能，这个函数会触发
activated () {},
}
</script>
<style scoped>
.labSystem {
height: 96vh;
overflow-y: scroll;
}
.labContent {
}
.labContent-title {
height: 138px;
line-height: 138px;
text-align: center;
font-size: 60px;
font-weight: bold;
color: #151033;
}
.labContent-title p {
display: inline-block;
}
.labContent-title img {
margin-right: 20px;
margin-bottom: 17px;
}
/*头部以下内容样式*/
.theme {
padding: 22px 50px 0 50px;
background: #f5f7ff;
}
.themeContent {
height: 104vh;
background: #fff;
padding: 20px 30px;
}
.themeName {
text-align: left;
position: relative;
background-color: #f5f7ff;
height: 38px;
width: 100%;
line-height: 38px;
font-weight: bold;
font-size: 20px
}
.themeName i {
display: block;
float: left;
background-color: #151033;
height: 38px;
width: 14px;
margin-right: 10px;
}
.themeOne {
display: flex;
justify-content: left;
align-items: center;
margin-top: 28px;
}
.themeOneLeft {
width: 182px;
height: 204px;
position: relative;
box-shadow:0 0 9px 3px #f5f8fd;
}
.themeOneLeft div {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.themeOneLeft div p {
font-size: 18px;
font-weight: bold;
color: #151033;
margin-top: 18px;
}
.themeElseH {
height: 256px!important;
}
.themeOneRight {
width: 100%;
height: 204px;
background: #f5f7ff;
}
.themeOne-title {
height: 34px;
width: 97%;
margin-bottom: 18px;
margin-top: 18px;
}
.themeOne-title span {
float: right;
font-size: 16px;
color: #fff;
}
/*.themeOne-second {*/
/*height: 34px;*/
/*width: 97%;*/
/*}*/
/*.themeOne-second span {*/
/*float: right;*/
/*font-size: 16px;*/
/*color: #fff;*/
/*}*/
.themeOne-pint {
margin-left: 6px;
cursor: pointer;
color: blue !important;
}
.themeOne-pint i {
display: inline-block;
height: 30px;
border-bottom: 1px solid blue;
}
.edit {
width: 114px;
height: 34px;
text-align: center;
line-height: 34px;
background: #151033;
}
.edit:hover {
background: #3b3b56;
}
.edit img {
margin-right: 8px;
}
.themeOneRight-div {
width: 97%;
margin-bottom: 20px;
padding-left: 25px;
color: #5d5d7c;
}
.themeOneRight-span {
display: inline-block;
border: 1px solid #a8d5f4;
width: 84%;
height: 40px;
line-height: 40px;
padding-left: 12px;
}
.themeThree {
padding-left: 25px;
position: relative;
}
.themeThree p {
height: 50px;
}
.themeThree p span {
display: inline-block;
width: 33%;
margin-bottom: -14px
}
.themeThree div {
margin-bottom: 10px;
}
.themeThree div i {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
background: rgb(72,119,230);
}
.themeThree div span {
display: inline-block;
width: 15%;
padding-left: 30px;
}
.themeThree div span a {
color: #333;
}
.closeModel {
position: absolute;
right: -360px;
top: 36px;
cursor: pointer;
}
.closeModel:hover {
content: url("../assets/img/closeh.png");
}
.editPlus {
display: inline-block;
width: 98px;
color: #fff;
height: 30px;
line-height: 30px;
margin-left: 5px;
font-size: 16px;
}
.editPlus img {
margin-right: 8px;
}
.aLinkClick {
padding-left: 23px;
}
.deploy {
display: inline-block;
position: absolute;
right: 38px;
top: 0px;
color: #fff;
width: 114px;
height: 34px;
text-align: center;
line-height: 34px;
background: #151033;
font-size: 16px;
}
.deploy:hover {
background: #3b3b56;
}
.logData{
width: 100%;
margin: 0 10px;
height: 57vh;
overflow-y: auto;
}
.themeFour {
background: #fff;
padding: 20px 30px;
display: flex;
justify-content: left;
align-items: center;
}
.themeFour-Context {
padding: 8px 2px 0 10px;
height: 40vh;
}
.myScrollbar >>> .el-scrollbar__wrap { overflow: scroll; width: 101%; height: 120%; }
.logTextarea {
width: 96%;
height: 56vh;
overflow-x: hidden;
border: none;
resize:none;
background: #f5f7ff;
}
.logTextarea:focus {
outline: none;
}
.logData >>> textarea {
Scrollbar-Arrow-Color: red;
}
/**/
.themeLog {
}
.themeLog-box {
padding: 22px 50px;
background: #f5f7ff;
}
.themeLogH {
height: 540px;
}
</style>
\ No newline at end of file
src/views/qualityResult1.vue 0 → 100644
浏览文件 @ 052a3fc2
<!-- <!-- 量化体验结果页面 --> -->
<template>
<div class="qualityResult">
<div class="labContent">
<div class="labContent-title">
<img src="../assets/image/logoEn.png" alt="">
<p >XC环境验证系统</p>
</div>
<div class="labContent-back">
<span class="backImg" @click="backPath"></span>
</div>
<div class="theme">
<div class="themeContent">
<div class="themeName"> <i></i> 量化体验结果 </div>
<div class="qualityResult-table">
<el-table
:data="tableData"
style="width: 100%">
<el-table-column
prop="name"
align="center"
label="体验项"
width="180">
</el-table-column>
<el-table-column
prop="last"
align="center"
label="上次操作(技术路线)"
width="180">
</el-table-column>
<el-table-column
prop="avg.1"
align="center"
label="龙芯">
</el-table-column>
<el-table-column
prop="avg.2"
align="center"
label="鲲鹏">
</el-table-column>
<el-table-column
prop="avg.3"
align="center"
label="X86">
</el-table-column>
</el-table>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
// 例如：import 《组件名称》 from '《组件路径》';
export default {
name: 'quality-result1',
// import引入的组件需要注入到对象中才能使用
components: {
},
props: {},
data () {
// 这里存放数据
return {
tableData: [
// {name:'xxx',last:'xxx',avg:{1:12,2:12,3:32}},
// {name:'xxx',last:'xxx',avg:{1:12,2:12,3:32}},
// {name:'xxx',last:'xxx',avg:{1:12,2:12,3:32}},
// {name:'xxx',last:'xxx',avg:{1:12,2:12,3:32}},
// {name:'xxx',last:'xxx',avg:{1:12,2:12,3:32}},
// {name:'xxx',last:'xxx',avg:{1:12,2:12,3:32}}
],
lastest: '',
// avg: ''
};
},
// 方法集合
methods: {
backPath() {
this.$router.push('/verifyEnvironment1')
}
},
// 监听属性 类似于data概念
computed: {},
// 监控data中的数据变化
watch: {},
//生命周期 - 创建完成（可以访问当前this实例）
created () {},
// 生命周期 - 挂载完成（可以访问DOM元素）
mounted () {
console.log(JSON.parse(sessionStorage.getItem("tableData")))
this.tableData = JSON.parse(sessionStorage.getItem("tableData"))
// for(let item of this.tableData){
// console.log(item)
// this.lastest = item.last
// console.log(this.lastest)
// this.lastest == -1 ? '-' : '121'
// }
},
// 生命周期 - 创建之前
beforeCreate () {},
// 生命周期 - 挂载之前
beforeMount () {},
// 生命周期 - 更新之前
beforeUpdate () {},
// 生命周期 - 更新之后
updated () {},
// 生命周期 - 销毁之前
beforeDestroy () {},
// 生命周期 - 销毁完成
destroyed () {},
// 如果页面有keep-alive缓存功能，这个函数会触发
activated () {},
}
</script>
<style scoped>
.qualityResult {
height: 96vh;
overflow-y: scroll;
}
.labContent-title {
height: 138px;
line-height: 138px;
text-align: center;
font-size: 60px;
font-weight: bold;
color: #151033;
}
.labContent-title p {
display: inline-block;
}
.labContent-title img {
margin-right: 20px;
margin-bottom: 17px;
}
.theme {
padding: 22px 50px;
background: #f5f7ff;
}
.themeContent {
height: 122vh;
background: #fff;
padding: 60px 30px 20px 30px;
}
/*返回按钮*/
.qualityResult .labContent-back{
padding: 0 88px;
}
.qualityResult .backImg{
width: 25px;
height: 25px;
position: absolute;
top:180px;
cursor: pointer;
background-image: url('../assets/img/back.png');
}
.qualityResult .backImg:hover{
background-image: url('../assets/img/back-select.png');
}
/*返回按钮*/
.themeName {
text-align: left;
position: relative;
background-color: #f5f7ff;
height: 38px;
width: 100%;
line-height: 38px;
font-weight: bold;
font-size: 20px
}
.themeName i {
display: block;
float: left;
background-color: #151033;
height: 38px;
width: 14px;
margin-right: 10px;
}
/*表格样式*/
.qualityResult-table {
margin-top: 32px;
}
.qualityResult-table >>> .el-table__body {
border-collapse:separate;
border-spacing:0px 6px;
}
.qualityResult-table >>> .el-table thead tr th {
color: #fff;
background: #151033;
font-size: 18px;
height: 72px;
}
.qualityResult-table >>> .is-center {
border-right: none;
}
.qualityResult-table >>> .el-table__row {
height: 66px;
background: #f5f7ff;
color: #787682;
font-size: 18px;
}
.qualityResult-table >>> .el-table td {
border-bottom: none;
}
.qualityResult-table >>> .el-table--enable-row-hover .el-table__body tr:hover>td {
background-color: #e1e6f4;
}
</style>
\ No newline at end of file
src/views/testAnalysis.vue
浏览文件 @ 052a3fc2
......@@ -13,13 +13,13 @@
体验项：
<span>
<el-select style="margin-left: 10px;width:200px;" v-model="testType" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</span>
</p>
<p>
......
src/views/verifyEnvironment.vue
浏览文件 @ 052a3fc2
......@@ -67,11 +67,12 @@ export default {
},
// 方法集合
methods: {
// 画最左边的echarts
// drawLeft() {
// // 基于准备好的dom，初始化echarts实例
// let LeftChart = this.$echarts.init(document.getElementById("charts-left"));
// // 绘制图表
// 绘制图表
// LeftChart.setOption({
// tooltip: {
// trigger: 'item',
......
src/views/verifyEnvironment1.vue 0 → 100644
浏览文件 @ 052a3fc2
<!-- <!-- XC 环境认证系统页面 --> -->
<template>
<div class="verifyEnvironment">
<div class="labContent">
<div class="labContent-title">
<img src="../assets/image/logo.png" alt="">
<p >XC环境认证系统</p>
</div>
<div class="theme">
<div class="themeContent">
<div class="themeName"> <i></i> XXX环境 </div>
<div class="themeOne">
<div class="threeTitle">xxx项目</div>
<div>
<ul>
<li class="reuseLi" v-for="(item,index) in dataLi">
<div class="reuseLi-top">
<img src="../assets/image/testEn.png" alt="">
<span>{{item.name}}</span>
</div>
<div class="reuseLi-bottom">
<!--<p v-for="(item,index) in dataOne" :key="index">{{item.name}}：<span></span></p>-->
<p>操作系统：<span>{{item.os}}</span></p>
<p>数据库：<span>{{item.database}}</span></p>
<p>中间件：<span>{{item.middle}}</span></p>
</div>
<p class="reuseLi-btn"><a @click="experience(item.id)">体验</a></p>
</li>
</ul>
</div>
<div class="resultBtn">
<span @click="Jump">量化体检结果>></span>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
// 例如：import 《组件名称》 from '《组件路径》';
export default {
name: 'verify-environment1',
// import引入的组件需要注入到对象中才能使用
components: {
},
props: {},
data () {
// 这里存放数据
return {
dataLi: [
{name:'龙芯',os: '龙芯',database: '瀚高',middle: '金蝶',id: 1},
{name:'x86',os: 'x86',database: '瀚高',middle: '金蝶',id: 3},
{name:'鲲鹏',os: '鲲鹏',database: '瀚高',middle: '金蝶',id: 2}
]
};
},
// 方法集合
methods: {
// 体检结果
Jump() {
const id = 2 // 项目id
this.$server.getProject(id).then(res => { // 获取项目详情
console.log(res)
this.$server.getPerformanceData(res.data.techId).then(res => { // 根据项目techID获取性能表格数据
console.log(res)
sessionStorage.setItem('tableData', JSON.stringify(res.data)) // 存储表格数据
this.$router.push('/qualityResult1'); // 跳转表格
console.log(JSON.parse(sessionStorage.getItem("tableData")))
})
})
},
// 体验
experience(id) {
let data = {
id: 2, // 项目id
techId: id // 操作系统id
}
this.$server.postModify(data).then(res => { // 传输每次体验系统id
console.log(res)
// window.open('http://192.168.1.244:8081/workbook/#/login', '_blank').location;
// test -test -test
})
if(id==1){
window.open('http://192.168.1.244:8081/workbook/#/login', '_blank').location;
}else if(id ==2) {
window.open('http://192.168.1.245:8080/workbook/#/login', '_blank').location;
}else{
window.open('http://192.168.1.246:8080/workbook/#/login', '_blank').location;
}
}
},
// 监听属性 类似于data概念
computed: {},
// 监控data中的数据变化
watch: {},
//生命周期 - 创建完成（可以访问当前this实例）
created () {},
// 生命周期 - 挂载完成（可以访问DOM元素）
mounted () {},
// 生命周期 - 创建之前
beforeCreate () {},
// 生命周期 - 挂载之前
beforeMount () {},
// 生命周期 - 更新之前
beforeUpdate () {},
// 生命周期 - 更新之后
updated () {},
// 生命周期 - 销毁之前
beforeDestroy () {},
// 生命周期 - 销毁完成
destroyed () {},
// 如果页面有keep-alive缓存功能，这个函数会触发
activated () {},
}
</script>
<style scoped>
.verifyEnvironment {
height: 96vh;
overflow-y: scroll;
}
.labContent-title {
height: 138px;
line-height: 138px;
text-align: center;
font-size: 60px;
font-weight: bold;
color: #151033;
}
.labContent-title p {
display: inline-block;
}
.labContent-title img {
margin-right: 20px;
margin-bottom: 17px;
}
.theme {
padding: 22px 50px;
background: #f5f7ff;
}
.themeContent {
height: 122vh;
background: #fff;
padding: 20px 30px;
}
.themeName {
text-align: left;
position: relative;
background-color: #f5f7ff;
height: 38px;
width: 100%;
line-height: 38px;
font-weight: bold;
font-size: 20px
}
.themeName i {
display: block;
float: left;
background-color: #151033;
height: 38px;
width: 14px;
margin-right: 10px;
}
.themeOne {
padding: 30px 50px;
}
.threeTitle {
color: #151033;
padding-bottom: 18px;
font-weight: bold;
}
.reuseLi {
width: 100%;
height: 234px;
background: #f5f7ff;
margin-bottom: 20px;
}
.reuseLi-top,.reuseLi-bottom {
padding-left: 20px;
}
.reuseLi-top {
padding-top: 18px;
}
.reuseLi-top img {
padding-right: 12px;
}
.reuseLi-top span {
font-size: 16px;
color: #151033;
font-weight: bold;
}
.reuseLi-bottom {
height: 115px;
display: flex;
justify-content: space-around;
align-items: center;
border-top: 1px solid #e1e6f4;
border-bottom: 1px solid #e1e6f4;
width: 90%;
margin: 0 auto;
}
.reuseLi-bottom p {
line-height: 37px;
}
.reuseLi-bottom p span {
display: inline-block;
width: 170px;
border: 1px solid #a8d5f4;
height: 35px;
margin-bottom: -13px;
padding-left: 18px;
background: #f5f8fd;
}
.reuseLi-btn {
text-align: right;
width: 90%;
margin: 0 auto;
padding-top: 12px;
}
.reuseLi-btn a {
display: inline-block;
width: 68px;
height: 32px;
line-height: 32px;
background: #151033;
text-align: center;
color: #fff;
cursor: pointer;
}
.reuseLi-btn a:hover {
background: #3b3b56;
}
.resultBtn {
text-align: right;
}
.resultBtn span {
display: inline-block;
width: 166px;
height: 34px;
line-height: 34px;
background: #151033;
color: #fff;
text-align: center;
cursor: pointer;
}
</style>
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论