sileya-ai
/
vr-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1.上传功能细节优化 

sws 2024-08-19
v1.0.0
sws 2024-08-19 16:43:03 +08:00
parent d81e52816e
commit 2dd8d613ae
13 changed files with 547 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

537
src/assets/icons/demo_index.html
View File

@ -54,6 +54,132 @@
<div class="content unicode" style="display: block;">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe635;</span>
<div class="name">三点</div>
<div class="code-name">&amp;#xe635;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe795;</span>
<div class="name">编辑 (2)</div>
<div class="code-name">&amp;#xe795;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe74a;</span>
<div class="name">问号</div>
<div class="code-name">&amp;#xe74a;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe7b6;</span>
<div class="name">双箭头 右</div>
<div class="code-name">&amp;#xe7b6;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe782;</span>
<div class="name">EXE</div>
<div class="code-name">&amp;#xe782;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe786;</span>
<div class="name">TXT</div>
<div class="code-name">&amp;#xe786;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe794;</span>
<div class="name">1个</div>
<div class="code-name">&amp;#xe794;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe789;</span>
<div class="name">横2</div>
<div class="code-name">&amp;#xe789;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe78a;</span>
<div class="name">4x4</div>
<div class="code-name">&amp;#xe78a;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe78b;</span>
<div class="name">左1右2</div>
<div class="code-name">&amp;#xe78b;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe78c;</span>
<div class="name">竖3</div>
<div class="code-name">&amp;#xe78c;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe78d;</span>
<div class="name">上2下1</div>
<div class="code-name">&amp;#xe78d;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe78e;</span>
<div class="name">左1右上1右下2</div>
<div class="code-name">&amp;#xe78e;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe78f;</span>
<div class="name">上1下2</div>
<div class="code-name">&amp;#xe78f;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe790;</span>
<div class="name">田字格</div>
<div class="code-name">&amp;#xe790;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe792;</span>
<div class="name">上2下3</div>
<div class="code-name">&amp;#xe792;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe793;</span>
<div class="name">左2右1</div>
<div class="code-name">&amp;#xe793;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe77b;</span>
<div class="name">竖2</div>
<div class="code-name">&amp;#xe77b;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe72b;</span>
<div class="name">上传</div>
<div class="code-name">&amp;#xe72b;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe741;</span>
<div class="name">进销存对号</div>
<div class="code-name">&amp;#xe741;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe791;</span>
<div class="name">购物车1</div>
<div class="code-name">&amp;#xe791;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe787;</span>
<div class="name">PDF</div>
@ -72,12 +198,6 @@
<div class="code-name">&amp;#xe785;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe786;</span>
<div class="name">THT</div>
<div class="code-name">&amp;#xe786;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe783;</span>
<div class="name">vsd</div>
@ -120,12 +240,6 @@
<div class="code-name">&amp;#xe781;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe782;</span>
<div class="name">EHE</div>
<div class="code-name">&amp;#xe782;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe77c;</span>
<div class="name">文件1</div>
@ -426,10 +540,10 @@
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.woff2?t=1721714218560') format('woff2'),
url('iconfont.woff?t=1721714218560') format('woff'),
url('iconfont.ttf?t=1721714218560') format('truetype'),
url('iconfont.svg?t=1721714218560#iconfont') format('svg');
src: url('iconfont.woff2?t=1724054334931') format('woff2'),
url('iconfont.woff?t=1724054334931') format('woff'),
url('iconfont.ttf?t=1724054334931') format('truetype'),
url('iconfont.svg?t=1724054334931#iconfont') format('svg');
}
</code></pre>
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@ -455,6 +569,195 @@
<div class="content font-class">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont icon-ellipsis"></span>
<div class="name">
三点
</div>
<div class="code-name">.icon-ellipsis
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-commodity-edit"></span>
<div class="name">
编辑 (2)
</div>
<div class="code-name">.icon-commodity-edit
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tips"></span>
<div class="name">
问号
</div>
<div class="code-name">.icon-tips
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-arrow-right-dbl"></span>
<div class="name">
双箭头 右
</div>
<div class="code-name">.icon-arrow-right-dbl
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-EXE"></span>
<div class="name">
EXE
</div>
<div class="code-name">.icon-EXE
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-txt"></span>
<div class="name">
TXT
</div>
<div class="code-name">.icon-txt
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-1ge"></span>
<div class="name">
1个
</div>
<div class="code-name">.icon-a-1ge
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-heng2"></span>
<div class="name">
横2
</div>
<div class="code-name">.icon-heng2
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-a-4x4"></span>
<div class="name">
4x4
</div>
<div class="code-name">.icon-a-4x4
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-zuo1you2"></span>
<div class="name">
左1右2
</div>
<div class="code-name">.icon-zuo1you2
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shu3"></span>
<div class="name">
竖3
</div>
<div class="code-name">.icon-shu3
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shang2xia1"></span>
<div class="name">
上2下1
</div>
<div class="code-name">.icon-shang2xia1
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-zuo1youshang1youxia2"></span>
<div class="name">
左1右上1右下2
</div>
<div class="code-name">.icon-zuo1youshang1youxia2
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shang1xia2"></span>
<div class="name">
上1下2
</div>
<div class="code-name">.icon-shang1xia2
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tianzige"></span>
<div class="name">
田字格
</div>
<div class="code-name">.icon-tianzige
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shang2xia3"></span>
<div class="name">
上2下3
</div>
<div class="code-name">.icon-shang2xia3
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-zuo2you1"></span>
<div class="name">
左2右1
</div>
<div class="code-name">.icon-zuo2you1
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-shu2"></span>
<div class="name">
竖2
</div>
<div class="code-name">.icon-shu2
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-upload"></span>
<div class="name">
上传
</div>
<div class="code-name">.icon-upload
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-true"></span>
<div class="name">
进销存对号
</div>
<div class="code-name">.icon-true
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-cart"></span>
<div class="name">
购物车1
</div>
<div class="code-name">.icon-cart
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-pdf"></span>
<div class="name">
@ -482,15 +785,6 @@
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tht"></span>
<div class="name">
THT
</div>
<div class="code-name">.icon-tht
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-vsd"></span>
<div class="name">
@ -554,15 +848,6 @@
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-ehe"></span>
<div class="name">
EHE
</div>
<div class="code-name">.icon-ehe
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-file"></span>
<div class="name">
@ -1013,6 +1298,174 @@
<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-ellipsis"></use>
</svg>
<div class="name">三点</div>
<div class="code-name">#icon-ellipsis</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-commodity-edit"></use>
</svg>
<div class="name">编辑 (2)</div>
<div class="code-name">#icon-commodity-edit</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tips"></use>
</svg>
<div class="name">问号</div>
<div class="code-name">#icon-tips</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-arrow-right-dbl"></use>
</svg>
<div class="name">双箭头 右</div>
<div class="code-name">#icon-arrow-right-dbl</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-EXE"></use>
</svg>
<div class="name">EXE</div>
<div class="code-name">#icon-EXE</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-txt"></use>
</svg>
<div class="name">TXT</div>
<div class="code-name">#icon-txt</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-1ge"></use>
</svg>
<div class="name">1个</div>
<div class="code-name">#icon-a-1ge</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-heng2"></use>
</svg>
<div class="name">横2</div>
<div class="code-name">#icon-heng2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-a-4x4"></use>
</svg>
<div class="name">4x4</div>
<div class="code-name">#icon-a-4x4</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-zuo1you2"></use>
</svg>
<div class="name">左1右2</div>
<div class="code-name">#icon-zuo1you2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shu3"></use>
</svg>
<div class="name">竖3</div>
<div class="code-name">#icon-shu3</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shang2xia1"></use>
</svg>
<div class="name">上2下1</div>
<div class="code-name">#icon-shang2xia1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-zuo1youshang1youxia2"></use>
</svg>
<div class="name">左1右上1右下2</div>
<div class="code-name">#icon-zuo1youshang1youxia2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shang1xia2"></use>
</svg>
<div class="name">上1下2</div>
<div class="code-name">#icon-shang1xia2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tianzige"></use>
</svg>
<div class="name">田字格</div>
<div class="code-name">#icon-tianzige</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shang2xia3"></use>
</svg>
<div class="name">上2下3</div>
<div class="code-name">#icon-shang2xia3</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-zuo2you1"></use>
</svg>
<div class="name">左2右1</div>
<div class="code-name">#icon-zuo2you1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-shu2"></use>
</svg>
<div class="name">竖2</div>
<div class="code-name">#icon-shu2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-upload"></use>
</svg>
<div class="name">上传</div>
<div class="code-name">#icon-upload</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-true"></use>
</svg>
<div class="name">进销存对号</div>
<div class="code-name">#icon-true</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-cart"></use>
</svg>
<div class="name">购物车1</div>
<div class="code-name">#icon-cart</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-pdf"></use>
@ -1037,14 +1490,6 @@
<div class="code-name">#icon-word</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tht"></use>
</svg>
<div class="name">THT</div>
<div class="code-name">#icon-tht</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-vsd"></use>
@ -1101,14 +1546,6 @@
<div class="code-name">#icon-excel</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-ehe"></use>
</svg>
<div class="name">EHE</div>
<div class="code-name">#icon-ehe</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-file"></use>

12
src/assets/icons/iconfont.css
View File

@ -1,9 +1,9 @@
@font-face {
font-family: "iconfont"; /* Project id 4607934 */
src: url('iconfont.woff2?t=1723603502806') format('woff2'),
url('iconfont.woff?t=1723603502806') format('woff'),
url('iconfont.ttf?t=1723603502806') format('truetype'),
url('iconfont.svg?t=1723603502806#iconfont') format('svg');
src: url('iconfont.woff2?t=1724054334931') format('woff2'),
url('iconfont.woff?t=1724054334931') format('woff'),
url('iconfont.ttf?t=1724054334931') format('truetype'),
url('iconfont.svg?t=1724054334931#iconfont') format('svg');
}
.iconfont {
@ -14,6 +14,10 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-ellipsis:before {
content: "\e635";
}
.icon-commodity-edit:before {
content: "\e795";
}

2
src/assets/icons/iconfont.js
View File

File diff suppressed because one or more lines are too long

7
src/assets/icons/iconfont.json
View File

@ -5,6 +5,13 @@
"css_prefix_text": "icon-",
"description": "web端",
"glyphs": [
{
"icon_id": "39793709",
"name": "三点",
"font_class": "ellipsis",
"unicode": "e635",
"unicode_decimal": 58933
},
{
"icon_id": "41451474",
"name": "编辑 (2)",

2
src/assets/icons/iconfont.svg
View File

@ -14,6 +14,8 @@
/>
<missing-glyph />
<glyph glyph-name="ellipsis" unicode="&#58933;" d="M169.319538 289.773795a94.226205 94.226205 0 1 0 0 188.45241 94.226205 94.226205 0 0 0 0-188.45241z m342.680462 0a94.226205 94.226205 0 1 0 0 188.45241 94.226205 94.226205 0 0 0 0-188.45241z m342.680462 0a94.226205 94.226205 0 1 0 0 188.45241 94.226205 94.226205 0 0 0 0-188.45241z" horiz-adv-x="1024" />
<glyph glyph-name="commodity-edit" unicode="&#59285;" d="M439.9616 156.5184a20.1216 20.1216 0 0 0-13.0048 4.7104l-139.264 113.664a20.6336 20.6336 0 0 0-2.56 29.5424l358.0416 417.792a20.5824 20.5824 0 0 0 28.8256 2.56l139.2128-113.7664a20.6336 20.6336 0 0 0 2.6112-29.4912l-358.0416-417.792a21.0944 21.0944 0 0 0-15.8208-7.2192z m-109.6704 137.1648l107.0592-87.552 331.2128 386.2528-107.1104 87.552-331.1616-386.2528zM259.072 77.2096a20.8384 20.8384 0 0 0-20.48 24.064l29.9008 183.3472a20.7872 20.7872 0 0 0 40.96-6.656l-24.064-147.8656 140.1856 53.0944a20.7872 20.7872 0 0 0 14.7456-38.7584l-173.7728-65.9456a20.736 20.736 0 0 0-7.424-1.28zM512.0512-128C229.7344-128 0 101.7344 0 384.0512 0 666.4192 229.7344 896 512.0512 896c282.368 0 512.0512-229.7344 512.0512-512.0512 0-282.368-229.6832-511.9488-512-511.9488z m0 982.5792C252.6208 854.5792 41.5232 643.584 41.5232 384.0512c0-259.4304 211.0976-470.528 470.528-470.528 259.4816 0 470.528 211.0976 470.528 470.528 0 259.4816-211.0464 470.528-470.528 470.528z" horiz-adv-x="1024" />
<glyph glyph-name="tips" unicode="&#59210;" d="M512 814.592a422.4 422.4 0 1 1 422.4-422.4A422.4 422.4 0 0 1 512 814.592z m26.624-629.76a45.056 45.056 0 0 0-31.232-12.288 42.496 42.496 0 0 0-31.232 12.8 41.984 41.984 0 0 0-12.8 30.72 39.424 39.424 0 0 0 12.8 30.72 42.496 42.496 0 0 0 31.232 12.288 43.008 43.008 0 0 0 31.744-12.288 39.424 39.424 0 0 0 12.8-30.72 43.008 43.008 0 0 0-13.312-31.744z m87.04 235.52a617.472 617.472 0 0 0-51.2-47.104 93.184 93.184 0 0 1-25.088-31.232 80.896 80.896 0 0 1-9.728-39.936v-10.24h-64v10.24a119.808 119.808 0 0 0 12.288 57.344A311.296 311.296 0 0 0 555.52 435.2l10.24 11.264a71.168 71.168 0 0 1 16.896 44.032A69.632 69.632 0 0 1 563.2 537.6a69.632 69.632 0 0 1-51.2 17.92 67.072 67.072 0 0 1-58.88-26.112 102.4 102.4 0 0 1-16.384-61.44h-61.44a140.288 140.288 0 0 0 37.888 102.4 140.8 140.8 0 0 0 104.96 38.4 135.68 135.68 0 0 0 96.256-29.184 108.032 108.032 0 0 0 36.352-86.528 116.736 116.736 0 0 0-25.088-73.216z" horiz-adv-x="1024" />

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 67 KiB

After

Width:  |  Height:  |  Size: 67 KiB

BIN
src/assets/icons/iconfont.ttf
View File

Binary file not shown.

BIN
src/assets/icons/iconfont.woff
View File

Binary file not shown.

BIN
src/assets/icons/iconfont.woff2
View File

Binary file not shown.

8
src/components/common/upload/form-upload-category.vue
View File

@ -1,5 +1,5 @@
<template>
<el-dialog v-model="dialog_visible_category_oprate" class="radius-lg" width="500" draggable append-to-body>
<el-dialog v-model="dialog_visible_category_operate" class="radius-lg" width="500" draggable append-to-body>
<template #header>
<div class="title center re">
<div class="tc size-16 fw">{{ type == 'add' ? '添加' : '编辑' }}附件分类</div>
@ -60,7 +60,7 @@ const props = defineProps({
default: '',
},
});
const dialog_visible_category_oprate = defineModel({ type: Boolean, default: false });
const dialog_visible_category_operate = defineModel({ type: Boolean, default: false });
const form = ref<Tree>({
id: '',
pid: '',
@ -71,7 +71,7 @@ const form = ref<Tree>({
items: [],
});
watch(
() => dialog_visible_category_oprate.value,
() => dialog_visible_category_operate.value,
(newValue) => {
if (newValue && props.type !== 'add') {
form.value = cloneDeep(props.value);
@ -107,7 +107,7 @@ onMounted(() => {
});
const cancel_event = (formEl: FormInstance | undefined) => {
dialog_visible_category_oprate.value = false;
dialog_visible_category_operate.value = false;
formEl?.resetFields();
};
const emit = defineEmits(['update:modelValue', 'confirm']);

20
src/components/common/upload/index.scss
View File

@ -6,7 +6,7 @@
.el-tree {
--el-tree-node-content-height: 40px;
}
.category-oprate {
.category-operate {
.icon:hover {
color: $cr-primary;
}
@ -53,7 +53,7 @@
opacity: 1;
}
}
.oprate {
.operate {
position: absolute;
bottom: 0rem;
left: 0;
@ -61,7 +61,7 @@
z-index: 1;
height: 2.4rem;
overflow: hidden;
.oprate-content {
.operate-content {
opacity: 0;
transition: all 0.5s linear;
position: absolute;
@ -74,7 +74,7 @@
border-bottom-right-radius: 0.4rem;
height: 2.4rem;
}
.oprate-icon {
.operate-icon {
position: relative;
&::before {
content: '';
@ -106,7 +106,7 @@
line-height: 2.8rem;
}
&:hover {
.oprate-content {
.operate-content {
opacity: 1 !important;
bottom: 0 !important;
}
@ -165,3 +165,13 @@
line-height: normal;
}
}
.tree-operate {
.item {
transition: all 0.3s linear;
&:hover {
background-color: #f5f7fa;
color: $cr-primary;
}
}
}

22
src/components/common/upload/index.vue
View File

@ -26,14 +26,16 @@
<template #default="{ node, data }">
<div class="custom-tree-node flex-row jc-sb gap-10 align-c w pr-10" :class="data.is_enable == 0 || node.parent.data.is_enable == 0 ? 'disabled bg-red' : ''">
<div class="flex-1 flex-width text-line-1 block">{{ data.name }}</div>
<div v-if="data.id" class="flex-row gap-10 cr-9 category-oprate c-pointer">
<el-popover placement="right" :width="400" trigger="click">
<div v-if="data.id" class="flex-row gap-10 cr-9 category-operate c-pointer">
<el-popover placement="bottom" width="70" trigger="hover">
<template #reference>
<icon name="ellipsis" size="14" color="9"></icon>
<icon name="ellipsis" size="14"></icon>
</template>
<div v-if="data.pid == 0" @click.stop="append_type_event(data)"><icon class="icon" name="add" size="12"></icon>新增</div>
<div @click.stop="edit_type_event(data)"><icon class="icon" name="edit" size="12"></icon>编辑</div>
<div @click.stop="remove_type_event(node, data)"><icon class="icon" name="del" size="12"></icon>删除</div>
<div class="flex-col gap-12 tree-operate">
<div v-if="data.pid == 0" class="flex-row gap-5 c-pointer w item" @click.stop="append_type_event(data)"><icon class="icon" name="add" size="12"></icon>新增</div>
<div class="flex-row gap-5 c-pointer w item" @click.stop="edit_type_event(data)"><icon class="icon" name="edit" size="12"></icon>编辑</div>
<div class="flex-row gap-5 c-pointer w item" @click.stop="remove_type_event(node, data)"><icon class="icon" name="del" size="12"></icon>删除</div>
</div>
</el-popover>
</div>
</div>
@ -43,7 +45,7 @@
</div>
<div class="right-content flex-1 flex-width">
<div class="flex-row jc-sb align-c mb-15">
<div class="right-oprate flex-row">
<div class="right-operate flex-row">
<el-button type="primary" plain @click="upload_model_open">上传{{ upload_type_name }}</el-button>
<el-button @click="mult_del_event">删除{{ upload_type_name }}</el-button>
<!-- <el-cascader :show-all-levels="false" clearable></el-cascader> -->
@ -89,12 +91,12 @@
<div class="check-icon fill flex-row jc-c align-c" :class="view_list_value.findIndex((i) => i.id === item.id) !== -1 ? 'active' : ''">
<icon name="true-o" color="f" size="26"></icon>
</div>
<div class="oprate">
<div class="oprate-content flex-row jc-sa align-c">
<div class="operate">
<div class="operate-content flex-row jc-sa align-c">
<div class="flex-1 tc c-pointer" @click.stop="edit_event(item, index)">
<icon name="edit" class="flex-1" size="14" color="f"></icon>
</div>
<div v-if="upload_type !== 'file'" class="oprate-icon flex-1 tc c-pointer" @click.stop="preview_event(item, index)">
<div v-if="upload_type !== 'file'" class="operate-icon flex-1 tc c-pointer" @click.stop="preview_event(item, index)">
<icon name="eye" size="14" color="f"></icon>
</div>
<div class="flex-1 tc c-pointer" @click.stop="del_event(item)">

14
src/components/common/upload/upload-model.vue
View File

@ -38,7 +38,7 @@
<div class="table-cell">文件名</div>
<div class="table-cell">文件大小</div>
<div class="table-cell">上传状态</div>
<div class="table-cell-oprate">操作</div>
<div class="table-cell-operate">操作</div>
</div>
</div>
<div id="dropzone" @dragover.prevent="handle_drag_in" @dragenter="handle_drag_in" @dragleave="handle_drag_leave" @drop.prevent="handle_drop">
@ -73,7 +73,7 @@
</div>
<div class="table-cell">{{ annex_size_to_unit(item.file.size) }}</div>
<div class="table-cell" :class="item.status">{{ item.status == 'loading' ? '上传中' : item.status == 'success' ? '上传成功' : item.status == 'error' ? '上传失败' : '等待上传' }}{{ item.status == 'loading' ? '(' + item.progress + '%)' : '' }}</div>
<div class="table-cell-oprate" @click="del_upload(index)">移除</div>
<div class="table-cell-operate" @click="del_upload(index)">移除</div>
</div>
</div>
</div>
@ -98,7 +98,7 @@
<div class="table-row">
<div class="table-cell">文件名</div>
<div class="table-cell">文件大小</div>
<div class="table-cell-oprate">操作</div>
<div class="table-cell-operate">操作</div>
</div>
</div>
<el-scrollbar height="224px">
@ -129,7 +129,7 @@
<div class="desc">{{ item.title }}</div>
</div>
<div class="table-cell">{{ annex_size_to_unit(item.size) }}</div>
<div class="table-cell-oprate" @click="del_already_upload(item.id, index)">删除</div>
<div class="table-cell-operate" @click="del_already_upload(item.id, index)">删除</div>
</div>
</div>
</el-scrollbar>
@ -634,7 +634,7 @@ const close_dialog = () => {
width: 0;
}
}
.table-cell-oprate {
.table-cell-operate {
padding: 1rem;
width: 5rem;
cursor: pointer;
@ -647,10 +647,10 @@ const close_dialog = () => {
}
.table-body {
.table-cell,
.table-cell-oprate {
.table-cell-operate {
padding: 1.5rem 1rem !important;
}
.table-cell-oprate {
.table-cell-operate {
color: $cr-primary;
}
}

4
src/styles/index.scss
View File

@ -170,3 +170,7 @@ div:focus {
right: -1.6rem;
}
}
.el-popover.el-popper {
min-width: 5rem;
}