Commit 1ad6cc51 authored by 周远喜's avatar 周远喜

代码ok

parent 7693dddb
<template>
<div>
<button @click="laod">load</button>
<slot name="header" >
<h1>zheshibiaotou </h1>
</slot>
<Table ref="table" v-bind="$attrs" :data="list">
<!-- <template slot="id" slot-scope="{row}">
{{row.id}}++12
</template> -->
<template slot="name" slot-scope="{row}">
{{row.name}}++12
</template>
</Table>
</div>
</template>
<script>
export default {
data(){
return {
list:[]
}
},
created(){
},
provide () {
return {
tableRoot: this.$refs.table
};
},
mounted(){
// this.props=this.$attrs;
this.$refs.table.$slots=this.$slots;
// this.$refs.table.$scopedSlots =this.$scopedSlots ;
// this.$scopedSlots=this.$refs.table.$scopedSlots
this.list=[{id:1,name:"henq"},{id:3,name:"henq2222222"}]
console.info("slots:",this.$slots,this.$refs.table.$slots)
console.warn(this.$scopedSlots,this.$refs.table.$scopedSlots)
},
methods:{
laod(){
console.info("slots:",this.$slots,this.$refs.table.$slots)
}
}
}
</script>
\ No newline at end of file
<template>
<Layout class="layout">
<Header>
这是头
<Header class="header" >
<Menu active-name="1-1" mode="horizontal" width="100%;">
<div class="layout-nav">
<MenuItem name="1-1">
<Icon type="ios-navigate"></Icon>
<span>数据库</span>
</MenuItem>
<MenuItem name="1-2">
<Icon type="ios-search"></Icon>
<span>快速建模</span>
</MenuItem>
<MenuItem name="1-3">
<Icon type="ios-settings"></Icon>
<span>代码生成</span>
</MenuItem> </div>
</Menu>
</Header>
<Content>
<nuxt />
......@@ -16,5 +31,13 @@ export default {
<style lang="less" >
.layout{
height: 100vh;
.header{
background-color:white;
padding: 0;
.layout-nav{
text-align: right;
float:right;
}
}
}
</style>
\ No newline at end of file
import axios from 'axios'
import QS from 'querystring';
const service= axios.create({
timeout:1000*200,
baseURL: 'http://localhost:59113',
})
// 设置post请求头
service.defaults.headers.post['Content-Type'] = 'application/json';
service.defaults.headers.put['Content-Type'] = 'application/json';
service.interceptors.request.use(function (config) {
const token='Bearer '+window.localStorage.getItem('token');
token && (config.headers.Authorization = token);
return config;
}, function (error) {
// Do something with request error
console.info(error);
return Promise.reject(error);
});
//
service.interceptors.response.use(function (response) {
// Do something with response data
console.warn(response)
return response.status==200 ? Promise.resolve(response.data):Promise.reject(response);
}, function (error) {
// Do something with response error
console.info(error);
// Message.info(error)
return Promise.reject(error);
});
service.get=(url,params)=>{
return axios.get(`${url}?${QS.stringify(params)}`)
}
export default service;
<template>
<div class="container">
<div class="menu">33</div>
<div class="main">
<Table :columns="columns" :data="list"></Table>
</div>
<div class="menu">
<Tabs value="db">
<TabPane label="数据库" name="db" class="db" >
<Input/>
<ul>
<li v-for="(t,i) in tables" :title="t.title" :class="{on:t.on}" @click="loadTable(t)">
<Icon type="md-cloud-upload" />
{{t.name}}
<Icon type="md-download" />
</li>
</ul>
</TabPane>
<TabPane label="程序" name="code">标签二的内容</TabPane>
<TabPane label="前端" name="ui">标签三的内容</TabPane>
</Tabs>
</div>
<div class="main">
<Card>
<div class="table">
<Form :model="dto" :label-width="80">
<Row>
<Col :span="6">
<FormItem label="备注">
<Input v-model="dto.title" placeholder="请输入表备注">
<Button slot="append">更新</Button>
</Input>
</FormItem>
</Col>
<Col :span="18">
<FormItem label="关联项">
<Input v-model="dto.note" placeholder="Enter something..."></Input>
</FormItem>
</Col>
</Row>
<Row>
<Col :span="6">
<FormItem label="表名">
<Input v-model="dto.name" placeholder="请输入表名"></Input>
</FormItem>
</Col>
<Col :span="6">
<FormItem label="类型">
<RadioGroup v-model="dto.type">
<Radio :label="0">业务表</Radio>
<Radio :label="1">自关联表(树形)</Radio>
</RadioGroup>
</FormItem>
</Col>
<Col :span="6">
<FormItem label="数据库">
<Tag v-if="dto.exist" type="success">已建表</Tag>
<Tag v-else >未建表</Tag>
</FormItem>
</Col>
<Col :span="6">
<FormItem label="数据量">
<Input v-model="dto.count" placeholder="数据量" disabled></Input>
</FormItem>
</Col>
</Row>
</Form>
</div>
<div class="utool">
<Button @click="code=true" type="primary">代码生成</Button>
<div class="btns">
<Checkbox v-model="hide">基础列</Checkbox>{{hide}}
<Checkbox v-model="base">基础字段</Checkbox>{{base}}
</div>
</div>
<Table :columns="cols" :data="fields" :max-height="600" border size="small">
<template slot="exist" slot-scope="{row}">{{row.exist}}</template>
<template slot="title" slot-scope="{row}">
<Input v-model="row.title" placeholder="请输入名称" size="small"></Input>
</template>
<template slot="name" slot-scope="{row}">{{row.name}}</template>
<template slot="type" slot-scope="{row}">{{row.type}}
<!-- ---{{row.vtype}} -->
</template>
<template slot="length" slot-scope="{row}">{{row.length}}</template>
<template slot="dot" slot-scope="{row}">{{row.dot}}</template>
<template slot="action" slot-scope="{row}">
<a class="edit">编辑</a>
<a class="edit">删除</a>
</template>
</Table>
<div class="utool">
<Button type="primary">添加字段</Button>
<Button type="primary">快速克隆</Button>
<div class="btns">
<Button type="success">更新库</Button>
</div>
</div>
</Card>
</div>
<Modal
v-model="code"
title="代码生成" fullscreen>
<p>Content of dialog</p>
<p>Content of dialog</p>
<p>Content of dialog</p>
</Modal>
</div>
</template>
<script>
export default {
data(){
data() {
return {
columns:[
dto: {
title: "",
name: "",
type: 0,
exist: false,
count:0,
note: ""
},
code:false,
hide:false,
base:true,
list:[],
columns: [
{
title:"序号",
type:"index"
title: "序号",
type: "index",
width:80,
hide:false
},
{
title:"字段",
key:"name"
title: "存在",
type: "exist",
width:80,
align:"center",
slot:"exist",
hide:false
}, {
title: "字段",
key: "name",
width:200,
slot:"name",
hide:false
},
{
title:"名称",
key:"title"
{
title: "名称",
key: "title",
slot:"title",
hide:false
},
{
title:"类型",
key:"type"
title: "类型",
key: "type",
width:200,
slot:"type",
hide:false
},
{
title:"长度",
key:"length"
title: "长度",
key: "length",
width:80,
slot:"length",
hide:this.hide
},
{
title:"类别",
key:"length"
title: "精度",
key: "dot",
width:80,
slot:"dot",
hide:this.hide
},
{
title: "非空",
key: "isNull",
width:80 ,
hide:this.hide
},
{
title:"类别",
key:"length"
title: "关联",
key: "link",
hide:false
},
{
title:"注释",
key:"note"
},
]
title: "操作",
slot: "action",
width:140,
hide:false
}
],
tables:[]
};
},
created(){
this.loadDb();
},
methods:{
loadDb(){
this.$http.get("http://localhost:59113",{
handler:"db"
}).then(r=>{
console.warn(r);
this.tables=r.data;
})
},
loadTable(table){
this.dto.name=table.name;
this.dto.title=table.title;
this.tables.map(u=>{
u.on=false;
})
table.on=true;
this.$http.get("http://localhost:59113/",{
handler:"table",
id:table.name
}).then(r=>{
console.warn(r);
this.list=r.data;
})
}
},
computed:{
cols(){
return this.columns.filter(u=>{
return !u.hide
})
},
fields(){
return this.list.filter(u=>{
if(this.base){
return true;
}
let keys='Id,CreationTime,CreatorUserId,LastModificationTime,LastModifierUserId,IsDeleted,DeleterUserId,DeletionTime'.split(",")
return keys.indexOf(u.name)==-1
})
}
}
}
};
</script>
<style lang="less">
.container{
.container {
display: flex;
height: 100%;
.menu{
.menu {
width: 300px;
border-right: 1px solid #ddd;
margin-right: 10px;
overflow: auto;
background-color: white;
.ivu-tabs{
height: 100%;
overflow-y: auto;
}
.db{
// padding: 10px;
overflow: auto;
ul >li{
line-height: 30px;
cursor: pointer;
padding-left: 20px;
}
ul>li:hover,.on{
background-color: aliceblue;
}
.on{
font-weight: bold;
}
}
}
.main{
.main {
flex: 1;
overflow: auto;
overflow: auto;
.utool{
line-height: 40px;
text-align: left;
width: 100%;
.btns{
float: right;
line-height: 40px;
}
}
}
.tools{
line-height: 60px;
}
}
</style>
<template>
<div>
<Grid :columns="cols" >
<template slot="header">
<h1>zheshibiaotou </h1>
</template>
<!-- <template slot="id" slot-scope="{row}">123=>{{row.id}}</template> -->
<template slot="id"> ++12 </template>
<!-- <template slot="name" slot-scope="p">
{{p.row.name}}++12
</template> -->
</Grid>
</div>
</template>
<script>
export default {
data () {
return {
cols:[{
title:"id",
key:"id",
slot:"id"
},
{
title:"name",
key:"name",
slot:"name"
}
],
}
},
components: {
}
}
</script>
<style>
</style>
import Vue from 'vue'
import ViewUI from 'view-design';
import Api from '@/libs/api';
import 'view-design/dist/styles/iview.css';
import Grid from '@/components/grid';
Vue.use(ViewUI);
Vue.prototype.$http=Api;
Vue.component("Grid",Grid)
\ 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