320 lines
10 KiB
HTML
320 lines
10 KiB
HTML
{extend name="common/base"/}
|
|
{block name="style"}
|
|
<link rel="stylesheet" href="{__CSS__}/user.css?v={:get_config('webconfig.version')}" media="all">
|
|
{/block}
|
|
<!-- 主体 -->
|
|
{block name="body"}
|
|
{include file="common/header" nav='info' /}
|
|
<div class="user">
|
|
<div class="user-home"><a href="/">首页</a> - 个人中心</div>
|
|
<div class="user-box clearfix">
|
|
<div class="l user-menu">
|
|
{include file="common/usermenu" nav='info' /}
|
|
</div>
|
|
<div class="r user-right">
|
|
<div id="dataFile" class="data-topic">
|
|
<table cellpadding="0" cellspacing="0">
|
|
<tr>
|
|
<th colspan="4">
|
|
<div class="l">
|
|
<h3>{$topic.title}</h3>
|
|
</div>
|
|
<div class="r"><span class="upload-post-btn table-add" data-id="{$topic.id}">添加数据表</span>
|
|
</div>
|
|
</th>
|
|
</tr>
|
|
<tr>
|
|
<th width="15%">表名</th>
|
|
<th width="15%">表注释</th>
|
|
<th width="45%">字段</th>
|
|
<th width="25%">操作</th>
|
|
</tr>
|
|
{empty name="tables"}
|
|
<tr>
|
|
<td colspan="4">
|
|
<div style="text-align:center; color:#999; font-size: 12px;">暂无数据表，<a href="javascript:;"
|
|
class="table-add" style="color: #4385F5;">去新建</a></div>
|
|
</td>
|
|
</tr>
|
|
{/empty}
|
|
{volist name="tables" id="vo"}
|
|
<tr>
|
|
<td>{$vo.table_name}</td>
|
|
<td>{$vo.title}</td>
|
|
<td>
|
|
<ul>
|
|
{volist name="vo.columns" id="voo"}
|
|
<li data-id="{$vo.id}">● {$voo.name}<span
|
|
class="columns-span">[注释：{$voo.title}，数据类型：{$voo.type}]</span></li>
|
|
{/volist}
|
|
</ul>
|
|
</td>
|
|
<td style="text-align: center;">
|
|
<a href="javascript:;" class="file-add" data-uid="1" data-table="{$vo.table_name}" data-columns="{$vo.columns_json}">上传数据</a>
|
|
<a href="javascript:;" class="table-view">预览数据</a>
|
|
<a href="javascript:;" class="table-edit" data-id="{$vo.id}">编辑</a>
|
|
<a href="javascript:;" class="table-del" data-id="{$vo.id}">删除</a>
|
|
</td>
|
|
</tr>
|
|
{/volist}
|
|
</table>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/block}
|
|
<!-- /主体 -->
|
|
|
|
<!-- 脚本 -->
|
|
{block name="script"}
|
|
<script src="https://cdn.bootcdn.net/ajax/libs/xlsx/0.16.8/xlsx.core.min.js"></script>
|
|
<script type="text/javascript" src="{__JS__}/excel.upload.js"></script>
|
|
<script>
|
|
var tid = '{$topic.id}';//0.13.5
|
|
var user_id = '{$bi_user.id}';
|
|
var user_salt = '{$bi_user.salt}';
|
|
//远程创建bi_table
|
|
function createBiTable(table_name,table_schema){
|
|
var table ={
|
|
"user_id": user_salt+user_id,
|
|
"table_name": table_name,
|
|
"table_schema": "CREATE TABLE cehsitablea (d DateTime, "+table_schema+")ENGINE = MergeTree PARTITION BY toYYYYMM(d) ORDER BY d;"
|
|
};
|
|
$.ajax({
|
|
url: "http://i.slambase.cn:8081/v1/table",
|
|
data: JSON.stringify(table),
|
|
type: 'POST',
|
|
contentType: "application/json;charset=UTF-8",
|
|
success: function (res) {
|
|
console.log(res);
|
|
if (res.code == 200) {
|
|
layer.msg('操作成功');
|
|
window.location.reload();
|
|
}
|
|
}
|
|
})
|
|
}
|
|
|
|
|
|
|
|
function isCheck(val, type) {
|
|
if (val == type) {
|
|
return 'checked'
|
|
}
|
|
else {
|
|
return '';
|
|
}
|
|
}
|
|
|
|
function editTable(id, data) {
|
|
var tableItem = '';
|
|
for (var i = 0; i < data.columns.length; i++) {
|
|
var index = new Date().getTime() + i;
|
|
tableItem += '<tr class="table-edit-item" data-index="' + index + '">\
|
|
<td><input type="text" class="bi-input" name="columns_name" value="'+ data.columns[i].name + '" autocomplete="off" placeholder="字段名，如:name"></td>\
|
|
<td><input type="text" class="bi-input" name="columns_title" value="'+ data.columns[i].title + '" autocomplete="off" placeholder="字段注释，如:用户名"></td>\
|
|
<td><label><input type="radio" name="columns_type'+ index + '" value="String" ' + isCheck(data.columns[i].type, 'string') + '>文本</label>\
|
|
<label><input type="radio" name="columns_type'+ index + '" value="Int64" ' + isCheck(data.columns[i].type, 'int') + '>整数</label>\
|
|
<label><input type="radio" name="columns_type'+ index + '" value="Float64" ' + isCheck(data.columns[i].type, 'float') + '>小数</label>\
|
|
<label><input type="radio" name="columns_type'+ index + '" value="Date" ' + isCheck(data.columns[i].type, 'date') + '>日期</label></td>\
|
|
<td class="table-del">删除</td>\
|
|
</tr>';
|
|
}
|
|
layer.open({
|
|
title: '数据表',
|
|
type: 1,
|
|
area: ['800px', '560px'],
|
|
btn: ['提交保存'],
|
|
btnAlign: 'c',
|
|
yes: function(index, layero){
|
|
var id = $('[name="table_id"]').val();
|
|
var table_name = $('[name="table_name"]').val();
|
|
var title = $('[name="title"]').val();
|
|
if (table_name == '') {
|
|
layer.msg('请完善数据表名');
|
|
return false;
|
|
}
|
|
if (/^[a-z\_]*$/g.test(table_name) == false) {
|
|
layer.msg('数据表名只能是小写字母和下划线"_"的组合');
|
|
return false;
|
|
}
|
|
if (title == '') {
|
|
layer.msg('请完善数据表注释');
|
|
return false;
|
|
}
|
|
var item = $('.table-edit-item'), itemArray = [], table_schema = '', flat = 0;
|
|
for (var i = 0; i < item.length; i++) {
|
|
var idx = $(item[i]).data('index');
|
|
var columns_name = $(item[i]).find('[name="columns_name"]').val();
|
|
var columns_title = $(item[i]).find('[name="columns_title"]').val();
|
|
var columns_type = $("input[name='columns_type" + idx + "']:checked").val();
|
|
if (columns_name == '') {
|
|
layer.msg('请完善第' + (i + 1) + '行的字段名');
|
|
flat = 1;
|
|
break;
|
|
}
|
|
if (/^[a-z\_]*$/g.test(columns_name) == false) {
|
|
layer.msg('第' + (i + 1) + '行的字段名只能是小写字母和下划线"_"的组合');
|
|
return false;
|
|
}
|
|
if (columns_title == '') {
|
|
layer.msg('请完善第' + (i + 1) + '行的字段注释');
|
|
flat = 1;
|
|
break;
|
|
}
|
|
if (!columns_type) {
|
|
layer.msg('请完善第' + (i + 1) + '行的字段类型');
|
|
flat = 1;
|
|
break;
|
|
}
|
|
if (columns_name != '' && columns_title != '' && columns_type) {
|
|
itemArray.push({
|
|
'name': columns_name,
|
|
'title': columns_title,
|
|
'type': columns_type
|
|
})
|
|
if(i==0){
|
|
table_schema+=columns_name+' '+columns_type;
|
|
}else{
|
|
table_schema+=','+columns_name+' '+columns_type;
|
|
}
|
|
}
|
|
}
|
|
if (flat == 0) {
|
|
$.ajax({
|
|
url: '/home/bi/table_add',
|
|
data: { 'id': id, 'tid': tid, 'title': title, 'table_name': table_name, 'item': itemArray },
|
|
type: 'post',
|
|
success: function (res) {
|
|
if (res.code == 1) {
|
|
createBiTable(table_name,table_schema);
|
|
}
|
|
else {
|
|
layer.msg(res.msg);
|
|
}
|
|
}
|
|
})
|
|
}
|
|
},
|
|
content: '<div class="table-box" id="tableBox">\
|
|
<form id="tableForm">\
|
|
<input type="hidden" name="table_id" value="'+ data.id + '">\
|
|
<p class="table-edit-title">表信息</p>\
|
|
表名：<input type="text" class="bi-input" name="table_name" value="'+ data.table_name + '" autocomplete="off" placeholder="表名，如:user">\
|
|
表注释：<input type="text" class="bi-input" name="title" value="'+ data.title + '" autocomplete="off" placeholder="表注释，如:用户表">\
|
|
<p class="table-edit-title">表字段</p>\
|
|
<table id="tableItem"><tr><th>字段名</th><th>字段注释</th><th>字段类型</th><th>操作</th></tr>'+ tableItem + '</table></form>\
|
|
<div class="table-edit-btn">\
|
|
<span class="upload-post-btn table-add">+新增字段</span>\
|
|
</div>\
|
|
</div>',
|
|
success: function (layero, index) {
|
|
$('#tableBox').on('click', '.table-add', function () {
|
|
var idx = new Date().getTime();
|
|
var item = '<tr class="table-edit-item" data-index="' + idx + '">\
|
|
<td><input type="text" class="bi-input" name="columns_name" value="" autocomplete="off" placeholder="字段名，如:name"></td>\
|
|
<td><input type="text" class="bi-input" name="columns_title" value="" autocomplete="off" placeholder="字段注释，如:用户名"></td>\
|
|
<td><label><input type="radio" name="columns_type'+ idx + '" value="String">文本</label>\
|
|
<label><input type="radio" name="columns_type'+ idx + '" value="Int64">整数</label>\
|
|
<label><input type="radio" name="columns_type'+ idx + '" value="Float64">小数</label>\
|
|
<label><input type="radio" name="columns_type'+ idx + '" value="Date">日期</label></td>\
|
|
<td><span class="table-del">删除</span></td>\
|
|
</tr>';
|
|
$('#tableItem').append(item);
|
|
})
|
|
|
|
$('#tableBox').on('click', '.table-del', function () {
|
|
var tr = $('#tableItem').find('tr'), that = $(this);
|
|
if (tr.length < 4) {
|
|
layer.msg('至少保留两个字段');
|
|
return false;
|
|
}
|
|
layer.confirm('确定要删除该字段吗?', {
|
|
icon: 3, title: '提示'
|
|
}, function (index) {
|
|
that.parents('tr').remove();
|
|
layer.close(index);
|
|
});
|
|
})
|
|
}
|
|
});
|
|
}
|
|
|
|
|
|
//增加数据表
|
|
$('#dataFile').on('click', '.table-add', function () {
|
|
var id = $(this).data('id');
|
|
var data = {
|
|
id: 0,
|
|
table_name: '',
|
|
title: '',
|
|
columns: [{
|
|
name: '',
|
|
title: '',
|
|
type: ''
|
|
}, {
|
|
name: '',
|
|
title: '',
|
|
type: ''
|
|
}]
|
|
}
|
|
editTable(id, data);
|
|
})
|
|
|
|
//编辑数据表
|
|
$('#dataFile').on('click', '.table-edit', function () {
|
|
var id = $(this).data('id');
|
|
$.ajax({
|
|
url: "/home/bi/table_detail",
|
|
data: {
|
|
id: id
|
|
},
|
|
success: function (res) {
|
|
if (res.code == 1) {
|
|
var data = res.data;
|
|
editTable(id, data);
|
|
}
|
|
}
|
|
})
|
|
})
|
|
|
|
|
|
//删除数据表
|
|
$('#dataFile').on('click', '.table-del', function () {
|
|
var id = $(this).data('id');
|
|
layer.confirm('删除该数据表，该数据表包含的数据也会被删除，确定要删除吗?', {
|
|
icon: 3,
|
|
title: '提示'
|
|
}, function (index) {
|
|
$.ajax({
|
|
url: "/home/bi/table_delete",
|
|
data: {
|
|
id: id
|
|
},
|
|
success: function (res) {
|
|
if (res.code == 1) {
|
|
layer.msg('操作成功');
|
|
window.location.reload();
|
|
}
|
|
}
|
|
})
|
|
layer.close(index);
|
|
});
|
|
});
|
|
|
|
//上传表格
|
|
$('#dataFile').on('click', '.file-add', function () {
|
|
var uid = $(this).data('uid');
|
|
var table = $(this).data('table');
|
|
var columns = $(this).data('columns');
|
|
uploadExcel({
|
|
data: {'user_id':'ceshi','table_name':'ceshitable','table_schema':columns},
|
|
success: function (file, info) {
|
|
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
{/block}
|
|
<!-- /脚本 --> |