Skip to content

A
Admin
Commit 1ad6cc51 authored by 周远喜's avatar 周远喜
Browse files
Options

代码ok

parent 7693dddb
Show whitespace changes
Inline Side-by-side
Showing with 407 additions and 33 deletions
components/grid.vue 0 → 100644
View file @ 1ad6cc51
<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
layouts/default.vue
View file @ 1ad6cc51
<template> <template>
<Layout class="layout"> <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> </Header>
<Content> <Content>
<nuxt /> <nuxt />
...@@ -16,5 +31,13 @@ export default { ...@@ -16,5 +31,13 @@ export default {
<style lang="less" > <style lang="less" >
.layout{ .layout{
height: 100vh; height: 100vh;
.header{
background-color:white;
padding: 0;
.layout-nav{
text-align: right;
float:right;
}
}
} }
</style> </style>
\ No newline at end of file
libs/api.js 0 → 100644
View file @ 1ad6cc51
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;
pages/index.vue
View file @ 1ad6cc51
<template> <template>
<div class="container"> <div class="container">
<div class="menu">33</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"> <div class="main">
<Table :columns="columns" :data="list"></Table> <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> </div>
<Modal
v-model="code"
title="代码生成" fullscreen>
<p>Content of dialog</p>
<p>Content of dialog</p>
<p>Content of dialog</p>
</Modal>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data(){ data() {
return { return {
columns:[ dto: {
title: "",
name: "",
type: 0,
exist: false,
count:0,
note: ""
},
code:false,
hide:false,
base:true,
list:[],
columns: [
{ {
title:"序号", title: "序号",
type:"index" type: "index",
width:80,
hide:false
}, },
{ {
title:"字段", title: "存在",
key:"name" type: "exist",
width:80,
align:"center",
slot:"exist",
hide:false
}, {
title: "字段",
key: "name",
width:200,
slot:"name",
hide:false
}, },
{ {
title:"名称", title: "名称",
key:"title" key: "title",
slot:"title",
hide:false
}, },
{ {
title:"类型", title: "类型",
key:"type" key: "type",
width:200,
slot:"type",
hide:false
}, },
{ {
title:"长度", title: "长度",
key:"length" key: "length",
width:80,
slot:"length",
hide:this.hide
}, },
{ {
title:"类别", title: "精度",
key:"length" key: "dot",
width:80,
slot:"dot",
hide:this.hide
}, },
{ {
title:"类别", title: "非空",
key:"length" key: "isNull",
width:80 ,
hide:this.hide
}, },
{ {
title:"注释", title: "关联",
key:"note" key: "link",
hide:false
}, },
] {
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> </script>
<style lang="less"> <style lang="less">
.container{ .container {
display: flex; display: flex;
height: 100%; height: 100%;
.menu{ .menu {
width: 300px; width: 300px;
border-right: 1px solid #ddd; border-right: 1px solid #ddd;
margin-right: 10px; margin-right: 10px;
overflow: auto; 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; 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> </style>
pages/test.vue 0 → 100644
View file @ 1ad6cc51
<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>
plugins/iview.js
View file @ 1ad6cc51
import Vue from 'vue' import Vue from 'vue'
import ViewUI from 'view-design'; import ViewUI from 'view-design';
import Api from '@/libs/api';
import 'view-design/dist/styles/iview.css'; import 'view-design/dist/styles/iview.css';
import Grid from '@/components/grid';
Vue.use(ViewUI); 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