Commit 65b5bc87 by 莫晓莉

444

parent 36ad693a
import request from '@/utils/request'
//获取连接类型
export function types(data) {
return request({
url: 'etlweb/repository/types',
data,
method: 'post'
})
}
//获取历史连接的资源库列表
export function getLinkList(data) {
return request({
url: 'etlweb/repository/list',
data,
method: 'post'
})
}
//获取连接方式列表
export function accessMethod(data) {
return request({
url: 'etlweb/database/accessMethod',
data,
method: 'post'
})
}
//获取连接类型
export function accessData(data) {
return request({
url: 'etlweb/database/accessData',
data,
method: 'post'
})
}
//提交数据
export function create(data) {
return request({
url: 'etlweb/database/create',
data,
method: 'post'
})
}
//编辑数据库
export function check(data) {
return request({
url: 'etlweb/database/check',
data,
method: 'post'
})
}
//查询获取已经建立的数据库列表
export function listNames(data) {
return request({
url: 'etlweb/database/listNames',
data,
method: 'post'
})
}
// 根据数据库名查询已经建立的数据库详情即编辑数据库
export function database(data) {
return request({
url: 'etlweb/repository/database',
data,
method: 'post'
})
}
//连接资源库
export function login(data){
return request({
url: 'etlweb/repository/login',
data,
method: 'post'
})
}
...@@ -33,6 +33,8 @@ import moment from 'moment' ...@@ -33,6 +33,8 @@ import moment from 'moment'
import jsPlump from 'jsplumb' import jsPlump from 'jsplumb'
Vue.use(jsPlump); Vue.use(jsPlump);
// 引入自定义指令
// import './utils/dialog.js';
Vue.use(VueHighlightJS) Vue.use(VueHighlightJS)
Vue.use(mavonEditor) Vue.use(mavonEditor)
......
<template>
<div class="box">
<div class="left">
<!-- <el-tabs v-model="activeName" type="card" @tab-click="handleClick"> -->
<el-tabs v-model="activeName" type="card" >
<el-tab-pane label="资源库" name="first">
<div class="sel-content">
<div class="sel-menu-bar">
<el-dropdown
size="small"
placement="bottom"
>
<span class="sel-btn">
新建
<i class="el-icon-caret-bottom el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="password">
<template>
<i style="color:red;font-weight:bold;font-size:15px;" class="el-icon-refresh"></i>
新建转换
</template>
</el-dropdown-item>
<el-dropdown-item command="logout">
<template>
<i style="color:#F99C1C;font-weight:bold;font-size:15px;" class="el-icon-refresh-left"></i>
新建作业
</template>
</el-dropdown-item>
<el-dropdown-item style="text-align:right">新建目录</el-dropdown-item>
<el-dropdown-item class="text-center">打开</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-dropdown
size="small"
placement="bottom">
<span class="sel-btn">
资源库管理
<i class="el-icon-caret-bottom el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item @click.native="showlinkModal()">连接资源库</el-dropdown-item>
<el-dropdown-item >管理资源库</el-dropdown-item>
<el-dropdown-item >断开资源库</el-dropdown-item>
<el-dropdown-item>导出资源库</el-dropdown-item>
<el-dropdown-item>导入资源库</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-dropdown
size="small"
placement="bottom">
<span class="sel-btn">
帮组
<i class="el-icon-caret-bottom el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item> 语言切换</el-dropdown-item>
<el-dropdown-item >关于</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
<!-- 文件夹存放区域start-->
<el-tree
:data="jobTreeList"
:auto-expand-parent="true"
:check-strictly="true"
:default-expand-all="false"
node-key="id"
ref="tree"
:props="defaultProps"
:highlight-current="true">
<!-- el-icon-folder -->
<!-- <span class="custom-tree-node" slot-scope="{node,data}">
<span>
<i :class="data.icon"></i>{{ node.label }}
</span>
</span> -->
<span class="custom-tree-node" slot-scope="{node,data}">
<span>
<i class="el-icon-folder"></i>{{ node.label }}
</span>
</span>
</el-tree>
<!-- 文件夹存放区域end -->
</div>
</el-tab-pane>
<el-tab-pane label="核心对象" name="second">
<div class="sel-content">
核心对象
</div>
</el-tab-pane>
</el-tabs>
</div>
<div class="resize" title="收缩侧边栏">...</div>
<div class="mid">gggggg</div>
<!-- 连接资源库弹窗start -->
<el-dialog
title="资源库连接"
:visible.sync="dialogVisibleOne"
width="500px"
:before-close="handleClose">
<div>
<el-link @click.native="addRepository()" class="btn-pointer" :underline="false">新增资源库</el-link>
<el-link class="btn-pointer" :underline="false">修改资源库</el-link>
<el-link class="btn-pointer" :underline="false">删除资源库</el-link>
</div>
<div class="table-container">
<ul class="infinite-list" style="overflow:auto">
<li v-for="(item,index) in count" :key="index" class="infinite-list-item">{{ item }}</li>
</ul>
</div>
<el-form style="margin-top:15px;" label-position="left" :model="ruleForm" status-icon ref="ruleForm" label-width="100px" class="demo-ruleForm">
<el-form-item label="用户名" prop="pass">
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="密码" prop="checkPass">
<el-input type="password" v-model="ruleForm.checkPass" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisibleOne = false">取 消</el-button>
<el-button type="primary" @click="dialogVisibleOne = false">确 定</el-button>
</span>
</el-dialog>
<!-- 连接资源库弹窗end -->
<!-- 新增资源库弹窗start -->
<el-dialog
title="选择仓库类型"
:visible.sync="dialogVisibleTwo"
width="650px"
top="15%"
:before-close="closeRepository">
<div class="table-container table-container-repos">
<ul class="infinite-list" style="overflow:auto">
<li v-for="(item,index) in count" :key="index" class="infinite-list-item">{{ item }}</li>
</ul>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="FileModal = true">取 消</el-button>
<el-button type="primary" @click="dialogVisibleThree = true">确 定</el-button>
</span>
</el-dialog>
<!-- 新增资源库弹窗end -->
<!-- 资源库信息start -->
<el-dialog
title="资源库信息"
:visible.sync="dialogVisibleThree"
width="600px"
top="19%"
:before-close="closeFourth">
<el-form style="margin-top:15px;" :model="ruleForm" status-icon ref="ruleForm" label-width="150px" class="demo-ruleForm">
<el-form-item label="选择数据库连接">
<el-select v-model="ruleForm.region" placeholder="请选择选择数据库连接">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
<span style="margin-left:15px;">
<el-button @click="dialogVisibleThree = false">编辑</el-button>
<el-button @click="dialogVisibleFourth = true">新建</el-button>
<el-button @click="dialogVisibleThree = false">删除</el-button>
</span>
</el-form-item>
<el-form-item label="资源库标识" prop="pass">
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="资源库名称" prop="checkPass">
<el-input type="password" v-model="ruleForm.checkPass" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisibleThree = false">确 定</el-button>
<el-button @click="dialogVisibleThree = false">创建或更新</el-button>
<el-button type="primary" @click="dialogVisibleThree = false">删 除</el-button>
<el-button @click="dialogVisibleThree = false">取 消</el-button>
<!-- <el-button type="primary" @click="dialogVisibleTwo = false">确 定</el-button> -->
</span>
</el-dialog>
<!-- 资源库信息end -->
<!-- 新建数据库连接start -->
<el-dialog
title="数据库连接"
:visible.sync="dialogVisibleFourth"
width="800px"
top="5%"
:before-close="closeFourth">
<div style="display:flex;">
<div class="left-container" >
<ul class="infinite-list">
<li @click="chooseType(index)" :class="[index==nowTypeIndex?'type-checked':'']" v-for="(item,index) in linkType" :key="index" >{{ item.name }}</li>
</ul>
</div>
<!-- 右边start -->
<el-form style="flex:1;" label-width="80px">
<div v-if="nowTypeIndex==0">
<el-form-item label="连接名称" prop="pass" >
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
</el-form-item>
<div style="display:flex;">
<div class="choose-container" >
<div>
<div class="boxtitle">连接类型</div>
<ul class="leftv scroll-y">
<li>111</li>
<li>222</li>
<li>333</li>
<li>444</li>
<li>555</li>
</ul>
</div>
<div style="margin-top:15px;">
<div class="boxtitle">连接方式</div>
<ul class="rightv scroll-y">
<li>111</li>
<li>222</li>
<li>333</li>
<li>444</li>
<li>555</li>
</ul>
</div>
</div>
<div class="input-container">
<div class="input-container-title">设置</div>
<el-form-item label="主机名称:" prop="pass" label-width="90px">
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="数据库名称:" prop="pass" label-width="90px">
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="数据表空间:" prop="pass" label-width="90px">
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="索引表空间:" prop="pass" label-width="90px">
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="端口号:" prop="pass" label-width="90px">
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="用户名:" prop="pass" label-width="90px">
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="密码:" prop="pass" label-width="90px">
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
</el-form-item>
</div>
</div>
</div>
<div v-if="nowTypeIndex==1">
<!-- 高级 -->
<el-checkbox-group class="check-group" v-model="checkModel">
<el-checkbox class="checkbox-sty" label="美食/餐厅线上活动" name="type1"></el-checkbox>
<el-checkbox class="checkbox-sty" label="地推活动" name="type2"></el-checkbox>
<el-checkbox class="checkbox-sty" label="线下主题活动" name="type3"></el-checkbox>
<el-checkbox class="checkbox-sty" label="单纯品牌曝光" name="type4"></el-checkbox>
</el-checkbox-group>
<div>
<div style="padding:10px ;">默认模式名称,在没有其他模式时候使用</div>
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
</div>
<div>
<div style="padding:10px ;">请输入连接成功后要执行的SQL语句,用分号(;)隔开</div>
<el-input type="textarea" ></el-input>
</div>
</div>
<div v-if="nowTypeIndex==2">
选项
</div>
<div v-if="nowTypeIndex==3">
连接池
</div>
<div v-if="nowTypeIndex==4">
集群
</div>
</el-form>
<!-- 右边end -->
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisibleTwo = false">取 消</el-button>
<el-button @click="dialogVisibleTwo = false">测 试</el-button>
<el-button @click="dialogVisibleTwo = false">特征列表</el-button>
<el-button @click="dialogVisibleTwo = false">浏 览</el-button>
<el-button @click="dialogVisibleTwo = false">确 定</el-button>
</span>
</el-dialog>
<!-- 新建数据库连接end -->
<!-- 文件资源库start -->
<el-dialog
title="文件资源库设置"
:visible.sync="FileModal"
width="600px"
top="19%"
:before-close="closeFileModal">
<el-form style="margin-top:15px;" :model="ruleForm" status-icon ref="ruleForm" label-width="150px" class="demo-ruleForm">
<el-form-item label="根目录" prop="pass">
<div style="display:flex;">
<el-input type="password" v-model="ruleForm.pass" autocomplete="off"></el-input>
<span style="margin-left:15px;">
<el-button @click="FileModalScan = true">浏览</el-button>
</span>
</div>
</el-form-item>
<el-form-item label="只读资源库?:" prop="checkPass">
<el-checkbox :indeterminate="isIndeterminate"></el-checkbox>
</el-form-item>
<el-form-item label="不显示隐藏文件:" prop="checkPass">
<el-checkbox :indeterminate="isIndeterminate"></el-checkbox>
</el-form-item>
<el-form-item label="资源库标志" prop="checkPass">
<el-input type="password" v-model="ruleForm.checkPass" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="名称" prop="checkPass">
<el-input type="password" v-model="ruleForm.checkPass" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="FileModal = false">取 消</el-button>
<el-button type="primary" @click="FileModal = false">确 定</el-button>
</span>
</el-dialog>
<!-- 文件资源库end -->
<!-- 浏览start -->
<el-dialog
title="文件浏览器"
:visible.sync="FileModalScan"
width="450px"
top="19%"
:before-close="closeFileModalScan">
<div class="file-container">
<!-- 文件夹存放区域start-->
<el-tree
:data="jobTreeList"
:auto-expand-parent="true"
:check-strictly="true"
:default-expand-all="false"
node-key="id"
ref="tree"
:props="defaultProps"
:highlight-current="true">
<!-- el-icon-folder -->
<!-- <span class="custom-tree-node" slot-scope="{node,data}">
<span>
<i :class="data.icon"></i>{{ node.label }}
</span>
</span> -->
<span class="custom-tree-node" slot-scope="{node,data}">
<span>
<i class="el-icon-folder"></i>{{ node.label }}
</span>
</span>
</el-tree>
<!-- 文件夹存放区域end -->
</div>
<span slot="footer" class="dialog-footer" style="display:flex;">
<el-select style="flex:1;margin-right:25px;" v-model="ruleForm.region" placeholder="请选择选择数据库连接">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
<el-button @click="FileModalScan = false">取 消</el-button>
<el-button type="primary" @click="FileModalScan = false">确 定</el-button>
</span>
</el-dialog>
<!-- 浏览end -->
</div>
</template>
<script>
import '@/utils/dialog.js';
export default {
data() {
return {
checkModel:[],
visible:true,
dialogDrag:false,
dialog: {// dialog显示隐藏
dialogVisible: false,
dialogDrag: true, // 可拖拽
dialogChange: true, // 可拉伸
title: '详情'
},
activeName: 'first',//当前选择的标签
jobTreeList:[
{
path: 'f0',
id: '1',
parent: '0',
lasted: false,
},
{
path: 'f01',
id: '2',
parent: '1',
lasted: true,
},
{
path: 'f02',
id: '3',
parent: '1',
lasted: true,
},
{
path: 'f021',
id: '6',
parent: '3',
lasted: false,
},
{
path: 'f021',
id: '7',
parent: '6',
lasted: false,
},
{
path: 'f40',
id: '4',
parent: '0',
lasted: false,
},
{
path: 'f41',
id: '5',
parent: '4',
lasted: true,
}
],
defaultProps: {
label: 'path',
children: 'children',
},
dialogVisibleOne:false,//链接资源库弹窗
ruleForm: {
pass: '',
checkPass: '',
age: ''
},
dialogVisibleTwo:false,//新增资源库弹窗
count:[
'1111111111111111',
'2222222222222222'
],
dialogVisibleThree:false,//资源库信息弹窗
dialogVisibleFourth:false,
linkType:[
{
id:1,
name:'一般'
},
{
id:2,
name:'高级'
},
{
id:3,
name:'选项'
},
{
id:4,
name:'连接池'
},
{
id:5,
name:'集群'
}
],
nowTypeIndex:0,//当前选中数据库类型
FileModal:false,//文件资源库弹窗
FileModalScan:false,//浏览弹窗
};
},
// create(){
// this.treeRevert(this.jobTreeList);
// },
mounted () {
this.dragControllerDiv();
this.treeRevert(this.jobTreeList);
},
methods: {
// handleClick(tab, event) {
// console.log(tab, event);
// },
// handleCommand(command) {
// if (command == "password"){
// this.changePassword()
// }else {
// this.logout()
// }
// },
// async logout() {
// this.$message("点击退出");
// },
// changePassword(){
// this.$message("点击修改密码");
// },
// load () {
// this.count += 2
// },
dragControllerDiv: function () {
var resize = document.getElementsByClassName('resize');
var left = document.getElementsByClassName('left');
var mid = document.getElementsByClassName('mid');
var box = document.getElementsByClassName('box');
for (let i = 0; i < resize.length; i++) {
// 鼠标按下事件
resize[i].onmousedown = function (e) {
//颜色改变提醒
// resize[i].style.background = '#818181';
var startX = e.clientX;
resize[i].left = resize[i].offsetLeft;
// 鼠标拖动事件
document.onmousemove = function (e) {
var endX = e.clientX;
var moveLen = resize[i].left + (endX - startX); // (endx-startx)=移动的距离。resize[i].left+移动的距离=左边区域最后的宽度
var maxT = box[i].clientWidth - resize[i].offsetWidth; // 容器宽度 - 左边区域的宽度 = 右边区域的宽度
if (moveLen < 32) moveLen = 32; // 左边区域的最小宽度为32px
if (moveLen > maxT - 150) moveLen = maxT - 150; //右边区域最小宽度为150px
resize[i].style.left = moveLen; // 设置左侧区域的宽度
for (let j = 0; j < left.length; j++) {
left[j].style.width = moveLen + 'px';
mid[j].style.width = (box[i].clientWidth - moveLen - 10) + 'px';
}
};
// 鼠标松开事件
document.onmouseup = function (evt) {
//颜色恢复
// resize[i].style.background = '#d6d6d6';
document.onmousemove = null;
document.onmouseup = null;
resize[i].releaseCapture && resize[i].releaseCapture(); //当你不在需要继续获得鼠标消息就要应该调用ReleaseCapture()释放掉
};
resize[i].setCapture && resize[i].setCapture(); //该函数在属于当前线程的指定窗口里设置鼠标捕获
return false;
};
}
},
//数据转换
treeRevert(arrayList){
console.log('传入数据=============',arrayList);
let formatObj = arrayList.reduce((pre, cur) => {
return {...pre, [cur['id']]: cur}
}, {});
console.log(formatObj);
let formatArray = arrayList.reduce((arr, cur) => {
// let pid = cur.pid ? cur.pid : 0;
let pid = cur.parent ? cur.parent : 0;
let parent = formatObj[pid];
cur.disabled = !cur.lasted;
if (parent) {
parent.children ? parent.children.push(cur) : parent.children=[cur];
} else {
arr.push(cur)
}
return arr;
}, []);
console.log('树形数据=============',formatArray);
this.jobTreeList=formatArray;
},
// 点击链接资源库显示新建资源库弹窗
showlinkModal(){
this.dialogVisibleOne=true;
// this.dialog.dialogVisible=true;
},
handleClose(){
this.dialogVisibleOne=false;
},
//新增资源库
addRepository(){
this.dialogVisibleTwo=true;
// this.dialog.dialogVisible=true;
},
closeRepository(){
this.dialogVisibleTwo=false;
},
//新增资源库
addRepositoryInfo(){
this.dialogVisibleThree=true;
// this.dialog.dialogVisible=true;
},
closeRepositoryInfo(){
this.dialogVisibleThree=false;
},
//新增资源库
addFourth(){
this.dialogVisibleFourth=true;
},
closeFourth(){
this.dialogVisibleFourth=false;
},
chooseType(index){
this.nowTypeIndex=index;
},
closeFileModal(){
this.FileModal=false;
},
closeFileModalScan(){
this.FileModalScan=false;
},
}
};
</script>
<style>
.content{
direction: flex;
}
.ef-left-box{
flex:1
}
.el-tabs--card >.el-tabs__header {
margin: 0 !important;
}
.el-tabs--card>.el-tabs__header {
margin: 0;
}
.el-tabs__item {
background-color:#DEECFD;
color:#1567A9;
}
.el-tabs--card>.el-tabs__header .el-tabs__item.is-active{
border-bottom: 1px solid #dce3e8;
}
.el-tabs__item.is-active {
color: #FFDEAD;
}
.el-tabs--card>.el-tabs__header {
border-bottom: 1px solid #E4E7ED;
}
.sel-content{
min-height: 81vh;
border: 1px solid #dce3e8;
}
.sel-menu-bar{
background-color: #D6E3F2;
}
.sel-btn{
display: inline-block;
padding: 7px 15px;
font-size: 12px;
border-radius: 3px;
}
.text-center{
text-align:center;
}
.drop-item{
padding:10px 5px;
}
.space-gap{
margin-right:5px;
}
.rg{
text-align: right;
}
.el-tabs__item.is-active{
color:#4074AF;
font-weight:bold;
}
/* 拖拽相关样式 */
/*包围div样式*/
.box {
width: 100%;
height: 100%;
margin: 1% 0px;
overflow: hidden;
padding:0 15px;
min-height: 86vh;
display: flex;
}
/*左侧div样式*/
.left {
/*左侧初始化宽度*/
width:350px; /*左侧初始化宽度*/
height: 100%;
background: #FFFFFF;
float: left;
min-height: 86vh;
}
/*拖拽区div样式*/
.resize {
cursor: col-resize;
background-color: #d6d6d6;
border-radius: 5px;
margin-top: -10px;
width: 5px;
background-size: cover;
background-position: center;
font-size: 32px;
color: white;
background-color:white;
min-height: 86vh;
}
/*拖拽区鼠标悬停样式*/
.resize:hover {
color: #444444;
}
/*右侧div'样式*/
.mid {
flex:1;
/*右侧初始化宽度*/
height: 100%;
background: #fff;
/* box-shadow: -1px 4px 5px 3px rgba(0, 0, 0, 0.11); */
min-height: 81vh;
margin-top:4vh;
border: 1px solid #dce3e8;
}
/* 弹窗样式 */
/* .btn-pointer:hover{
cursor: pointer;
padding:5px 8px;
border:1px soild red;
} */
.el-dialog__header{
background-color:#D2E0F1;
}
.el-dialog__body{
padding:15px 15px;
}
.btn-pointer{
padding:5px;
border-radius:5px;
}
.btn-pointer:hover {
border:1px solid #AAC8F1;
box-shadow: 2px 2px 2px 2px #AAC8F1;
}
.table-container{
margin-top:15px;
border:1px solid #D2E0F1;
overflow: auto;
height:300px;
}
ul{
margin:0;
padding:0;
}
ul li{
list-style: none;
height:30px;
line-height:30px;
padding:0 10px;
white-space: nowrap;
}
ul li:hover{
cursor: pointer;
background-color: #EEEEEE;
}
.table-container-repos{
height:100px;
margin-top:0;
}
.choose-container{
width:200px;
display:flex;
flex-direction:column;
margin-right:10px;
}
.left-container{
width:180px;
border:1px solid #D2E0F1;
overflow-y:scroll;
height:520px;
margin-right:10px;
}
.leftv{
border:1px solid #D2E0F1;
height:250px;
}
.rightv{
border:1px solid #D2E0F1;
height:150px;
}
.input-container{
flex:1;
border:1px solid #D2E0F1;
position: relative;
padding:15px;
}
.input-container-title{
background-color:white;
padding:0 5px;
position:absolute;
top:-8px;
left: 15px;
font-weight:bold;
color: #15428B;
}
.boxtitle{
padding:5px 10px;
background-color:#CFDFF3;
}
.scroll-y{
overflow-y: scroll;
}
.type-checked{
background-color:#8888FF;
color: #fff;
}
.check-group{
padding:5px;
background-color: #D1DDEF;
}
.checkbox-sty{
display: block;
padding:5px 0;
}
.file-container{
height:400px;
border:1px solid #D2E0F1;
}
</style>
\ No newline at end of file
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