动态计算展示宽度
This commit is contained in:
File diff suppressed because one or more lines are too long
@@ -1,2 +1,2 @@
|
||||
!function(e){function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}var r=window.webpackJsonp;window.webpackJsonp=function(t,c,a){for(var u,i,f,l=0,s=[];l<t.length;l++)i=t[l],o[i]&&s.push(o[i][0]),o[i]=0;for(u in c)Object.prototype.hasOwnProperty.call(c,u)&&(e[u]=c[u]);for(r&&r(t,c,a);s.length;)s.shift()();if(a)for(l=0;l<a.length;l++)f=n(n.s=a[l]);return f};var t={},o={2:0};n.e=function(e){function r(){u.onerror=u.onload=null,clearTimeout(i);var n=o[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),o[e]=void 0)}var t=o[e];if(0===t)return new Promise(function(e){e()});if(t)return t[2];var c=new Promise(function(n,r){t=o[e]=[n,r]});t[2]=c;var a=document.getElementsByTagName("head")[0],u=document.createElement("script");u.type="text/javascript",u.charset="utf-8",u.async=!0,u.timeout=12e4,n.nc&&u.setAttribute("nonce",n.nc),u.src=n.p+""+e+".js?"+{0:"ae1e13bde53c50facad6",1:"0a0403eb1820498dc9bc"}[e];var i=setTimeout(r,12e4);return u.onerror=u.onload=r,a.appendChild(u),c},n.m=e,n.c=t,n.i=function(e){return e},n.d=function(e,r,t){n.o(e,r)||Object.defineProperty(e,r,{configurable:!1,enumerable:!0,get:t})},n.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(r,"a",r),r},n.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},n.p="",n.oe=function(e){throw console.error(e),e}}([]);
|
||||
//# sourceMappingURL=doc-db-manifest.js.map?c1844f50fc431da7b290
|
||||
!function(e){function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}var r=window.webpackJsonp;window.webpackJsonp=function(t,c,u){for(var a,i,f,l=0,s=[];l<t.length;l++)i=t[l],o[i]&&s.push(o[i][0]),o[i]=0;for(a in c)Object.prototype.hasOwnProperty.call(c,a)&&(e[a]=c[a]);for(r&&r(t,c,u);s.length;)s.shift()();if(u)for(l=0;l<u.length;l++)f=n(n.s=u[l]);return f};var t={},o={2:0};n.e=function(e){function r(){a.onerror=a.onload=null,clearTimeout(i);var n=o[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),o[e]=void 0)}var t=o[e];if(0===t)return new Promise(function(e){e()});if(t)return t[2];var c=new Promise(function(n,r){t=o[e]=[n,r]});t[2]=c;var u=document.getElementsByTagName("head")[0],a=document.createElement("script");a.type="text/javascript",a.charset="utf-8",a.async=!0,a.timeout=12e4,n.nc&&a.setAttribute("nonce",n.nc),a.src=n.p+""+e+".js?"+{0:"a4e51a5424d256972972",1:"0a0403eb1820498dc9bc"}[e];var i=setTimeout(r,12e4);return a.onerror=a.onload=r,u.appendChild(a),c},n.m=e,n.c=t,n.i=function(e){return e},n.d=function(e,r,t){n.o(e,r)||Object.defineProperty(e,r,{configurable:!1,enumerable:!0,get:t})},n.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(r,"a",r),r},n.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},n.p="",n.oe=function(e){throw console.error(e),e}}([]);
|
||||
//# sourceMappingURL=doc-db-manifest.js.map?852703c813fad5db2b75
|
||||
@@ -8,7 +8,7 @@
|
||||
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="text/javascript" src="doc-db-manifest.js?c1844f50fc431da7b290"></script><script type="text/javascript" src="doc-db-vendor.js?0a0403eb1820498dc9bc"></script><script type="text/javascript" src="doc-db-index.js?ae1e13bde53c50facad6"></script></body>
|
||||
<script type="text/javascript" src="doc-db-manifest.js?852703c813fad5db2b75"></script><script type="text/javascript" src="doc-db-vendor.js?0a0403eb1820498dc9bc"></script><script type="text/javascript" src="doc-db-index.js?a4e51a5424d256972972"></script></body>
|
||||
|
||||
</html>
|
||||
|
||||
|
||||
@@ -25,11 +25,11 @@
|
||||
{{executeError}}
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-table :data="executeResultList" stripe border style="width: 100%; margin-bottom: 5px;" v-loading="sqlExecuting">
|
||||
<el-table :data="executeResultList" stripe border style="width: 100%; margin-bottom: 5px;" class="execute-result-table" v-loading="sqlExecuting" height="600">
|
||||
<el-table-column width="60px" v-if="executeResultCols.length > 0">
|
||||
<template slot-scope="scope">{{scope.row._index}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-for="item in executeResultCols" :prop="item.prop" :label="item.prop">
|
||||
<el-table-column v-for="item in executeResultCols" :prop="item.prop" :label="item.prop" :width="item.width">
|
||||
<template slot-scope="scope">
|
||||
<el-input :value="scope.row[item.prop]" :readonly="true"></el-input>
|
||||
</template>
|
||||
@@ -68,6 +68,7 @@
|
||||
</el-tabs>
|
||||
</div>
|
||||
</el-drawer>
|
||||
<span id="widthCalculate" style="visibility: hidden; white-space: nowrap;"></span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -196,8 +197,17 @@
|
||||
var dataList = resultData.result || [];
|
||||
var executeResultCols = [];
|
||||
if (dataList.length > 0) {
|
||||
for (var key in dataList[0]) {
|
||||
executeResultCols.push({prop: key});
|
||||
var propData = dataList[0];
|
||||
for (var key in propData) {
|
||||
// 动态计算宽度~自己想的一个方法,666
|
||||
document.getElementById("widthCalculate").innerText = key;
|
||||
var width1 = document.getElementById("widthCalculate").offsetWidth;
|
||||
document.getElementById("widthCalculate").innerText = propData[key];
|
||||
var width2 = document.getElementById("widthCalculate").offsetWidth;
|
||||
var width = (width1 > width2) ? width1 : width2;
|
||||
width = (width < 60) ? 60 : width;
|
||||
width = (width > 200) ? 200 : width;
|
||||
executeResultCols.push({prop: key, width: width + 20});
|
||||
}
|
||||
for (var i = 0; i < dataList.length; i++) {
|
||||
dataList[i]._index = i + 1;
|
||||
@@ -340,7 +350,7 @@
|
||||
.data-executor-vue .el-table td, .el-table th{
|
||||
padding: 6px 0;
|
||||
}
|
||||
.data-executor-vue .el-input__inner{
|
||||
.data-executor-vue .execute-result-table .el-input__inner{
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
padding: 0 5px;
|
||||
|
||||
Reference in New Issue
Block a user