Skip to content

D
dsk-operate-sys-cscec
Commit 977ddd29 authored by caixingbing's avatar caixingbing
Browse files
Options

Merge branch 'master' of http://192.168.60.201/root/dsk-operate-sys

parents 9a7eb4b2 4388543f
Hide whitespace changes
Inline Side-by-side
Showing with 514 additions and 18 deletions
dsk-operate-ui/src/assets/styles/index.scss
View file @ 977ddd29
...@@ -494,6 +494,14 @@ ul, li { ...@@ -494,6 +494,14 @@ ul, li {
width: 16px; width: 16px;
} }
} }
.btnsmall{
display: inline-block;
font-size: 12px;
border-radius: 2px;
width: 72px;
text-align: center;
margin: 0 4px;
}
.btn_default{ .btn_default{
border: 1px solid #0081FF; border: 1px solid #0081FF;
color: #0081FF; color: #0081FF;
...@@ -527,6 +535,25 @@ ul, li { ...@@ -527,6 +535,25 @@ ul, li {
background-color: #006AD1; background-color: #006AD1;
} }
} }
.btn_cancel{
border: 1px solid #CCCCCC;
color: #4f4f4f;
&.h28{
line-height: 26px;
}
&.h32 {
line-height: 30px;
}
&.h34{
line-height: 32px;
}
&:hover{
color: #4f4f4f;
border-color: #CCCCCC;
background-color: #F4F4F4;
}
}
//搜索框 //搜索框
.searchInput{ .searchInput{
width: 590px; width: 590px;
...@@ -556,3 +583,34 @@ ul, li { ...@@ -556,3 +583,34 @@ ul, li {
} }
} }
} }
//导出EXCEL
.btn-export{
display: inline-block;
color: #232323;
font-size: 14px;
height: 24px;
line-height: 24px;
cursor: pointer;
img{
margin-right: 5px;
float: left;
width: 18px;
height: 18px;
margin-top: 2px;
}
&:hover{
color: #0081FF;
}
}
//有链接字体颜色
.wordprimary{
color: #0081FF;
cursor: pointer;
}
//分割线
.el-divider--horizontal{
margin: 0;
}
.el-divider{
background-color: #efefef;
}
dsk-operate-ui/src/views/project/projectList/index.vue
View file @ 977ddd29
...@@ -6,34 +6,82 @@ ...@@ -6,34 +6,82 @@
<div class="btn btn_primary h28"><div class="img img2"></div>批量导出</div> <div class="btn btn_primary h28"><div class="img img2"></div>批量导出</div>
</div> </div>
<el-tabs v-model="activeName" @tab-click="handleClick" class="tabpane w100"> <el-tabs v-model="activeName" @tab-click="handleClick" class="tabpane w100">
<el-tab-pane label="我参与的项目" name="first"> <el-tab-pane label="我参与的项目" name="first"></el-tab-pane>
<div class="searchInput"> <el-tab-pane label="公司全部项目" name="second"></el-tab-pane>
<el-input type="text" placeholder="请输入项目或业主单位名称关键词进行搜索"></el-input>
<div class="btn">搜索</div> <div class="searchInput">
</div> <el-input type="text" placeholder="请输入项目或业主单位名称关键词进行搜索"></el-input>
<div class="sellist"> <div class="btn">搜索</div>
<div class="selli"> </div>
<div class="sellist">
<div class="selli">
<span> <span>
地区团队 地区团队
</span>aaa </span>
</div> <div class="selectInput" @click="getxmdq"><span class="selecttext">{{xmdqlabel}}<i class="el-icon-caret-bottom"></i></span>
<div class="selli"> <el-cascader class="input"
ref="myCascader"
:props='props' :options="options"
@change="handleChange"></el-cascader>
</div>
</div>
<div class="selli">
<span> <span>
项目信息 项目信息
</span>aaa </span>aaa
</div>
</div> </div>
<div class="scbtns"> </div>
<div class="btn btn_primary h34">查询</div> <div class="scbtns">
<div class="btn btn_default h34">重置</div> <div class="btn btn_primary h34">查询</div>
</div> <div class="btn btn_cancel h34">重置</div>
</el-tab-pane> </div>
<el-tab-pane label="公司全部项目" name="second">配置管理</el-tab-pane>
</el-tabs> </el-tabs>
</el-card> </el-card>
<el-card class="box-card noborder"> <el-card class="box-card noborder">
<div class="titles">项目明细
<div class="dc">
<div class="total">共126条</div>
<div class="btn-export"><img src="@/assets/images/EXCEL.png">导出EXCEL</div>
</div>
</div>
<div class="datalist">
<div class="datali">
<div class="det-title">轨道交通13号线扩能提升工程<span class="people"><i>A</i>四川-李丽 <font color="#FA8A00">正在跟进</font></span></div>
<div class="det-tips"><span class="tips tip1">轨道交通</span><span class="tips tip2">江西省-南昌市</span></div>
<div class="det-contets">
<div class="det-con">
<span>项目类型：</span>
<span>轨道交通</span>
</div>
<div class="det-con">
<span>投资估算（万元）：</span>
<span>21</span>
</div>
<div class="det-con">
<span>最后跟进时间：</span>
<span>2013-02-19</span>
</div>
<div class="det-con">
<span>业主单位：</span>
<span class="wordprimary">重庆市交通开发投资（集团）有限公司</span>
</div>
</div>
<el-divider></el-divider>
<div class="operates">
<div><img src="@/assets/images/follow.png">跟进</div>
<div><img src="@/assets/images/edit.png">编辑</div>
<div><img src="@/assets/images/delete.png">删除</div>
</div>
<div class="delform">
<div class="words">是否将项目删除</div>
<div>
<div class="btnsmall btn_primary h28">确定</div>
<div class="btnsmall btn_cancel h28">取消</div>
</div>
</div>
</div>
</div>
</el-card> </el-card>
</div> </div>
</template> </template>
...@@ -44,12 +92,237 @@ export default { ...@@ -44,12 +92,237 @@ export default {
name: 'ProjectList', name: 'ProjectList',
data() { data() {
return { return {
props:{
multiple: true},
xmdq: [],
xmdqlabel:'项目地区',
activeName:'first', activeName:'first',
options: [
{
value: 'zhinan',
label: '指南',
children: [{
value: 'shejiyuanze',
label: '设计原则',
children: [{
value: 'yizhi',
label: '一致'
}, {
value: 'fankui',
label: '反馈'
}, {
value: 'xiaolv',
label: '效率'
}, {
value: 'kekong',
label: '可控'
}]
}, {
value: 'daohang',
label: '导航',
children: [{
value: 'cexiangdaohang',
label: '侧向导航'
}, {
value: 'dingbudaohang',
label: '顶部导航'
}]
}]
}, {
value: 'zujian',
label: '组件',
children: [{
value: 'basic',
label: 'Basic',
children: [{
value: 'layout',
label: 'Layout 布局'
}, {
value: 'color',
label: 'Color 色彩'
}, {
value: 'typography',
label: 'Typography 字体'
}, {
value: 'icon',
label: 'Icon 图标'
}, {
value: 'button',
label: 'Button 按钮'
}]
}, {
value: 'form',
label: 'Form',
children: [{
value: 'radio',
label: 'Radio 单选框'
}, {
value: 'checkbox',
label: 'Checkbox 多选框'
}, {
value: 'input',
label: 'Input 输入框'
}, {
value: 'input-number',
label: 'InputNumber 计数器'
}, {
value: 'select',
label: 'Select 选择器'
}, {
value: 'cascader',
label: 'Cascader 级联选择器'
}, {
value: 'switch',
label: 'Switch 开关'
}, {
value: 'slider',
label: 'Slider 滑块'
}, {
value: 'time-picker',
label: 'TimePicker 时间选择器'
}, {
value: 'date-picker',
label: 'DatePicker 日期选择器'
}, {
value: 'datetime-picker',
label: 'DateTimePicker 日期时间选择器'
}, {
value: 'upload',
label: 'Upload 上传'
}, {
value: 'rate',
label: 'Rate 评分'
}, {
value: 'form',
label: 'Form 表单'
}]
}, {
value: 'data',
label: 'Data',
children: [{
value: 'table',
label: 'Table 表格'
}, {
value: 'tag',
label: 'Tag 标签'
}, {
value: 'progress',
label: 'Progress 进度条'
}, {
value: 'tree',
label: 'Tree 树形控件'
}, {
value: 'pagination',
label: 'Pagination 分页'
}, {
value: 'badge',
label: 'Badge 标记'
}]
}, {
value: 'notice',
label: 'Notice',
children: [{
value: 'alert',
label: 'Alert 警告'
}, {
value: 'loading',
label: 'Loading 加载'
}, {
value: 'message',
label: 'Message 消息提示'
}, {
value: 'message-box',
label: 'MessageBox 弹框'
}, {
value: 'notification',
label: 'Notification 通知'
}]
}, {
value: 'navigation',
label: 'Navigation',
children: [{
value: 'menu',
label: 'NavMenu 导航菜单'
}, {
value: 'tabs',
label: 'Tabs 标签页'
}, {
value: 'breadcrumb',
label: 'Breadcrumb 面包屑'
}, {
value: 'dropdown',
label: 'Dropdown 下拉菜单'
}, {
value: 'steps',
label: 'Steps 步骤条'
}]
}, {
value: 'others',
label: 'Others',
children: [{
value: 'dialog',
label: 'Dialog 对话框'
}, {
value: 'tooltip',
label: 'Tooltip 文字提示'
}, {
value: 'popover',
label: 'Popover 弹出框'
}, {
value: 'card',
label: 'Card 卡片'
}, {
value: 'carousel',
label: 'Carousel 走马灯'
}, {
value: 'collapse',
label: 'Collapse 折叠面板'
}]
}]
}, {
value: 'ziyuan',
label: '资源',
children: [{
value: 'axure',
label: 'Axure Components'
}, {
value: 'sketch',
label: 'Sketch Templates'
}, {
value: 'jiaohu',
label: '组件交互文档'
}]
}]
} }
}, },
created() { created() {
}, },
methods: { methods: {
getxmdq(){
console.log(888)
},
handleClick(){
},
handleChange(value) {
console.log(value);
this.xmdq = value
var labelString = this.$refs.myCascader.getCheckedNodes()[0].pathLabels;
console.log(labelString)
if(labelString.length>0){
let dq = ''
labelString.forEach((item,index)=>{
let str = ','
if(index == 0)
str = ''
dq += str + item
})
this.xmdqlabel = dq
}else{
this.xmdqlabel = '项目地区'
}
}
} }
} }
</script> </script>
...@@ -58,6 +331,9 @@ export default { ...@@ -58,6 +331,9 @@ export default {
.app-container{ .app-container{
padding: 0; padding: 0;
} }
.el-card{
overflow: initial;
}
.noborder{ .noborder{
position: relative; position: relative;
} }
...@@ -97,7 +373,169 @@ export default { ...@@ -97,7 +373,169 @@ export default {
>span{ >span{
float: left; float: left;
margin-right: 28px; margin-right: 28px;
opacity: 0.8;
}
}
}
.titles{
color: #232323;
font-size: 16px;
font-weight: bold;
height: 60px;
line-height: 64px;
border-bottom: 1px solid #EFEFEF;
padding-left: 26px;
&::after{
content: " ";
width: 2px;
height: 14px;
background: #445781;
float: left;
margin-left: -10px;
margin-top: 24px;
}
.dc{
float: right;
font-size: 12px;
color: #3D3D3D;
font-weight: 400;
padding-right: 24px;
position: relative;
&::after{
content: ' ';
width: 2px;
height: 2px;
background: rgba(35,35,35,0.4);
border-radius: 50%;
position: absolute;
top: 30px;
left: 14px;
}
>div{
display: inline-block;
margin-left: 20px;
}
}
}
.datalist{
.datali{
padding: 16px 16px 0;
position: relative;
.operates{
position: absolute;
z-index: 1;
right: 0;
top: 24px;
>div{
padding-right: 16px;
display: inline-block;
font-size: 12px;
>img{
float: left;
margin-right: 5px;
}
}
.tits{
padding: 12px 0;
}
}
.delform{
width: 200px;
height: 114px;
background: #FFFFFF;
box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.1608);
border-radius: 2px;
position: absolute;
right: 16px;
top: -94px;
z-index: 3;
text-align: center;
.words{
padding: 24px 0;
}
}
&:hover{
background-color: #F6F9FC;
cursor: pointer;
}
.det-title{
color: #3D3D3D;
font-size: 16px;
font-weight: 700;
line-height: 23px;
.people{
padding-left: 10px;
color: #4f4f4f;
font-weight: 400;
font-size: 14px;
i{
width: 20px;
height: 20px;
background: #E3EEF9;
border-radius: 50%;
font-style: initial;
font-size: 12px;
display: inline-block;
color: #0081FF;
text-align: center;
line-height: 20px;
margin-right: 4px;
}
}
} }
.det-tips{
padding: 8px 0 ;
.tips{
display: inline-block;
padding: 4px 8px;
border-radius: 2px;
font-size: 12px;
margin-right: 8px;
&.tip1{
background-color: #E4F3FD;
color: #41A1FD;
}
&.tip2{
background-color: #F3F3FF;
color: #8491E8;
}
}
}
.det-contets{
padding: 4px 0 16px;
.det-con{
font-size: 14px;
display: inline-block;
padding-right: 32px;
&:last-child{
padding-right: 0;
}
span:nth-child(2n-1){
color: #a7a7a7;
}
}
}
}
}
.selectInput{
position: relative;
display: inline-block;
&:hover{
.selecttext{color: #0081FF;
i{color: #0081FF;}}
}
.selecttext{
i{
margin-left: 5px;
color: #a7a7a7;
}
}
.input{
position: absolute;
left: 0;
opacity: 0;
height: 20px;
} }
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment