Skip to content

S
saas-manage
Commit 7db8bd4e by wq
Options

8.16

parent 14163a6f
Showing with 2097 additions and 388 deletions
public/iconfont/demo.css 0 → 100644
/* Logo 字体 */
@font-face {
font-family: "iconfont logo";
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
}
.logo {
font-family: "iconfont logo";
font-size: 160px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* tabs */
.nav-tabs {
position: relative;
}
.nav-tabs .nav-more {
position: absolute;
right: 0;
bottom: 0;
height: 42px;
line-height: 42px;
color: #666;
}
#tabs {
border-bottom: 1px solid #eee;
}
#tabs li {
cursor: pointer;
width: 100px;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 16px;
border-bottom: 2px solid transparent;
position: relative;
z-index: 1;
margin-bottom: -1px;
color: #666;
}
#tabs .active {
border-bottom-color: #f00;
color: #222;
}
.tab-container .content {
display: none;
}
/* 页面布局 */
.main {
padding: 30px 100px;
width: 960px;
margin: 0 auto;
}
.main .logo {
color: #333;
text-align: left;
margin-bottom: 30px;
line-height: 1;
height: 110px;
margin-top: -50px;
overflow: hidden;
*zoom: 1;
}
.main .logo a {
font-size: 160px;
color: #333;
}
.helps {
margin-top: 40px;
}
.helps pre {
padding: 20px;
margin: 10px 0;
border: solid 1px #e7e1cd;
background-color: #fffdef;
overflow: auto;
}
.icon_lists {
width: 100% !important;
overflow: hidden;
*zoom: 1;
}
.icon_lists li {
width: 100px;
margin-bottom: 10px;
margin-right: 20px;
text-align: center;
list-style: none !important;
cursor: default;
}
.icon_lists li .code-name {
line-height: 1.2;
}
.icon_lists .icon {
display: block;
height: 100px;
line-height: 100px;
font-size: 42px;
margin: 10px auto;
color: #333;
-webkit-transition: font-size 0.25s linear, width 0.25s linear;
-moz-transition: font-size 0.25s linear, width 0.25s linear;
transition: font-size 0.25s linear, width 0.25s linear;
}
.icon_lists .icon:hover {
font-size: 100px;
}
.icon_lists .svg-icon {
/* 通过设置 font-size 来改变图标大小 */
width: 1em;
/* 图标和文字相邻时，垂直对齐 */
vertical-align: -0.15em;
/* 通过设置 color 来改变 SVG 的颜色/fill */
fill: currentColor;
/* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
normalize.css 中也包含这行 */
overflow: hidden;
}
.icon_lists li .name,
.icon_lists li .code-name {
color: #666;
}
/* markdown 样式 */
.markdown {
color: #666;
font-size: 14px;
line-height: 1.8;
}
.highlight {
line-height: 1.5;
}
.markdown img {
vertical-align: middle;
max-width: 100%;
}
.markdown h1 {
color: #404040;
font-weight: 500;
line-height: 40px;
margin-bottom: 24px;
}
.markdown h2,
.markdown h3,
.markdown h4,
.markdown h5,
.markdown h6 {
color: #404040;
margin: 1.6em 0 0.6em 0;
font-weight: 500;
clear: both;
}
.markdown h1 {
font-size: 28px;
}
.markdown h2 {
font-size: 22px;
}
.markdown h3 {
font-size: 16px;
}
.markdown h4 {
font-size: 14px;
}
.markdown h5 {
font-size: 12px;
}
.markdown h6 {
font-size: 12px;
}
.markdown hr {
height: 1px;
border: 0;
background: #e9e9e9;
margin: 16px 0;
clear: both;
}
.markdown p {
margin: 1em 0;
}
.markdown>p,
.markdown>blockquote,
.markdown>.highlight,
.markdown>ol,
.markdown>ul {
width: 80%;
}
.markdown ul>li {
list-style: circle;
}
.markdown>ul li,
.markdown blockquote ul>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown>ul li p,
.markdown>ol li p {
margin: 0.6em 0;
}
.markdown ol>li {
list-style: decimal;
}
.markdown>ol li,
.markdown blockquote ol>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown code {
margin: 0 3px;
padding: 0 5px;
background: #eee;
border-radius: 3px;
}
.markdown strong,
.markdown b {
font-weight: 600;
}
.markdown>table {
border-collapse: collapse;
border-spacing: 0px;
empty-cells: show;
border: 1px solid #e9e9e9;
width: 95%;
margin-bottom: 24px;
}
.markdown>table th {
white-space: nowrap;
color: #333;
font-weight: 600;
}
.markdown>table th,
.markdown>table td {
border: 1px solid #e9e9e9;
padding: 8px 16px;
text-align: left;
}
.markdown>table th {
background: #F7F7F7;
}
.markdown blockquote {
font-size: 90%;
color: #999;
border-left: 4px solid #e9e9e9;
padding-left: 0.8em;
margin: 1em 0;
}
.markdown blockquote p {
margin: 0;
}
.markdown .anchor {
opacity: 0;
transition: opacity 0.3s ease;
margin-left: 8px;
}
.markdown .waiting {
color: #ccc;
}
.markdown h1:hover .anchor,
.markdown h2:hover .anchor,
.markdown h3:hover .anchor,
.markdown h4:hover .anchor,
.markdown h5:hover .anchor,
.markdown h6:hover .anchor {
opacity: 1;
display: inline-block;
}
.markdown>br,
.markdown>p>br {
clear: both;
}
.hljs {
display: block;
background: white;
padding: 0.5em;
color: #333333;
overflow-x: auto;
}
.hljs-comment,
.hljs-meta {
color: #969896;
}
.hljs-string,
.hljs-variable,
.hljs-template-variable,
.hljs-strong,
.hljs-emphasis,
.hljs-quote {
color: #df5000;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-type {
color: #a71d5d;
}
.hljs-literal,
.hljs-symbol,
.hljs-bullet,
.hljs-attribute {
color: #0086b3;
}
.hljs-section,
.hljs-name {
color: #63a35c;
}
.hljs-tag {
color: #333333;
}
.hljs-title,
.hljs-attr,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo {
color: #795da3;
}
.hljs-addition {
color: #55a532;
background-color: #eaffea;
}
.hljs-deletion {
color: #bd2c00;
background-color: #ffecec;
}
.hljs-link {
text-decoration: underline;
}
/* 代码高亮 */
/* PrismJS 1.15.0
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
/**
* prism.js default theme for JavaScript, CSS and HTML
* Based on dabblet (http://dabblet.com)
* @author Lea Verou
*/
code[class*="language-"],
pre[class*="language-"] {
color: black;
background: none;
text-shadow: 0 1px white;
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
pre[class*="language-"]::-moz-selection,
pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection,
code[class*="language-"] ::-moz-selection {
text-shadow: none;
background: #b3d4fc;
}
pre[class*="language-"]::selection,
pre[class*="language-"] ::selection,
code[class*="language-"]::selection,
code[class*="language-"] ::selection {
text-shadow: none;
background: #b3d4fc;
}
@media print {
code[class*="language-"],
pre[class*="language-"] {
text-shadow: none;
}
}
/* Code blocks */
pre[class*="language-"] {
padding: 1em;
margin: .5em 0;
overflow: auto;
}
:not(pre)>code[class*="language-"],
pre[class*="language-"] {
background: #f5f2f0;
}
/* Inline code */
:not(pre)>code[class*="language-"] {
padding: .1em;
border-radius: .3em;
white-space: normal;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: slategray;
}
.token.punctuation {
color: #999;
}
.namespace {
opacity: .7;
}
.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
color: #905;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
color: #690;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
color: #9a6e3a;
background: hsla(0, 0%, 100%, .5);
}
.token.atrule,
.token.attr-value,
.token.keyword {
color: #07a;
}
.token.function,
.token.class-name {
color: #DD4A68;
}
.token.regex,
.token.important,
.token.variable {
color: #e90;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}
public/iconfont/demo_index.html 0 → 100644
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>iconfont Demo</title>
<link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/>
<link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/>
<link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
<link rel="stylesheet" href="demo.css">
<link rel="stylesheet" href="iconfont.css">
<script src="iconfont.js"></script>
<!-- jQuery -->
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
<!-- 代码高亮 -->
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
<style>
.main .logo {
margin-top: 0;
height: auto;
}
.main .logo a {
display: flex;
align-items: center;
}
.main .logo .sub-title {
margin-left: 0.5em;
font-size: 22px;
color: #fff;
background: linear-gradient(-45deg, #3967FF, #B500FE);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
</style>
</head>
<body>
<div class="main">
<h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
<img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
</a></h1>
<div class="nav-tabs">
<ul id="tabs" class="dib-box">
<li class="dib active"><span>Unicode</span></li>
<li class="dib"><span>Font class</span></li>
<li class="dib"><span>Symbol</span></li>
</ul>
<a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=4655522" target="_blank" class="nav-more">查看项目</a>
</div>
<div class="tab-container">
<div class="content unicode" style="display: block;">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe61e;</span>
<div class="name">收起</div>
<div class="code-name">&amp;#xe61e;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe659;</span>
<div class="name">通用-表格展开图标</div>
<div class="code-name">&amp;#xe659;</div>
</li>
</ul>
<div class="article markdown">
<h2 id="unicode-">Unicode 引用</h2>
<hr>
<p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
<ul>
<li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
<li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
</ul>
<blockquote>
<p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
</blockquote>
<p>Unicode 使用步骤如下：</p>
<h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.woff2?t=1723777503795') format('woff2'),
url('iconfont.woff?t=1723777503795') format('woff'),
url('iconfont.ttf?t=1723777503795') format('truetype');
}
</code></pre>
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
</code></pre>
<h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
<blockquote>
<p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
</blockquote>
</div>
</div>
<div class="content font-class">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont icon-shouqi"></span>
<div class="name">
收起
</div>
<div class="code-name">.icon-shouqi
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tongyong-biaogezhankaitubiao"></span>
<div class="name">
通用-表格展开图标
</div>
<div class="code-name">.icon-tongyong-biaogezhankaitubiao
</div>
</li>
</ul>
<div class="article markdown">
<h2 id="font-class-">font-class 引用</h2>
<hr>
<p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
<p>与 Unicode 使用方式相比，具有如下特点：</p>
<ul>
<li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
<li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
</ul>
<p>使用步骤如下：</p>
<h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
<h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
<blockquote>
<p>"
iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
</blockquote>
</div>
</div>
<div class="content symbol">
<ul class="icon_lists dib-box">
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shouqi"></use>
</svg>
<div class="name">收起</div>
<div class="code-name">#icon-shouqi</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tongyong-biaogezhankaitubiao"></use>
</svg>
<div class="name">通用-表格展开图标</div>
<div class="code-name">#icon-tongyong-biaogezhankaitubiao</div>
</li>
</ul>
<div class="article markdown">
<h2 id="symbol-">Symbol 引用</h2>
<hr>
<p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
<ul>
<li>支持多色图标了，不再受单色限制。</li>
<li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
<li>兼容性较差，支持 IE9+，及现代浏览器。</li>
<li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
</ul>
<p>使用步骤如下：</p>
<h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
<h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
&lt;/style&gt;
</code></pre>
<h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
&lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function () {
$('.tab-container .content:first').show()
$('#tabs li').click(function (e) {
var tabContent = $('.tab-container .content')
var index = $(this).index()
if ($(this).hasClass('active')) {
return
} else {
$('#tabs li').removeClass('active')
$(this).addClass('active')
tabContent.hide().eq(index).fadeIn()
}
})
})
</script>
</body>
</html>
public/iconfont/iconfont.css 0 → 100644
@font-face {
font-family: "iconfont"; /* Project id 4655522 */
src: url('iconfont.woff2?t=1723777503795') format('woff2'),
url('iconfont.woff?t=1723777503795') format('woff'),
url('iconfont.ttf?t=1723777503795') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-shouqi:before {
content: "\e61e";
}
.icon-tongyong-biaogezhankaitubiao:before {
content: "\e659";
}
public/iconfont/iconfont.js 0 → 100644
window._iconfont_svg_string_4655522='<svg><symbol id="icon-shouqi" viewBox="0 0 1024 1024"><path d="M70.4 153.6c0-45.9264 37.2736-83.2 83.2-83.2h716.8c45.9264 0 83.2 37.2736 83.2 83.2v716.8c0 45.9264-37.2736 83.2-83.2 83.2H153.6A83.2 83.2 0 0 1 70.4 870.4V153.6z m64 0v716.8c0 10.5984 8.6016 19.2 19.2 19.2h716.8a19.2 19.2 0 0 0 19.2-19.2V153.6A19.2 19.2 0 0 0 870.4 134.4H153.6A19.2 19.2 0 0 0 134.4 153.6z" fill="#5A5A68" ></path><path d="M307.2 544a32 32 0 1 1 0-64h409.6a32 32 0 1 1 0 64H307.2z" fill="#5A5A68" ></path></symbol><symbol id="icon-tongyong-biaogezhankaitubiao" viewBox="0 0 1024 1024"><path d="M173.111351 185.869838v656.467027h656.467027V185.869838H173.111351z m0-55.351352h656.467027a55.351351 55.351351 0 0 1 55.351352 55.351352v656.467027a55.351351 55.351351 0 0 1-55.351352 55.351351H173.111351a55.351351 55.351351 0 0 1-55.351351-55.351351V185.869838a55.351351 55.351351 0 0 1 55.351351-55.351352zM465.228108 488.005189v-128.63654a27.675676 27.675676 0 1 1 55.351351 0v128.63654h140.952217c11.347027 0 20.563027 12.509405 20.563027 27.924757 0 15.415351-9.188324 27.897081-20.563027 27.897081H520.579459v130.214054a27.675676 27.675676 0 1 1-55.351351 0V543.827027h-132.511135c-11.347027 0-20.535351-12.48173-20.535351-27.897081 0-15.415351 9.188324-27.924757 20.535351-27.924757h132.511135z" fill="#333333" ></path></symbol></svg>',function(n){var t=(t=document.getElementsByTagName("script"))[t.length-1],e=t.getAttribute("data-injectcss"),t=t.getAttribute("data-disable-injectsvg");if(!t){var o,i,a,c,d,s=function(t,e){e.parentNode.insertBefore(t,e)};if(e&&!n.__iconfont__svg__cssinject__){n.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(t){console&&console.log(t)}}o=function(){var t,e=document.createElement("div");e.innerHTML=n._iconfont_svg_string_4655522,(e=e.getElementsByTagName("svg")[0])&&(e.setAttribute("aria-hidden","true"),e.style.position="absolute",e.style.width=0,e.style.height=0,e.style.overflow="hidden",e=e,(t=document.body).firstChild?s(e,t.firstChild):t.appendChild(e))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(o,0):(i=function(){document.removeEventListener("DOMContentLoaded",i,!1),o()},document.addEventListener("DOMContentLoaded",i,!1)):document.attachEvent&&(a=o,c=n.document,d=!1,r(),c.onreadystatechange=function(){"complete"==c.readyState&&(c.onreadystatechange=null,l())})}function l(){d||(d=!0,a())}function r(){try{c.documentElement.doScroll("left")}catch(t){return void setTimeout(r,50)}l()}}(window);
\ No newline at end of file
public/iconfont/iconfont.json 0 → 100644
{
"id": "4655522",
"name": "sass",
"font_family": "iconfont",
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "4942664",
"name": "收起",
"font_class": "shouqi",
"unicode": "e61e",
"unicode_decimal": 58910
},
{
"icon_id": "6651985",
"name": "通用-表格展开图标",
"font_class": "tongyong-biaogezhankaitubiao",
"unicode": "e659",
"unicode_decimal": 58969
}
]
}
public/index.html
......@@ -7,6 +7,9 @@
<link rel="icon" href="<%= BASE_URL %>favicon.png">
<title><%= htmlWebpackPlugin.options.title %></title>
<script src="<%= BASE_URL %>config.js"></script>
<!-- <link rel="stylesheet" href="./iconfont/iconfont.css"> -->
<link rel="stylesheet" href="/iconfont/iconfont.css">
<!-- <script src="./iconfont/iconfont.js"></script> -->
</head>
<body>
<noscript>
......
src/assets/css/root.css 0 → 100644
:root {
--title-color: #444444;
--background-image: "url('/images/background/bg-1.png')";
--border-color: #fff;
--background-color: rgba(255, 255, 255, 1);
--subtitle: #fff;
--content: #333;
--label-color: #999;
--value-color: #333;
--header-background-color: #202125;
--header-font-color: #fff;
--tag-background-color: rgba(0, 0, 0, 0);
}
src/common/components/base/tableView.vue
......@@ -34,11 +34,11 @@ export default {
},
treeConfig: {
type: Object,
default: () => {},
default: () => { },
},
expandConfig: {
type: Object,
default: () => {},
default: () => { },
},
stripe: {
type: Boolean,
......@@ -74,23 +74,23 @@ export default {
},
footerMethod: {
type: Function,
default: () => {},
default: () => { },
},
cellClick: {
type: Function,
default: () => {},
default: () => { },
},
footerSpanMethod: {
type: Function,
default: () => {},
default: () => { },
},
rowClassName: {
type: Function,
default: () => {},
default: () => { },
},
cellStyle: {
type: Function,
default: () => {},
default: () => { },
},
highIds: {
// 高亮显示行
......@@ -103,11 +103,11 @@ export default {
},
spanMethod: {
type: Function,
default: () => {},
default: () => { },
},
checkboxConfig: {
type: Object,
default: () => {},
default: () => { },
},
customRightMenu: {
type: Object,
......@@ -281,6 +281,9 @@ export default {
reloadData() {
this.$refs.vxetable.reloadData(this.sourceData)
},
clearSelectionBox() {
this.$refs.vxetable.clearCheckboxRow()// 清空表格左侧的选择框数据
},
toggleRowExpand(obj) {
this.$emit('toggleRowExpand', obj)
},
......@@ -674,6 +677,7 @@ export default {
.scroller {
height: 100%;
}
.my-table {
vertical-align: middle;
}
......@@ -684,20 +688,22 @@ export default {
.my-table >>> .vxe-footer--column.col--ellipsis {
height: 30px;
} */
.my-table >>> .vxe-checkbox--label {
.my-table>>>.vxe-checkbox--label {
padding-left: 0;
}
.my-table >>> .vxe-header--column.tablecolgroup,
.my-table
>>> .vxe-header--column.col--ellipsis.tablecolgroup {
.my-table>>>.vxe-header--column.tablecolgroup,
.my-table>>>.vxe-header--column.col--ellipsis.tablecolgroup {
height: 22px !important;
}
.my-table >>> .vxe-cell {
.my-table>>>.vxe-cell {
/* max-height: 30px !important; */
padding-left: 5px;
padding-right: 5px;
}
.my-table >>> .green {
.my-table>>>.green {
background: green;
color: #fff;
}
......
src/components/base/image-list.vue 0 → 100644
<!--
* @Description: 描述
* @Author: chd
* @Date: 2021-06-08 11:22:13
* @LastEditors: chd
* @LastEditTime: 2021-07-03 09:59:53
-->
<template>
<div class="img_main" :style="!isFloat ? 'display:block' : ''">
<draggable v-model="list" group="people" @start="drag = true" @end="drag = false"
:style="!isFloat ? 'display:block' : ''" :move="onMove" class="draggable">
<template v-if="isFloat">
<div class="img_img" v-for="(item, i) in fileList" :key="i">
<div class="img_item" :class="{ high: highLength > i }">
<div class="img">
<img width="58" height="58" :src="item.imagePath
? setimgUrl(formatUrl(item.imagePath, 75), {
w: width,
f: 'png',
isCustom: isCustom,
hasWidth: hasWidth
})
: formatUrl(item.filePath, 75)
" alt="" />
<span style="font-size: 12px">{{ item.id }}</span>
</div>
<div class="btn_wrap">
<button type="button" @click="fullscreen(i)">
<i class="el-icon-zoom-in"></i>
</button>
<button class="remove" v-if="isdel" type="button" @click="remove(i)">
<i class="el-icon-close"></i>
</button>
</div>
<slot name="mark" :index="i" :item="item"></slot>
<template>
<span class="select-icon" v-if="item.type" :style="item.type === 'positively'
? 'background-color:#67C23A'
: item.type === 'negative'
? 'background-color:#409EFF'
: 'background-color:#B79860'
">
{{
item.type === 'positively'
? 'F'
: item.type === 'negative'
? 'B'
: 'D'
}}
</span>
</template>
</div>
</div>
<div v-show="add && fileList.length < length" class="img_wrap" @click="upload">
<i class="el-icon-plus"></i>
</div>
</template>
<template v-else>
<div v-for="(item, i) in fileList" :key="i" class="include-other-info">
<div class="img_item" :class="{ high: highLength > i }">
<div class="img">
<img width="58" height="58" :src="item.imagePath
? setimgUrl(item.imagePath, {
w: width,
f: 'png',
hasWidth: hasWidth,
isCustom: isCustom,
hasOss: hasOss
})
: setimgUrl(item.filePath, {
w: width,
f: 'png',
hasWidth: hasWidth,
hasOss: hasOss
})
" alt="" />
<span style="font-size: 12px">{{ item.id }}</span>
</div>
<div class="btn_wrap">
<button type="button" @click="fullscreen(i)">
<i class="el-icon-zoom-in"></i>
</button>
<button class="remove" v-if="isdel" type="button" @click="remove(i)">
<i class="el-icon-close"></i>
</button>
</div>
</div>
<slot name="other" :index="i" :item="item"></slot>
</div>
<div v-show="add && fileList.length < length" class="img_wrap" @click="upload">
<i class="el-icon-plus"></i>
</div>
</template>
</draggable>
<el-image-viewer class="image_viewer" :initialIndex="initialIndex" :zIndex="9999" :urlList="urlList"
v-if="imageVisible" :on-close="closeViewer"></el-image-viewer>
</div>
</template>
<script>
import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
import { inputFile } from '../../utils/commonUtil'
import { array } from 'js-md5'
export default {
components: {
ElImageViewer
},
data() {
return {
imageVisible: false,
initialIndex: 0,
imageSelcted: []
}
},
model: {
prop: 'fileList',
event: 'change'
},
props: {
joinBefore: {
type: Boolean,
default: false
},
isFormat: {
type: Boolean,
default: false
},
showDeleteModel: {
type: Boolean,
default: true
},
showWarehouseSku: {
type: Boolean,
default: false
},
isFloat: {
type: Boolean,
default: true
},
highLength: {
type: Number,
default: 0
},
isdel: {
type: Boolean,
default: true
},
add: {
type: Boolean,
default: true
},
length: {
type: Number,
default: 50
},
fileList: {
type: Array,
default: () => []
},
sortField: {
type: String,
default: 'position'
},
uploadApiUrl: {
type: String
},
width: {
type: Number,
default: 60
},
sizeLimit: {
type: Number,
default: 10
},
businessType: {
type: String
},
multiple: {
type: Boolean,
default: true
},
type: {
type: array,
default: null
},
isMark: {
type: Boolean,
default: false
},
isSize: {
type: Boolean,
default: false
},
hasWidth: {
type: Boolean,
default: false
},
isCustom: {
type: Boolean,
default: false
},
hasOss: {
type: Boolean,
default: false
}
},
watch: {
fileList(newval, oldval) {
if (newval && newval !== oldval) {
let arr = JSON.parse(JSON.stringify(newval))
arr = this.deduplication(arr)
if (arr.length !== newval.length) {
this.$emit('change', this.deduplication(arr))
}
}
}
},
computed: {
list: {
get() {
return this.fileList
},
set(list) {
this.$emit('change', this.deduplication(list))
}
},
urlList() {
return this.list.map((item) => {
return item.imagePath
? this.setimgUrl(item.imagePath, {
f: 'png',
isCustom: this.isCustom
})
: item.filePath
})
}
},
methods: {
formatUrl(url, num) {
console.log(url, 111)
if (this.isFormat && url) {
if (!url.includes('custom.jomalls.com') && url.includes('http')) {
return url
}
const name = url.split('/')
const format = name[name.length - 1].split('.')
name[name.length - 1] = format[0] + '-' + num + '.' + format[1]
console.log(name.join('/'), 'name')
return name.join('/')
}
return url
},
// 图片禁止拖拽
onMove() {
if (!this.isFloat) {
return false
}
return true
},
imageToggleSelect(image) {
if (!this.imageSelcted.includes(image)) {
this.imageSelcted.push(image)
} else {
const index = this.imageSelcted.findIndex((e) => e === image)
this.imageSelcted.splice(index, 1)
}
},
deduplication(list) {
const arr = []
for (let i = 0; i < list.length; i++) {
const item = list[i]
if (
item.imagePath
? !arr.includes(item.imagePath)
: !arr.includes(item.filePath)
) {
list[i][this.sortField] = i + 1
item.imagePath ? arr.push(item.imagePath) : arr.push(item.filePath)
} else {
list.splice(i, 1)
i--
}
}
if (this.isMark) {
return list.map((ee) => ({ ...ee }))
} else {
return list
}
},
closeViewer() {
this.imageVisible = false
},
upload() {
inputFile({
type: this.type,
isSize: this.isSize,
sizeLimit: this.sizeLimit,
multiple: this.multiple,
url: this.uploadApiUrl,
businessType: this.businessType
}).then((res) => {
const list = this.fileList
if (!this.multiple) {
res = [res]
}
for (const data of res) {
if (this.joinBefore) {
data.imagePath
? list.unshift({
imagePath: data.imagePath
})
: list.unshift({
imagePath: data.filePath
})
} else {
data.imagePath
? list.push({
imagePath: data.imagePath,
type: this.isMark ? 'positively' : ''
})
: list.push({
imagePath: data.filePath,
type: this.isMark ? 'positively' : ''
})
}
}
this.$emit('selectImg', this.deduplication(list))
this.$emit('change', this.deduplication(list))
})
},
// 图片预览
fullscreen(index) {
this.imageVisible = true
this.initialIndex = index
},
// 图片移除
remove(i) {
if (this.showDeleteModel) {
this.$confirm('确定删除当前图片？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
const [imgobj] = this.fileList.splice(i, 1)
this.$emit('remove', imgobj)
})
.catch(() => { })
} else {
const [imgobj] = this.fileList.splice(i, 1)
this.$emit('remove', imgobj)
}
}
}
}
</script>
<style scoped>
.include-other-info {
display: flex;
justify-content: space-between;
}
.draggable {
display: flex;
flex-wrap: wrap;
gap: 6px;
}
.img_main {
display: flex;
flex-wrap: wrap;
}
.img_main::after {
clear: both;
content: '';
display: block;
}
/* .img_main >>> .draggable::after{
clear: both;
content: '';
display: inline-block;
} */
.img_wrap {
width: 58px;
height: 58px;
border: 1px solid #ddd;
background: #fff;
cursor: pointer;
position: relative;
margin-bottom: 5px;
}
.img_wrap i {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.img_img {
width: 58px;
}
.img_item {
position: relative;
width: 100%;
height: auto;
text-align: center;
border: 1px solid #ddd;
margin-bottom: 5px;
}
.img_img:last-child {
margin-right: 6px;
}
.img_item img {
width: 100%;
height: 100%;
object-fit: contain;
object-position: center;
}
.img_item:hover .btn_wrap {
display: flex;
}
.img_item::v-deep:hover .mark {
display: block;
}
.btn_wrap {
display: none;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
justify-content: space-around;
align-items: center;
background: rgba(0, 0, 0, 0.5);
}
.img_item:hover .warehouseSku {
display: flex;
}
.warehouseSku {
display: none;
position: absolute;
bottom: -23px;
left: -50%;
text-align: center;
min-width: 240%;
max-width: 285%;
}
.remove {
position: absolute;
top: -5px;
right: -5px;
width: 16px;
height: 16px;
transform: scale(0.8);
border-radius: 50%;
background: #666 !important;
}
.remove i {
display: block;
color: #fff;
}
.btn_wrap button {
background: transparent;
color: #fff;
cursor: pointer;
}
.image_viewer>>>.el-image-viewer__close {
color: #fff;
}
.high {
border-color: blue;
}
.select-icon {
position: absolute;
top: -5px;
left: -5px;
font-size: 12px;
background-color: #f56c6c;
color: #fff;
border-radius: 50%;
width: 12px;
height: 12px;
display: flex;
padding: 2px;
box-sizing: border-box;
align-items: center;
justify-content: center;
}
.img_item::v-deep .mark {
display: none;
position: absolute;
top: 50%;
left: 2px;
transform: translateY(-50%);
}
.img_item::v-deep .mark-item {
cursor: pointer;
width: 12px;
height: 12px;
box-sizing: border-box;
display: flex;
background-color: #fff;
align-items: center;
padding: 2px;
border-radius: 50%;
justify-content: center;
}
.img_item::v-deep .mark-item:not(:last-child) {
margin-bottom: 4px;
}
.img_item::v-deep .mark-item span {
font-size: 12px;
}
</style>
src/main.js
......@@ -10,6 +10,7 @@ import 'xe-utils'
import 'vxe-table/lib/index.css'
import './common/style/index.scss'
import './assets/css/common.css'
import './assets/css/root.css'
import Directives from './utils/directives'
import { filePath, zImgPath } from './utils/commonUtil'
import md5 from 'js-md5'
......
src/utils/api.js
/*
* @Description: 描述
* @Author: chd
* @Date: 2021-01-18 13:49:02
* @LastEditors: chd
* @LastEditTime: 2021-04-27 21:40:51
*/
import { post } from '@/common/api/axios.js'
/**
* 上传图片
* @param {*} params
* @param {String} params.filePath - 文件存储文件夹
* @param {object} ...other
* @returns Promise
*/
export function uploadImg(file, params = {}) {
const from = new FormData()
from.append('file', file)
const { url, ...otherParams } = params
for (const key in otherParams) {
from.append(key, otherParams[key])
}
return post(url || 'upload/fileUpload/images', from, {
// headers: { 'content-type': 'multipart/form-data' }
})
}
export function uploadOtherFile(params) {
const { url, name, file, ...other } = params
const from = new FormData()
for (const key in other) {
from.append(key, other[key])
}
from.append(name, file)
return post(url, from, {
headers: { 'content-type': 'multipart/form-data' }
})
}
src/utils/commonUtil.js
import Vue from 'vue'
import { uploadOtherFile, uploadImg } from './api'
function getStaticPath() {
if (!/(http|https):\/\/([^/]+)/i.test(window.apiHostSetting.VUE_APP_BASE_URL)) {
if (
!/(http|https):\/\/([^/]+)/i.test(window.apiHostSetting.VUE_APP_BASE_URL)
) {
return location.origin + window.apiHostSetting.VUE_APP_BASE_URL
}
return window.apiHostSetting.VUE_APP_BASE_URL
......@@ -26,3 +30,145 @@ export function delChildren(list, callback, name) {
recursive(list, callback, 0)
return list
}
const fileTypes = {
img: ['jpg', 'jpeg', 'png', 'gif', 'bmp'],
excel: ['.xls', '.xlsx'],
json: ['json'],
txt: ['txt']
}
function imgSizeCheck(file, params) {
return new Promise((resolve) => {
const img = new Image()
img.src = URL.createObjectURL(file)
img.onload = function () {
const width = img.width
const height = img.height
if (width < params.minWidth || height < params.minHeight) {
Vue.prototype.$message.warning(
`请上传宽大于${params.minWidth}高大于${params.minHeight}的图片`
)
resolve(false)
} else {
resolve(true)
}
}
})
}
export function inputFile(params = {}) {
return new Promise((resolve, reject) => {
const input = document.createElement('input')
input.style.display = 'none'
input.type = 'file'
input.multiple = params.multiple || false
input.click()
input.onchange = async () => {
console.log(input.files)
const files = input.files
const requset = []
for (const file of files) {
// 添加类型后缀校验
if (params.limit) {
let etc = file.name.split('.')[file.name.split('.').length - 1]
etc = etc.toLowerCase()
if (!params.limit.includes(etc)) {
return Vue.prototype.$message.error(
`请上传${params.limit.join(',')}文件`
)
}
}
// 大小校验
if (params.isSize) {
const size = file.size
if (!params.sizeLimit) params.sizeLimit = 10
if (size / (1024 * 1024) >= params.sizeLimit) {
return Vue.prototype.$message.error(
`文件大小不能大于等于${params.sizeLimit}M`
)
}
}
// 文件类型校验
if (!params.noType) {
const type = params.type || 'img'
let fileType = []
if (typeof type === 'string') {
fileType = fileTypes[type]
} else {
fileType = type
}
const typeExp = fileType.map((item) =>
typeof item === 'object' ? item : new RegExp(item)
)
const bool = typeExp.some(
(item) => item.test(file.name) || item.test(file.type)
)
if (!bool) {
Vue.prototype.$message({
type: 'warning',
message: params.message || `请上传${fileType.join('、')}格式文件`
})
return
}
}
// 宽高校验
if (params.minWidth && params.minHeight) {
const res = await imgSizeCheck(file, params)
if (!res) return
}
if (
params.type === 'excel' ||
params.type === 'json' ||
params.type === 'txt'
) {
const other = params.other || {}
if (params.multiple) {
requset.push(
uploadOtherFile({
url: params.url,
name: params.name || 'importExcel',
file: file,
...other
})
)
} else {
uploadOtherFile({
url: params.url,
name: params.name || 'importExcel',
file: file,
...other
})
.then(resolve)
.catch(reject)
}
} else {
const other = params.other || {}
if (params.multiple) {
requset.push(
uploadImg(file, {
filePath: params.filePath,
isSize: params.isSize,
multiple: params.multiple,
url: params.url,
businessType: params.businessType
})
)
} else {
uploadImg(file, {
filePath: params.filePath,
url: params.url,
isSize: params.isSize,
businessType: params.businessType,
...other
})
.then(resolve)
.catch(reject)
}
}
}
if (requset.length > 0) {
Promise.all(requset).then(resolve).catch(reject)
}
}
})
}
src/views/system/app.vue
......@@ -7,14 +7,14 @@
<div @click.stop="toggleNodeExpanded(node)" class="custom-tree-node-arrow"
:style="{ transform: node.expanded ? 'rotate(90deg)' : '' }"
v-if="data.children && data.children.length > 0">
<icon :name="node.expanded ? 'xe61e' : 'xe659'"></icon>
<!-- <icon :name="node.expanded ? 'xe61e' : 'xe659'"></icon> -->
<i :class="node.expanded ? 'iconfont icon-shouqi' : 'iconfont icon-tongyong-biaogezhankaitubiao'"></i>
</div>
<div class="customize-tree-node__label">
<icon name="wenjianjia"></icon>
<span>{{ data.categoryName }}</span>
</div>
<div class="customize-tree-node__operate">
<i title="添加分类" class="el-icon-circle-plus" style="color: rgb(140 195 75); margin-right: 5px"
<i title="新增分类" class="el-icon-circle-plus" style="color: rgb(140 195 75); margin-right: 5px"
@click="addFolder(data)"></i>
<i title="修改分类" class="el-icon-edit-outline" style="color: #ff9800; margin-right: 5px"
@click="editFolder(data)"></i>
......@@ -25,6 +25,9 @@
</template>
<template #page_right>
<el-form ref="form" :model="searchForm" size="mini" v-enter-submit="search" @submit.native.prevent :inline="true">
<el-form-item label="创建时间">
<choose-time-period v-model="period"></choose-time-period>
</el-form-item>
<el-form-item label="应用名称">
<el-input style="width: 120px" clearable v-model="searchForm.name" placeholder="应用名称"></el-input>
</el-form-item>
......@@ -35,149 +38,43 @@
</el-select>
</el-form-item>
<el-form-item label>
<el-button type="primary" native-type="submit" @click="search()">
<el-button type="primary" native-type="submit" @click="search()" icon="el-icon-search">
查询
</el-button>
</el-form-item>
<el-form-item label>
<el-button type="success" @click="editDialog()">新增
</el-button>
</el-form-item>
<el-form-item label>
<el-button type="warning" @click="updateDialog()">修改
<el-button type="success" @click="addInfo()" icon="el-icon-plus">新增
</el-button>
</el-form-item>
<el-form-item label>
<el-button type="danger" @click="editDialog()">删除
<el-button type="danger" @click="deleteSection()" icon="el-icon-delete">批量删除
</el-button>
</el-form-item>
</el-form>
<div class="table_wrap" style="padding: 0">
<table-view :sourceData="sourceData" :serialNumber="false" :tableColumns="tableColumns"></table-view>
</div>
<pagination :setValue="setpaginationOptions" :options="paginationOptions" />
</template>
<!-- <el-dialog :title="isEdit ? '编辑' : '新增'" :close-on-click-modal="false" :visible.sync="editShowing" width="80%">
<div class="app-form">
<div class="img">
<img
src="https://img0.baidu.com/it/u=2426072799,1960439289&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1718902800&t=11922fc3c027b8ac0f9bd5ef82d518c7"
alt="">
</div>
<div class="form">
<el-form :model="editForm" :inline="true" label-width="80px" :rules="addrules" size="mini" ref="editForm">
<el-row :gutter="10">
<el-col :span="12">
<el-form-item label="应用名称" size="small" prop="title">
<el-input style="width: 100%" v-model="editForm.title"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="应用分类" size="small" prop="title">
<el-select style="width: 100%;" v-model="searchForm.creator" placeholder="请选择" clearable filterable>
<el-option v-for="user in userList" :key="user.id" :label="user.realName"
:value="user.id"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="应用简述" size="small" prop="title">
<el-input style="width: 100%" type="textarea" :rows="4" v-model="editForm.title"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="应用详情" size="small" prop="title">
<v-editor filename="files" style="width: 100%" v-model="editForm.content" ref="wangeditor"
height="300px" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="10" style="width: 100%;">
<el-col :span="11">
<el-form-item label="应用价格" size="small" prop="title">
<el-input style="width: 100%" v-model="editForm.title"></el-input>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="应用周期" size="small" prop="title">
<el-select style="width: 100%" v-model="searchForm.creator" placeholder="请选择" clearable filterable>
<el-option v-for="user in userList" :key="user.id" :label="user.realName"
:value="user.id"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col style="display: flex;margin-top: 3px;" :span="2">
<el-button size="mini" type="success" icon="el-icon-plus"></el-button>
<el-button style="margin-left: 15px" size="mini" type="danger" icon="el-icon-minus"></el-button>
</el-col>
</el-row>
</el-form>
</div>
<div class="table_wrap" style="min-height: 50%; max-height: 80%; padding: 0">
<table-view :sourceData="sourceData" :serialNumber="true" :tableColumns="tableColumns" ref='multipleTable'
@selectionChange='selectionChange' :selection='true'></table-view>
</div>
<div style="display: flex;justify-content: flex-end" slot="footer">
<el-button size="mini" style="width: 80px;" @click="editShowing = false">取 消
</el-button>
<el-button size="mini" style="margin-left: 20px;width: 80px;" type="primary" @click="submit">确 定
</el-button>
<div slot="footer" style="display:flex;justify-content: center;">
<!-- <pagination :setValue="setpaginationOptions" :options="paginationOptions" /> -->
<el-pagination layout="sizes, total, prev, pager, next, jumper" background :total="paginationOptions.total"
:page-size="paginationOptions.pageSize" :current-page="paginationOptions.currentPage"
@size-change="sizeChange" @current-change="onCurrentChange">
</el-pagination>
</div>
</el-dialog> -->
<!-- 添加、修改应用 -->
</template>
<!-- 新增、修改应用 -->
<el-dialog :title="isEdit ? '编辑' : '新增'" :visible.sync="editShowing" width="1000px" :close-on-click-modal="false">
<div class="edit-form">
<el-form ref="editForm" :model="editForm" label-width="auto">
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="应用分类" prop="folderId" required>
<el-cascader style="width: 100%" v-model="editForm.folderId" size="mini" :options="folders" clearable :props="{
label: 'categoryName',
value: 'id',
emitPath: false,
checkStrictly: true
}" :show-all-levels="false"></el-cascader>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="应用类型" prop="designTeamId" :rules="[{ message: '请选择应用类型', required: true }]">
<el-select style="width: 100%" v-model="editForm.designTeamId" size="mini" placeholder="请选择" clearable>
<el-option v-for="item in applicationTypeData" :key="item.id" :label="item.value"
:value="item.id"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="应用周期" prop="architectId" :rules="[{ required: true, message: '请选择应用周期' }]">
<el-select v-model="editForm.architectId" size="mini" filterable clearable style="width: 100%">
<el-option v-for="item in applicationTypeData" :key="item.id" :label="item.value"
:value="item.id"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="应用名称" prop="name">
<el-input v-model="editForm.name" placeholder="请输入应用名称" maxlength="120" size="mini" clearable show-word-limit />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="应用价格" prop="name">
<el-input v-model="editForm.name" placeholder="请输入应用价格" maxlength="120" size="mini" clearable show-word-limit />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="应用图标">
<div class="my-flex-1">
<upload-images sortField="sort" businessType="design" uploadApiUrl="upload/ossUpload"
:type="limitFileType" :isFloat="false" :width="300" :hasWidth="true" :hasOss="true"
:length="editFlag ? 1 : 50" v-model="editForm.mainImage" @selectImg="selectImg"
>
<template #other="{ index }">
<upload-images sortField="sort" businessType="other" uploadApiUrl="upload/oss" :type="limitFileType"
:isFloat="false" :width="300" :hasWidth="true" :hasOss="true" :length="editFlag ? 1 : 50"
v-model="editForm.icon" @selectImg="selectImg">
<!-- <template #other="{ index }">
<div class="other-msg" style="display: flex">
<span class="other-label" style="margin-right: 4px">
图标文件
......@@ -185,7 +82,7 @@
<upload-file v-model="productionFile[index]" url="upload/podProductionFileUpload"
getFilePath="filePath" :max="1" text="上传图标文件" />
</div>
</template>
</template> -->
</upload-images>
</div>
</el-form-item>
......@@ -193,13 +90,67 @@
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="应用简述" size="small" prop="title">
<el-input style="width: 100%" type="textarea" :rows="4" v-model="editForm.title"></el-input>
<el-form-item label="应用分类" prop="categoryId" :rules="[{ message: '请选择应用分类', required: true }]">
<el-cascader style="width: 100%" v-model="editForm.categoryId" size="mini" :options="folders" clearable
:props="{
label: 'categoryName',
value: 'id',
emitPath: false,
checkStrictly: true
}" :show-all-levels="false"></el-cascader>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="11">
<el-form-item label="应用名称" prop="name" :rules="[{ message: '请输入应用名称', required: true }]">
<el-input v-model="editForm.name" placeholder="请输入应用名称" maxlength="120" size="mini" clearable
show-word-limit />
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="应用类型">
<el-radio-group v-model="editForm.isCollectFee">
<el-radio :label="false">免费</el-radio>
<el-radio :label="true">收费</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<div v-if="editForm.isCollectFee">
<el-row :gutter="20" v-for="(item, index) in editForm.salePriceList" :key="index">
<el-col :span="11">
<el-form-item label="应用价格">
<el-input v-model="item.price" placeholder="请输入应用价格" maxlength="120" size="mini" clearable
show-word-limit />
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="应用周期">
<el-select v-model="item.validDays" size="mini" filterable clearable style="width: 100%">
<el-option v-for="item in applyCycleList" :key="item.value" :label="item.name"
:value="item.value"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col style="display: flex;margin-top: 8px;" :span="3">
<el-button size="mini" type="success" icon="el-icon-plus" @click="addDomain"></el-button>
<el-button style="margin-left: 15px" size="mini" type="danger" icon="el-icon-minus"
@click.prevent="removeDomain(index)"></el-button>
</el-col>
</el-row>
</div>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="应用简述" size="small" prop="description"
:rules="[{ message: '请输入应用简述', required: true }]">
<el-input style="width: 100%" type="textarea" :rows="4" v-model="editForm.description"
placeholder="请输入应用简述"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="应用详情" size="small" prop="title">
<v-editor filename="files" style="width: 100%" v-model="editForm.content" ref="wangeditor"
<el-form-item label="应用详情" size="small">
<v-editor filename="files" style="width: 100%" v-model="editForm.details" ref="wangeditor"
height="300px" />
</el-form-item>
</el-col>
......@@ -207,10 +158,11 @@
</el-form>
</div>
<span slot="footer">
<el-button @click="editShowing = false">取消</el-button>
<el-button @click="save" type="primary">确认</el-button>
<el-button @click="editShowing = false" size="medium">取消</el-button>
<el-button @click="saveApplication" type="primary" size="medium">确认</el-button>
</span>
</el-dialog>
<!-- 暂定 -->
<el-dialog :visible.sync="releaseVisible" :close-on-click-modal="false" title="发布" width="600px">
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选
</el-checkbox>
......@@ -224,8 +176,8 @@
<el-button size="mini" @click="confirmRelease" type="primary">确认</el-button>
</span>
</el-dialog>
<!-- 添加、修改分类 -->
<el-dialog :title="editFolderId ? '编辑分类' : '添加分类'" :visible.sync="folderVisible" :close-on-click-modal="false"
<!-- 新增、修改分类 -->
<el-dialog :title="editFolderId ? '编辑分类' : '新增分类'" :visible.sync="folderVisible" :close-on-click-modal="false"
width="600px">
<el-form ref="folderForm" :model="folderForm" label-position="top" label-width="80px">
<el-form-item label="名称" prop="folderName" :rules="[{ required: true, message: '请输入分类名称' }]">
......@@ -238,39 +190,50 @@
</span>
</el-dialog>
</layout>
</template>
<script>
import Editor from '@/components/wangeditor/index.vue'
import tableView from '@/common/components/base/tableView.vue'
import ChooseTimePeriod from '@/components/base/chooseTimePeriod.vue'
// import ImageView from '@/components/base/ImageView.vue'
import pagination from '../../mixins/pagination'
import { get, post } from '@/common/api/axios'
import { getSystemUserList } from '@/common/api/system'
import Icon from '@/components/base/icon.vue'
import UploadImages from '@/components/base/image-list.vue'
import layout from '@/components/global/layout.vue'
export default {
name: 'system_announce_manage',
components: {
UploadImages,
'v-editor': Editor,
tableView,
Icon,
layout
layout,
ChooseTimePeriod,
// ImageView
},
mixins: [pagination],
data() {
return {
period: [],
rowNumber: '',
selection: [],
editForm: {
name: '',
labelNames: [],
architectId: '',
originFile: '', // 源文件
productionFile: '', // 生产文件
mainImage: undefined, // 设计图,
designTeamId: '',
demandCustomize: 0,
redraw: 0,
folderId: ''
name: '', // 名称
icon: undefined, // 图标
// productionFile: '', // 生产文件
description: '', // 简述
details: '', // 详情
categoryId: '', // 分类id
salePriceList: [
{
price: '',
validDays: '',
},
],
isCollectFee: true, // 是否收费
},
deepCloneForm: {},
limitFileType: ['jpg', 'png'],
editFlag: false,
editFlag: true,
productionFile: [],
defaultProps: {
children: 'children',
......@@ -292,77 +255,74 @@ export default {
id: 2,
value: '收费'
}],
categoryId: '',
applyCycleList: [],
checkAll: false,
isIndeterminate: false,
checkedCompany: [],
userList: [],
pageSize: 50,
currentPage: 1,
total: 1,
paginationOptions: {
pageSize: 10,
currentPage: 1,
total: 0
},
addrules: {
title: [
{
required: true,
message: '请输入标题',
trigger: 'blur'
}
]
},
sourceData: [],
searchForm: {},
searchForm: {
type: ''
},
isEdit: false,
editShowing: false,
defaultEditFrom: {
title: '',
enableFlag: false,
content: '',
priority: false
},
releaseVisible: false,
releaseList: []
}
},
mounted() {
this.deepCloneForm = JSON.parse(JSON.stringify(this.editForm))
this.loadFoldersData()
// this.getList()
// this.getSystemUserList()
},
computed: {
tableColumns() {
return [
{
label: '序号',
key: 'index',
label: '应用图标',
type: '',
key: 'icon',
// render: (item) => <image-view imgUrl={item.icon}></image-view>,
render: (item) => (
item.icon ? (
<img src={item.icon} alt="应用图标" style={{ width: '40px', height: 'auto' }} />
) : (
<span>无图标</span>
)
),
width: 80
},
{
label: '应用名称',
key: 'name',
align: 'left'
},
{
label: '应用分类',
key: 'categoryName'
},
{
label: '应用类型',
key: 'isCollectFee',
render: (item) => (
<span>{item.isCollectFee ? '收费' : '免费'}</span>
),
},
{
label: '应用简述',
key: 'description'
},
// {
// label: '应用价格',
// key: 'creatorName2'
// },
{
label: '应用服务期',
key: 'creatorName2'
label: '创建时间',
key: 'createTime'
},
{
label: '创建日期',
key: 'createTime'
label: '修改时间',
key: 'updateTime'
},
{
label: '操作',
......@@ -372,25 +332,17 @@ export default {
<span
class="icon-view icon-edit-view"
title="编辑"
onClick={() => this.editDialog(item)}
onClick={() => this.editInfo(item)}
>
<i class="el-icon-edit"></i>
</span>
<span
class="icon-view icon-del-view"
title="删除"
onClick={() => this.deleteAnnounces(item)}
onClick={() => this.deleteSection(item)}
>
<i class="el-icon-delete"></i>
</span>
<span
class="icon-view"
style="background:yellowgreen"
title="字段配置"
onClick={() => this.fieldSet(item)}
>
<i class="el-icon-c-scale-to-original"></i>
</span>
</div>
)
}
......@@ -398,35 +350,95 @@ export default {
}
},
methods: {
async save() {
toggleNodeExpanded(node) {
node.expanded = !node.expanded
},
// 周期+价格的增删
removeDomain(index) {
if (this.editForm.salePriceList.length > 1) {
if (index !== -1) {
this.editForm.salePriceList.splice(index, 1)
}
} else {
this.$message.warning('至少设置一种销售价格!')
}
},
addDomain() {
this.editForm.salePriceList.push({
price: '',
validDays: '',
})
},
selectionChange(selection) {
this.selection = selection
},
deleteSection(v) {
const arr = v ? [v] : this.selection
if (arr.length === 0) return this.$message('请勾选至少一条记录')
const ids = arr.map(item => item.id).join()
this.$confirm('确定删除选中的信息？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const url = `businessAppInfo/deleteAppInfoByIds?ids=${ids}`
get(url).then((res) => {
if (res.code === 200) {
this.$message({
type: 'success',
message: '删除成功!',
})
this.getList()
this.selection = []
this.$refs.multipleTable.clearSelectionBox()
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true,
})
}
})
})
.catch(() => {
this.selection = []
this.$refs.multipleTable.clearSelectionBox()
})
},
// 分页
sizeChange(pageSize) {
this.paginationOptions.pageSize = pageSize
this.getList()
},
onCurrentChange(currentPage) {
this.paginationOptions.currentPage = currentPage
this.getList()
},
// 提交应用信息
async saveApplication() {
try {
await this.$refs.editForm.validate()
} catch {
return
}
if (!this.editForm.mainImage || this.editForm.mainImage.length === 0) {
this.$message.warning('请选择设计图')
return
}
if (this.productionFile.some((item) => !item)) {
return this.$message.warning('请上传生产文件')
}
if (this.productionFile.length > 0) {
this.editForm.productionFile = this.productionFile.join(',')
}
// if (!this.editForm.icon || this.editForm.icon.length === 0) {
// this.$message.warning('请选择应用图标')
// return
// }
// if (this.productionFile.some((item) => !item)) {
// return this.$message.warning('请上传应用图标')
// }
// if (this.productionFile.length > 0) {
// this.editForm.productionFile = this.productionFile.join(',')
// }
try {
const data = JSON.parse(JSON.stringify(this.editForm))
data.labelNames = data.labelNames?.join()
// data.mainImage = data.mainImage[0].imagePath
data.mainImage = this.handleImage(data.mainImage)
if (!this.editId) {
data.folderId = this.folderId
await post('podDesignCenter/addPodDesigns', data)
} else {
data.folderId = this.editForm.folderId
await post('podDesignCenter/update', data)
}
data.icon = this.handleImage(data.icon)
// if (!this.editId) {
// data.categoryId = this.categoryId
// } else {
// data.categoryId = this.editForm.categoryId
// }
await post('businessAppInfo/addOrUpdateAppInfo', data)
this.getList()
} catch (e) {
throw new Error(e)
......@@ -434,18 +446,76 @@ export default {
this.editShowing = false
}
},
handleImage(data) {
if (Array.isArray(data) && data.length > 0) {
return data.map(item => item.imagePath).join(',')
}
return null
},
selectImg(file) {
const imagePath = file.map((ee) => ee.imagePath)
this.productionFile = imagePath
},
// 获取应用周期
async getapplyCycle() {
try {
const res = await get('businessAppSalePrice/getSalePriceValidDays')
if (res.code !== 200) return
this.applyCycleList = Object.entries(res.data).map(([name, value]) => ({ name, value }))
} catch (e) {
console.error(e)
}
},
// 新增、编辑应用信息
addInfo() {
this.editShowing = true
this.editId = undefined
this.isEdit = false
this.editForm = JSON.parse(JSON.stringify(this.deepCloneForm))
this.productionFile = []
this.editForm.categoryId = this.categoryId || 1
this.$nextTick(() => {
this.$refs.editForm.clearValidate()
})
this.getapplyCycle()
},
async editInfo(item) {
if (item) {
this.isEdit = true
this.editId = item.id
this.getapplyCycle()
try {
const res = await get('businessAppInfo/getAppInfoById', { id: item.id })
if (res.code !== 200) return
// this.productionFile = [res.data.productionFile]
// res.data.labelNames = res.data.labelNames?.split(',')
// this._editData = JSON.parse(JSON.stringify(res.data))
res.data.icon = [{ imagePath: res.data.icon }]
// if (!res.data.productionFile) {
// res.data.productionFile = res.data.mainImage
// }
// res.data.designTeamId = Number(res.data.designTeamId)
this.editForm = res.data
this.$nextTick(() => {
this.$refs.editForm.clearValidate()
})
this.editShowing = true
} catch (e) {
console.error(e)
this.$message.error(e)
}
}
},
// 获取左侧树数据
async loadFoldersData() {
try {
const res = await get('businessAppCategory/getCategoryList')
if (res.code !== 200) return
this.folders = this.recursiveFolder(res.data)
this.categoryId = res.data[0].id
this.$nextTick(() => {
this.$refs.tree.setCurrentKey(this.folderId || res.data[0].id)
this.$refs.tree.setCurrentKey(this.categoryId || res.data[0].id)
this.getList()
})
} catch (e) {
console.error(e)
......@@ -464,7 +534,7 @@ export default {
}
return folder
},
// 添加、修改、删除分类
// 新增、修改、删除分类
async addFolder(data) {
this.folderVisible = true
this.currentFolder = data
......@@ -514,11 +584,14 @@ export default {
return
}
const params = {
pid: this.currentFolder.id === 1 ? 0 : this.folderId, // 顶级分类pid传0,其他传自己的id
// pid: this.currentFolder.id === 1 ? 1 : this.parentFolderId, // 顶级分类pid传0,其他传自己的id
// id: this.editFolderId ? this.categoryId : undefined // 编辑有id，新增没有id
// pid: this.parentFolderId, // 顶级分类pid传0,其他传自己的id
pid: this.editFolderId ? this.parentFolderId : this.currentFolder.id,
categoryName: this.folderForm.folderName, // 分类名称
id: this.editFolderId ? this.folderId : undefined // 编辑有id，添加没有id
id: this.editFolderId
}
console.log(params, '4545')
console.log('111', params)
try {
const res = await post('businessAppCategory/addOrUpdateCategory', params)
if (res.code !== 200) return
......@@ -530,14 +603,12 @@ export default {
},
// 左侧树每个节点点击
handleNodeClick(data) {
console.log(data, data.id, data.pid)
this.currentFolder = data
this.parentFolderId = data.pid
this.folderId = data.id
this.categoryId = data.id
this.getList()
},
fieldSet(item) {
this.$router.push('/dynamicForm')
},
handleCheckAllChange(val) {
this.checkedCompany = val
? this.releaseList.map((e) => e.id)
......@@ -555,14 +626,6 @@ export default {
search() {
this.getList()
},
async getSystemUserList() {
try {
const res = await getSystemUserList()
this.userList = res.data
} catch (e) {
console.error(e)
}
},
setpaginationOptions(opt) {
for (const key in opt) {
this.paginationOptions[key] = opt[key]
......@@ -577,11 +640,13 @@ export default {
} =
this.paginationOptions
const res = await post('businessAppInfo/getAppInfoList', {
categoryId: this.folderId,
categoryId: this.categoryId === 1 ? undefined : this.categoryId,
pageSize,
currentPage,
isCollectFee: this.searchForm.type !== 1,
isCollectFee: this.searchForm.type === '' ? '' : this.searchForm.type === 2,
name: this.searchForm.name,
startTime: this.period && this.period[0],
endTime: this.period && this.period[1],
})
if (res.code !== 200) return
this.sourceData = res.data.records || []
......@@ -590,69 +655,6 @@ export default {
console.error(e)
}
},
currentChange(i) {
this.currentPage = i
this.getList()
},
async editDialog(item) {
if (item) {
try {
const res = await get(
'sys/announcement/get/' + item.id
)
if (res.code !== 200) return
this.editForm = {
...this.editForm,
...res.data
}
this.isEdit = true
} catch (e) {
console.error(e)
}
} else {
this.editForm = JSON.parse(
JSON.stringify(this.defaultEditFrom)
)
this.$nextTick(() => {
this.$refs.editForm.clearValidate()
})
this.isEdit = false
}
this.editShowing = true
},
async submit() {
try {
await this.$refs.editForm.validate()
} catch {
return
}
try {
const url = this.isEdit
? 'sys/announcement/edit'
: 'sys/announcement/add'
const res = await post(url, { ...this.editForm })
if (res.code !== 200) return
this.$message.success(res.message)
this.editShowing = false
this.getList()
} catch (e) {
console.error(e)
}
},
async enableChange(item, val) {
try {
const res = await post('sys/announcement/edit', {
id: item.id,
enableFlag: val
})
if (res.code !== 200) return
this.$message.success(res.message)
this.getList()
} catch (e) {
console.error(e)
}
},
async release(item) {
try {
const res = await post('sys/domain/list')
......@@ -665,18 +667,6 @@ export default {
console.error(e)
}
},
async deleteAnnounces(item) {
try {
const res = await get(
'sys/announcement/delete/' + item.id
)
if (res.code !== 200) return
this.$message.success(res.message)
this.getList()
} catch (e) {
console.error(e)
}
},
async confirmRelease() {
if (this.checkedCompany.length === 0) {
return this.$message.warning('请至少选择一条记录')
......@@ -717,38 +707,10 @@ export default {
padding-right: 8px;
}
.pod-search {
padding: 0px 10px;
}
.pod-header {
display: flex;
}
.item:not(:last-child) {
margin-right: 10px;
}
.table_wrapper {
flex: 1;
padding: 0 10px;
display: grid;
grid-template-columns: repeat(6, 1fr);
gap: 10px;
}
@media screen and (max-width: 1920px) {
.table_wrapper {
grid-template-columns: repeat(6, 1fr);
}
}
@media screen and (max-width: 1400px) {
.table_wrapper {
grid-template-columns: repeat(4, 1fr);
}
}
.upload-demo::v-deep .el-upload--text {
width: 100%;
white-space: nowrap;
......@@ -758,28 +720,6 @@ export default {
text-align: left;
}
.sales {
width: 40px;
height: 26px;
display: inline-block;
position: relative;
border: 1px solid #ddd;
overflow: hidden;
vertical-align: middle;
white-space: nowrap;
border-radius: 4px;
cursor: pointer;
padding: 3px 3px;
box-sizing: border-box;
display: inline-flex;
align-items: center;
justify-content: center;
}
.isActive {
border: 1px solid #4168ff;
}
.edit-form::v-deep .img_item {
width: 27%;
height: 200px;
......@@ -863,17 +803,6 @@ export default {
top: 11px;
}
.variant_wrap {
height: 700px;
overflow: auto;
}
.variant_wrap::after {
display: block;
content: '';
clear: both;
}
.empty {
height: 100%;
display: flex;
......
src/views/system/upload-file.vue 0 → 100644
<template>
<div class="upload-files" v-loading="uploading">
<input
ref="file"
type="file"
style="display: none"
@change="onFileChanged" />
<div v-if="imageMode" class="images">
<el-image
v-for="item in files"
:key="item.path"
class="upload-files-img"
:src="setimgUrl(item.path, { w: 80 })" />
<i
v-if="!(max > 0) || (files && files.length) < max"
class="upload-files-add-icon el-icon-plus"
@click="$refs.file.click()" />
</div>
<template v-else>
<ul class="files">
<li
v-for="(item, i) in files"
:key="item.path"
class="upload-files-file">
<span
class="filename"
@click="downloadFile(item)"
:title="`点击下载 ${item.path} 文件`">
{{ filename(item.path) }}
</span>
<i class="file-remove el-icon-close" @click="removeFile(i)"></i>
</li>
</ul>
<el-button
v-if="!(max > 0) || (files && files.length) < max"
type="primary"
@click="$refs.file.click()">
{{ text }}
</el-button>
</template>
</div>
</template>
<script>
import { baseURL } from '@/common/api/axios.js'
import Axios from 'axios'
import _ from 'lodash'
export default {
name: 'UploadFile',
props: {
value: {
type: [Array, String, Object],
},
max: {
type: Number,
},
imageMode: {
type: Boolean,
},
url: {
type: String,
default: 'upload/podFileUpload',
},
getFilePath: {
type: String,
default: 'imagePath',
},
text: {
type: String,
default: '选择文件',
},
},
data() {
return {
uploading: false,
files: [],
}
},
watch: {
value: {
immediate: true,
handler() {
if (this._lastValue === this.value) {
this.emitValue()
return
}
const val = []
if (!Array.isArray(this.value)) {
if (this.value) {
val.push(
typeof this.value === 'string'
? { path: this.value }
: { ...this.value }
)
}
} else {
this.value.forEach((e) => {
val.push(typeof e === 'string' ? { path: e } : { ...e })
})
}
this.files = val.filter((e) => !!e.path)
},
},
},
methods: {
onFileChanged() {
const files = this.$refs.file.files
const file = files[0]
this.$refs.file.value = ''
this.uploadFile(file)
},
async uploadFile(file) {
const formData = new FormData()
formData.append('file', file)
try {
const res = await Axios({
method: 'post',
url: baseURL + 'api/' + this.url,
data: formData,
headers: {
'content-type': 'multipart/form-data',
'jwt-token': localStorage.getItem('token'),
},
})
this.files.push({ path: _.get(res.data, this.getFilePath) })
this.emitValue()
} catch (e) {
console.error(e)
this.$message.error('文件上传失败')
} finally {
this.uploading = false
}
},
downloadFile(item) {
window.open(
// TODO 确认文件下载地址
this.setimgUrl(item.path)
)
},
async removeFile(i) {
try {
await this.$confirm('确认删除当前文件？', {
type: 'warning',
title: '提示',
})
} catch {
return
}
this.files.splice(i, 1)
this.emitValue()
},
filename(path) {
if (!path) return ''
const i = path.lastIndexOf('/')
if (i === -1) return path
return path.substring(i + 1)
},
emitValue() {
let v
if (this.max === 1) {
v = this.files[0] && this.files[0].path
} else {
v = this.files.map((e) => e.path)
}
this._lastValue = v
this.$emit('input', v)
},
},
}
</script>
<style scoped>
.upload-files {
cursor: pointer;
}
.upload-files-add-icon {
width: 58px;
height: 58px;
display: flex;
border: 1px solid #ddd;
justify-content: center;
align-items: center;
border: 1px solid #ddd;
}
.upload-files-img {
width: 58px;
height: 58px;
object-fit: contain;
border: 1px solid #ddd;
margin-right: 10px;
}
.images {
display: flex;
}
.upload-files-file {
width: 100%;
display: flex;
align-items: center;
}
.upload-files-file .filename {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex: 1;
}
</style>
src/views/taskManage/index.vue
......@@ -809,7 +809,7 @@
<script>
import tableView from '@/common/components/base/tableView.vue'
import ChooseTimePeriod from '../../components/base/chooseTimePeriod.vue'
import ChooseTimePeriod from '@/components/base/chooseTimePeriod.vue'
import pagination from '../../mixins/pagination'
import Edit from './edit.vue'
import axios from '../../common/api/axios'
......
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