进行了一些美化 add osd part

This commit is contained in:
p71924506 2023-02-28 15:08:11 +08:00
parent 43fc4de386
commit 6dfbfb127b
3 changed files with 112 additions and 2 deletions

View File

@ -34,6 +34,9 @@
<el-menu-item index="/platformData" >
<item icon="el-icon-data-analysis" title="平台信息记录板"/>
</el-menu-item>
<el-menu-item index="/OSD" >
<item icon="el-icon-s-comment" title="开源资料分享"/>
</el-menu-item>
<el-menu-item index="/userManage" v-if="isRoot">
<item icon="el-icon-setting" title="用户管理"/>
</el-menu-item>
@ -91,11 +94,11 @@ export default {
//
handleSelect(key, keyPath) {
if (key!=="/userManage" && key!=="/fileList" && key !== "/platformData"){
if (key!=="/userManage" && key!=="/fileList" && key !== "/platformData" && key !== "/OSD"){
console.log(key)
pageUtils.openPage(this.$router,"/fileListV2/"+ key)
}else if (key =="/userManage" || key == "/platformData"){
}else if (key =="/userManage" || key == "/platformData"|| key=="/OSD"){
pageUtils.openPage(this.$router,key)
}
@ -128,4 +131,10 @@ export default {
width: 1em;
height: 1em;
}
/*侧边栏圆角 阴影*/
.sidebar-container{
border-radius: 0px 15px 15px 0px;
box-shadow: 5px 0px 15px 0px rgba(0, 0, 0, 0.27);
}
</style>

View File

@ -100,6 +100,19 @@ export const constantRoutes = [
}
]
},
{
path:'/',
component: Layout,
hidden: true,
children: [
{
path: "OSD",
name: 'OSD',
component:() => import("@/views/openSourceDiscuss/OSD"),
meta: {title: '开源资料分享',icon: 'el-icon-s-comment'}
}
]
},
{
path:'/',
component: Layout,

View File

@ -0,0 +1,88 @@
<template>
<div class="app-container">
<div class="begin">
<h2>开始</h2>
<div style="display:inline-block">
<div class="newBase" style="margin-right: 30px">
<p class="baseWord">新建文档</p>
</div>
<div class="newBase">
<p class="baseWord">新建知识库</p>
</div>
</div>
</div>
<div>
<h2>文档</h2>
<el-collapse v-model="activeNames" @change="handleChange" class="collapse" style=" margin-top: 40px;">
<el-collapse-item title="code.mil介绍文档" name="1">
<div>与现实生活一致与现实生活的流程逻辑保持一致遵循用户习惯的语言和概念</div>
<div>在界面中一致所有的元素和结构需保持一致比如设计样式图标和文本元素的位置等</div>
</el-collapse-item>
<el-collapse-item title="反馈 Feedback" name="2">
<div>控制反馈通过界面样式和交互动效让用户可以清晰的感知自己的操作</div>
<div>页面反馈操作后通过页面元素的变化清晰地展现当前状态</div>
</el-collapse-item>
<el-collapse-item title="效率 Efficiency" name="3">
<div>简化流程设计简洁直观的操作流程</div>
<div>清晰明确语言表达清晰且表意明确让用户快速理解进而作出决策</div>
<div>帮助用户识别界面简单直白让用户快速识别而非回忆减少用户记忆负担</div>
</el-collapse-item>
<el-collapse-item title="可控 Controllability" name="4">
<div>用户决策根据场景可给予用户操作建议或安全提示但不能代替用户进行决策</div>
<div>结果可控用户可以自由的进行操作包括撤销回退和终止当前操作等</div>
</el-collapse-item>
</el-collapse>
</div>
</div>
</template>
<script>
export default {
name: 'OSD',
data() {
return {
activeNames: ['1']
};
},
methods: {
handleChange(val) {
console.log(val);
}
}
}
</script>
<style scoped lang="scss">
::v-deep .el-collapse-item__header{
font-size: 16px!important;
height: 55px;
}
.begin{
margin-bottom: 40px;
}
.newBase{
margin-top: 20px;
width: 190px;
height: 55px;
border-radius: 10px;
background: #FFFFFF;
font-size: 16px;
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.08);
float: left;
display: flex;
justify-content: center;
text-align: center;
align-items: center;
}
.baseWord{
text-align: center;
color: #3D3D3D;
}
</style>