1、修改Mysql线程池逻辑
2、新增数据表信息查询接口 3、优化前端代码逻辑 4、新增业面业务功能提示信息窗口
This commit is contained in:
336
root/metadata/metatable/import.html
Normal file
336
root/metadata/metatable/import.html
Normal file
@@ -0,0 +1,336 @@
|
||||
<style>
|
||||
.importDev {
|
||||
padding-top: 5px;
|
||||
}
|
||||
.checkbox-inline:first-child{
|
||||
left: 10px;
|
||||
margin-right: 10px!important;
|
||||
}
|
||||
.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] {
|
||||
margin-top: 12px;
|
||||
}
|
||||
.hv {
|
||||
color: #ea644a!important;
|
||||
}
|
||||
.hv:focus,.hv:hover {
|
||||
color: #8b8a15!important;
|
||||
}
|
||||
.active>.hv{
|
||||
color: #8b8a15!important;
|
||||
}
|
||||
.tlist{
|
||||
height:100%; overflow: auto;
|
||||
}
|
||||
.tlist>li.active>a,
|
||||
.tlist>li.active>a:focus,
|
||||
.tlist>li.active>a:hover,
|
||||
.tlist>li>a:hover {
|
||||
background-color: #92b0cb;
|
||||
}
|
||||
</style>
|
||||
<!-- 对话框HTML -->
|
||||
<div class="importDev">
|
||||
<div class="info">
|
||||
<a @click="showInfo()" href="javascript:;"><i class="icon icon-info"></i></a>
|
||||
</div>
|
||||
|
||||
<!-- info -->
|
||||
<div class="modal fade" id="f-info">
|
||||
<div class="modal-dialog modal-lg">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">关闭</span></button>
|
||||
<h4 class="modal-title">功能概览</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>
|
||||
本地导入、从数据源导入流程相似,都是: 介质中读取可用业务实体 => 选择要导入的实体 => 保存实体到元数据MetaTable
|
||||
</p>
|
||||
<img src="../res/img/table_import_flow.png">
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="nav nav-tabs">
|
||||
<li class="active"><a href="###" data-target="#tab2Content1" data-toggle="tab">从本地上传</a></li>
|
||||
<li><a href="###" data-target="#tab2Content2" data-toggle="tab">从数据源导入</a></li>
|
||||
<li><a href="###" data-target="#tab2Content3" data-toggle="tab">其他</a></li>
|
||||
</ul>
|
||||
<div class="tab-content">
|
||||
<div class="tab-pane fade active in" id="tab2Content1">
|
||||
<div id="tableUploader" class="uploader">
|
||||
<!--<div class="uploader-message text-center">
|
||||
<div class="content"></div>
|
||||
<button type="button" class="close">×</button>
|
||||
</div>-->
|
||||
<table class="table table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th colspan="3">选择上传文件</th>
|
||||
<!--<th style="width: 100px">大小</th>
|
||||
<th style="width: 160px; text-align: center;">状态/操作</th>-->
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="uploader-files">
|
||||
<tr class="file template">
|
||||
<td style="width: 38px; padding: 3px"><div class="file-icon"></div></td>
|
||||
<td style="padding: 0">
|
||||
<div style="position: relative; padding: 8px;">
|
||||
<strong class="file-field"></strong>
|
||||
<div class="file-progress-bar"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><span class="file-size text-muted"></span></td>
|
||||
<!--<td class="actions text-right" style="padding: 0 4px;">
|
||||
<div class="file-status" data-toggle="tooltip" style="margin: 8px;"><i class="icon"></i> <span class="text"></span></div>
|
||||
<a data-toggle="tooltip" class="btn btn-link btn-download-file" target="_blank"><i class="icon icon-download-alt"></i></a>
|
||||
<button type="button" data-toggle="tooltip" class="btn btn-link btn-reset-file" title="Repeat"><i class="icon icon-repeat"></i></button>
|
||||
<button type="button" data-toggle="tooltip" class="btn btn-link btn-rename-file" title="Rename"><i class="icon icon-pencil"></i></button>
|
||||
<button type="button" data-toggle="tooltip" title="Remove" class="btn btn-link btn-delete-file"><i class="icon icon-trash text-danger"></i></button>
|
||||
</td>-->
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td colspan="4" style="padding: 4px 0">
|
||||
<div style="position: relative;">
|
||||
<div class="pull-right text-muted" style="margin-top: 5px;margin-right: 5px">
|
||||
<p v-show="sheet">数据文件已上传,下面<code class="text-danger">红色</code> 部分已经导入过的数据表</p>
|
||||
</div>
|
||||
<button type="button" class="btn btn-link uploader-btn-browse"><i class="icon icon-plus"></i> 选择数据文件</button>
|
||||
<button type="button" class="btn btn-link uploader-btn-start"><i class="icon icon-cloud-upload"></i> 上传文件</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
|
||||
<div class="row" v-show="sheet">
|
||||
<div class="col-xs-2 sheet-cell">
|
||||
<div style="padding-left: 10px;background-color: #ccc;width: 100%"> Excel-Sheet</div>
|
||||
<ul class="nav nav-tabs nav-stacked tlist" style="height: 100%">
|
||||
<li class="checkbox-inline clearfix" v-for="item in sheetArr" >
|
||||
<input type="checkbox"
|
||||
v-model="ck"
|
||||
:value="sheetData[item]['field']"
|
||||
:disabled="item=='表说明' || item=='表名称' || sheetData[item]['hv']==1"
|
||||
>
|
||||
<a :class="[{hv: sheetData[item]['hv']==1 }]" href="javascript:;" @click="sheet=item" data-target="#tab3Content1" data-toggle="tab" v-text="item"></a>
|
||||
</li>
|
||||
</ul>
|
||||
<p v-show="ck && ck.length">已选择 <code v-text="ck.length||0"></code> 个实体待导入</p>
|
||||
</div>
|
||||
<div class="col-xs-8">
|
||||
<div style="padding-left: 10px;background-color: #ccc;width: 100%"> Sheet-Detail</div>
|
||||
<div class="tab-content col-xs-9">
|
||||
<div class="tab-pane fade active in" id="">
|
||||
<table class="table-bordered" style="width: 100%">
|
||||
<caption class="" v-show="sheet && (sheet!='表说明' || sheet!='表名称')">
|
||||
表名称: <span v-text="metaTable.field"></span>,中文名:<span v-text="metaTable.comment"></span>
|
||||
</caption>
|
||||
<thead>
|
||||
<tr style="background-color: #f1f1f1" v-show="sheet && sheet!='表说明' && sheet!='表名称'">
|
||||
<th>字段名</th>
|
||||
<th>中文名</th>
|
||||
<th>数据类型</th>
|
||||
<th>输入类型</th>
|
||||
<th>附加属性</th>
|
||||
<th>备注</th>
|
||||
</tr>
|
||||
<tr style="background-color: #f1f1f1" v-show="sheet && (sheet=='表说明' || sheet=='表名称')">
|
||||
<th>A</th>
|
||||
<th>B</th>
|
||||
<th>C</th>
|
||||
<th>D</th>
|
||||
<th>E</th>
|
||||
<th>F</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="(item, index) in metaTable.items">
|
||||
<td v-text="item.field"></td>
|
||||
<td v-text="item.label"></td>
|
||||
<td v-text="item.type"></td>
|
||||
<td v-text="item.inType"></td>
|
||||
<td v-text="item.inExt"></td>
|
||||
<td v-text="item.remark"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--<div class="col-xs-2">
|
||||
<div style="padding-left: 10px;background-color: #ccc;width: 100%"> Checked-Sheet</div>
|
||||
<ul class="nav nav-tabs nav-stacked tlist" style="height: 100%">
|
||||
<li class="checkbox-inline clearfix" v-for="item in ck" >
|
||||
<a href="javascript:;" @click="sheet=getSheetName(item)" data-target="#tab3Content1" data-toggle="tab" v-text="getSheetName(item)"></a>
|
||||
</li>
|
||||
</ul>
|
||||
<p v-show="ck && ck.length">已选择 <code v-text="ck.length||0"></code> 个实体待导入</p>
|
||||
</div>-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="tab2Content2">
|
||||
|
||||
<div class="form-group">
|
||||
<label class="col-sm-1">数据源</label>
|
||||
<div class="col-md-2 col-sm-10">
|
||||
<select class="form-control">
|
||||
<option v-for="item in dbPlats" :value="item" v-text="item.field"></option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="clearfix"></div>
|
||||
|
||||
<!--<p>1、选择数据源</p>
|
||||
<p>2、选择查询到的数据源实体</p>
|
||||
<p>3、导入选中的实体</p>-->
|
||||
</div>
|
||||
<div class="tab-pane fade" id="tab2Content3">
|
||||
<p>其他一些定制的特殊格式的 实体数据形式</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<button @click="ck=[]" type="button" class="btn btn-default" data-dismiss="modal">取消选择</button>
|
||||
<button @click="back()" type="button" class="btn btn-default" data-dismiss="modal">取消</button>
|
||||
<button @click="saveSheet()" type="button" class="btn btn-primary">确定</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
let {dbList} = plat
|
||||
|
||||
var vm = new Vue({
|
||||
el: ".importDev",
|
||||
data: {
|
||||
filePath: '',
|
||||
importStatus: false,
|
||||
sheetData: {}, // {name1: {}}
|
||||
sheetArr: [], // [name1,name2,]
|
||||
sheet: '',
|
||||
ck: [],
|
||||
metaTable: {items: []},
|
||||
|
||||
// 从数据源导入实体
|
||||
dbPlats: red.getData('dbPlats'),
|
||||
dbPlatId: '',
|
||||
|
||||
|
||||
cache: {
|
||||
local: {
|
||||
sheetData: {},
|
||||
sheetArr: [],
|
||||
sheet: '',
|
||||
ck: [],
|
||||
metaTable: {items: []},
|
||||
},
|
||||
dbPlat: {}
|
||||
},
|
||||
|
||||
},
|
||||
watch: {
|
||||
sheetData: function (v) {
|
||||
var arr = [];
|
||||
var ck = [];
|
||||
for (k in v) {
|
||||
let field = v[k]['field'];
|
||||
if (k!='表说明' && k!='表名称' && v[k]['hv'] != 1) {
|
||||
ck.push(field);
|
||||
}
|
||||
arr.push(k);
|
||||
}
|
||||
this.sheetArr = arr;
|
||||
this.ck = ck;
|
||||
if (arr.length > 0) {
|
||||
this.sheet = arr[0]
|
||||
} else {
|
||||
this.sheet = "";
|
||||
}
|
||||
},
|
||||
sheet: function (v) {
|
||||
this.metaTable = this.sheetData[v];
|
||||
console.log(this.metaTable)
|
||||
if (this.metaTable['load'] != 1) {
|
||||
this.loadSheetData();
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadSheets: function(filePath) {
|
||||
if(!filePath) {
|
||||
return false;
|
||||
}
|
||||
red.post("/file/data",{filePath: filePath}, function (json) {
|
||||
console.log(json)
|
||||
vm.sheetData = json;
|
||||
})
|
||||
},
|
||||
loadSheetData: function() {
|
||||
let sheetName = this.sheet;
|
||||
red.post("/file/sheet_data",{filePath: this.filePath, sheetName: sheetName}, function (json) {
|
||||
json["hv"] = vm.sheetData[sheetName]["hv"];
|
||||
json["load"] = 1;
|
||||
vm.sheetData[sheetName] = json;
|
||||
if (vm.sheet == sheetName) {
|
||||
vm.metaTable = json;
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
saveSheet: function () {
|
||||
if (!this.ck || this.ck.length == 0) {
|
||||
red.showMsg({msg: "请选择导入数据", type:"danger", placement: "top"});
|
||||
return false;
|
||||
}
|
||||
red.post("/file/import_metatable", {sheetArr: JSON.stringify(this.ck), filePath: this.filePath});
|
||||
},
|
||||
getSheetName: function (tableName) {
|
||||
for(k in this.sheetData) {
|
||||
if (this.sheetData[k]['field'] == tableName) {
|
||||
return k;
|
||||
}
|
||||
}
|
||||
//return "";
|
||||
},
|
||||
back() {
|
||||
$("#main").load('/metadata/metatable/metaTable.html')
|
||||
},
|
||||
showInfo() {
|
||||
$('#f-info').modal({moveable: true})
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
// 初始化文件上传组件
|
||||
$('#tableUploader').uploader({
|
||||
url: '/upload/x',
|
||||
responseHandler: function (res, file) {
|
||||
var file = JSON.parse(res.response)["body"][0];
|
||||
vm.loadSheets(file["filePath"]);
|
||||
vm.importStatus = true;
|
||||
vm.filePath = file["filePath"];
|
||||
},
|
||||
filters: {
|
||||
mime_types: [
|
||||
{title: 'Excel文件', extensions: 'xls,xlsx'},
|
||||
],
|
||||
prevent_duplicates: true
|
||||
}
|
||||
});
|
||||
|
||||
dbList().then(res => this.dbPlats = res.rows)
|
||||
|
||||
|
||||
var h = document.documentElement.clientHeight || document.body.clientHeight;
|
||||
$(".sheet-cell").attr("style", "height:" + (h - 265) + "px;margin-bottom:20px;");
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
@@ -12,6 +12,10 @@
|
||||
<option v-for="item in tables" :value="item.name"> {{item.name}} [{{item.comment}}]</option>
|
||||
</select>
|
||||
|
||||
<span class="input-group-btn pull-left" style="padding-left: 20px">
|
||||
<button @click="loadImportPage()" :class="['btn']" type="button"> 导入实体</button>
|
||||
</span>
|
||||
|
||||
<span class="input-group-btn">
|
||||
<button @click="status=2" :class="['btn',{'btn-primary':status==2}]" type="button"> 字段编辑</button>
|
||||
</span>
|
||||
@@ -283,7 +287,8 @@
|
||||
</row>
|
||||
|
||||
<script>
|
||||
let { getTableList,getTableDetail } = meta;
|
||||
let {getTableList, getTableDetail} = meta;
|
||||
let {showOk} = red
|
||||
|
||||
var vm = new Vue({
|
||||
el: ".meta-list",
|
||||
@@ -493,30 +498,30 @@
|
||||
red.postX("/meta/itemsort", {
|
||||
serviceKey: vm.table,
|
||||
items: JSON.stringify(vm.itemSort)
|
||||
});
|
||||
}).then(() => showOk())
|
||||
}
|
||||
|
||||
else if (vm.status == 2 && vm.itemEdit.length > 0) {
|
||||
red.postX("/meta/itemupdate", {
|
||||
serviceKey: vm.table,
|
||||
items: JSON.stringify(vm.itemEdit)
|
||||
});
|
||||
}).then(() => showOk())
|
||||
}
|
||||
else if (vm.status == 3 || vm.status == 4 || vm.status == 5) {
|
||||
/*else if (vm.status == 3 || vm.status == 4 || vm.status == 5) {
|
||||
var urls = {3: "/meta/exportsort", 4: "/meta/importsort", 5: "/meta/showsort"};
|
||||
var items = {3: vm.meta.exports, 4: vm.meta.imports, 5: vm.meta.shows};
|
||||
|
||||
red.post(urls[vm.status], {
|
||||
serviceKey: vm.table,
|
||||
items: JSON.stringify(items[vm.status])
|
||||
});
|
||||
}
|
||||
})
|
||||
}*/
|
||||
|
||||
else if (vm.status == 5) {
|
||||
red.post("/meta/showsort", {
|
||||
serviceKey: vm.table,
|
||||
items: JSON.stringify(vm.meta.shows)
|
||||
});
|
||||
}).then(() => showOk())
|
||||
}
|
||||
|
||||
else if (vm.status == 6) {
|
||||
@@ -524,13 +529,13 @@
|
||||
red.post("/meta/filter_update", {
|
||||
serviceKey: vm.table,
|
||||
filters: JSON.stringify(vm.filters)
|
||||
});
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
else if (vm.status == 7) {
|
||||
console.log(vm.row);
|
||||
red.postX("/meta/dbplatupdate", {metaTable: JSON.stringify(vm.row)})
|
||||
red.postX("/meta/dbplatupdate", {metaTable: JSON.stringify(vm.row)}).then(() => showOk())
|
||||
}
|
||||
|
||||
else {
|
||||
@@ -546,6 +551,9 @@
|
||||
return vm.oldItems[i].label;
|
||||
}
|
||||
}
|
||||
},
|
||||
loadImportPage() {
|
||||
$("#main").load('/metadata/metatable/import.html')
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user