zhuce
/
lilishop-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' of gitee.com:beijing_hongye_huicheng/lilishop-ui

master
Yer 2024-02-02 18:29:12 +08:00
parent 01beac9265 77ad146e24
commit 4f7846dc4e
26 changed files with 1903 additions and 215 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
manager/src/components/editor/upload-image.vue
View File

@ -57,7 +57,7 @@
</Modal>
<Modal width="1000" v-model="showOssManager" @on-ok="confirmUrls">
<OssManage ref="ossManage" @selected="handleCallback" />
<OssManage ref="ossManage" :isComponent="true" @selected="handleCallback" />
</Modal>
</div>
</template>

2
manager/src/components/lili/upload-pic-input.vue
View File

@ -47,7 +47,7 @@
</Modal>
<Modal width="1200px" v-model="picModalFlag">
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" ref="ossManage" isComponent="true" />
</Modal>
</div>

2
manager/src/views/member/list/index.vue
View File

@ -94,7 +94,7 @@
</Form>
</Modal>
<Modal width="1200px" v-model="picModelFlag">
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
<multipleMap ref="map" @callback="selectedRegion"/>
</div>

2
manager/src/views/member/list/memberRecycle.vue
View File

@ -140,7 +140,7 @@
</Form>
</Modal>
<Modal width="1200px" v-model="picModelFlag">
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
<multipleMap ref="map" @callback="selectedRegion" />
</div>

2
manager/src/views/page-decoration/modelList/carousel1.vue
View File

@ -84,7 +84,7 @@
<liliDialog ref="liliDialog" @selectedLink="selectedLink"></liliDialog>
<!-- 选择图片 -->
<Modal width="1200px" v-model="picModelFlag" footer-hide>
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
</div>
</template>

2
manager/src/views/page-decoration/modelList/carousel2.vue
View File

@ -204,7 +204,7 @@
<liliDialog ref="liliDialog" @selectedLink="selectedLink"></liliDialog>
<!-- 选择图片 -->
<Modal width="1200px" v-model="picModelFlag" footer-hide>
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
</div>
</template>

2
manager/src/views/page-decoration/wap/advertising.vue
View File

@ -80,7 +80,7 @@
<liliDialog ref="liliDialog" @selectedLink="selectedLink" :types="linkType"></liliDialog>
</div>
<Modal width="1200px" v-model="picModelFlag">
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
</div>
</div>

2
manager/src/views/page-decoration/wap/alertAdvertising.vue
View File

@ -83,7 +83,7 @@
></liliDialog>
</div>
<Modal width="1200px" v-model="picModelFlag">
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
</div>
</div>

2
manager/src/views/page-decoration/wap/decorate.vue
View File

@ -497,7 +497,7 @@
<hotzone ref="hotzone" @changeZone="changeZone"></hotzone>
<Modal width="1200px" v-model="picModelFlag">
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
</div>
</template>

2
manager/src/views/seller/shop/shopOperation.vue
View File

@ -375,7 +375,7 @@
<Modal width="1200px" v-model="picModalFlag">
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
<Modal width="1200px" v-model="memberModalFlag">

128
manager/src/views/sys/oss-manage/ossManage.scss
View File

@ -133,3 +133,131 @@
}
}
}
.oss-manage-box {
.file-list {
height: 100%;
box-sizing: border-box;
border-right: 1px solid #e5e6eb;
padding: 16px 0 24px;
}
.pic-list {
height: 100%;
box-sizing: border-box;
padding: 0 0 24px 0;
}
.img-box {
width: 100%;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: flex-start;
align-content: flex-start;
margin-top: 20px;
.img-item {
width: 120px;
height: 158px;
box-sizing: border-box;
margin: 0 13px 8px;
position: relative;
.card {
width: 120px;
height: 120px;
border-radius: 8px;
border: 2px solid transparent;
overflow: hidden;
box-sizing: border-box;
position: relative;
img {
width: 100%;
height: 100%;
}
.checkbox {
position: absolute;
top: 10px;
right: 10px;
z-index: 1000;
}
.preview {
width: 100%;
height: 26px;
background-color: #ffffff;
text-align: center;
line-height: 30px;
color: #666666;
position: absolute;
left: 0;
bottom: 0;
display: flex;
flex-wrap: nowrap;
> div {
width: 100%;
flex: 1;
}
}
}
.card:hover,
.custom-checkbox-card-checked {
border: 2px solid #ff5c58;
}
.text {
width: 120px;
height: 36px;
cursor: pointer;
color: #252931;
font-size: 14px;
line-height: 36px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
}
}
.page-box {
display: flex;
justify-content: flex-end;
margin-top: 20px;
}
.pagination-box {
display: flex;
flex-direction: row-reverse;
}
/* Checkbox默认的样式 */
.check-box {
.ivu-checkbox {
position: absolute;
right: 10px;
top: 10px;
z-index: 100;
}
}
/* 覆盖iView默认的Checkbox样式 */
.ivu-checkbox-wrapper {
/*font-size: 16px; !* 修改字体大小 *!*/
/*color: #495060; !* 修改文本颜色 *!*/
/* 添加其他需要的样式 */
}
.ivu-checkbox-inner {
/*width: 20px; !* 修改选框大小 *!*/
/*height: 20px;*/
/*border-color: #dcdee2; !* 修改边框颜色 *!*/
/* 添加其他需要的样式 */
}
/* 当Checkbox被选中时的样式 */
.ivu-checkbox-checked .ivu-checkbox-inner {
/*background-color: #2db7f5; !* 修改选中时的背景颜色 *!*/
}
/* 当Checkbox不可用时的样式 */
.ivu-checkbox-disabled .ivu-checkbox-inner {
/*background-color: #e9e9e9; !* 修改禁用状态下的背景颜色 *!*/
}
.demo-tree-render .ivu-tree-title{
width: 94%;
}
}

512
manager/src/views/sys/oss-manage/ossManage.vue
View File

@ -27,6 +27,7 @@
margin: 0 10px;
}
}
</style>
<template>
<div class="search">
@ -61,164 +62,250 @@
</Button>
</Form>
</Row>
<div class="oss-operation padding-row">
<div>
<Upload
ref="up"
:action="commonUrl + '/common/common/upload/file'"
:data="{
<Row class="oss-manage-box">
<Col :span="isComponent?5:4">
<div class="file-list">
<div class="article-category mr_10">
<Tree :data="treeData" :render="renderContent" @on-select-change.self="handleCateChange" class="demo-tree-render"></Tree>
<div class="group-row flex" v-if="!isComponent">
<Button @click="handleClickAddGroup">添加分组</Button>
</div>
</div>
</div>
</Col>
<Col :span="isComponent?19:20">
<div class="pic-list">
<div>
<div class="oss-operation padding-row" style="display: flex;flex-direction: row-reverse;">
<div>
<Upload
ref="up"
:action="commonUrl + '/common/common/upload/file'"
:data="{
directoryPath: searchForm.fileDirectoryId,
}"
:headers="accessToken"
:max-size="20480"
:on-error="handleError"
:on-exceeded-size="handleMaxSize"
:on-success="handleSuccess"
:show-upload-list="false"
multiple
style="display: inline-block"
>
<Button>上传图片</Button>
</Upload>
<Dropdown @on-click="handleDropdown" v-if="!isComponent">
<Button>
更多操作
<Icon type="md-arrow-dropdown"/>
</Button>
<DropdownMenu slot="list">
<DropdownItem name="refresh">刷新</DropdownItem>
<DropdownItem v-show="showType == 'list'" name="removeAll"
>批量删除
</DropdownItem>
</DropdownMenu>
</Dropdown>
</div>
</div>
</div>
<Alert show-icon v-if="!isComponent">
已选择
<span>{{ selectCount }}</span> 项
<a class="select-clear" @click="clearSelectAll">清空</a>
<span v-if="selectCount > 0" style="margin-left: 15px"
>共计 {{ totalSize }} 存储量</span
>
</Alert>
<div v-show="showType === 'list'" >
<div class="flex">
<div class="article-category mr_10">
<Tree
:data="treeData"
@on-contextmenu="handleContextMenu"
@on-select-change="handleCateChange"
>
<template slot="contextMenu" v-if="!isComponent">
<DropdownItem @click.native="handleContextMenuEdit"
>编辑
</DropdownItem
>
<DropdownItem
style="color: #ed4014"
@click.native="handleContextMenuDelete"
>删除
</DropdownItem
>
</template>
</Tree>
<Alert v-if="!isComponent">鼠标右键编辑/删除分组</Alert>
<div class="group-row flex" v-if="!isComponent">
<Button @click="handleClickAddGroup">添加分组</Button>
</div>
</div>
<Table
ref="table"
:columns="isComponent ? viewColumns : columns"
:data="data"
:loading="loading"
border
class="table"
sortable="custom"
@on-sort-change="changeSort"
@on-selection-change="changeSelect"
>
<template slot="fileKey" slot-scope="{ row }">
<a @click="copyFileUrl(row)">{{ row.fileKey }}</a>
</template>
</Table>
</div>
</div>
<div v-show="showType === 'thumb'">
<div class="oss-wrapper">
<Card v-for="(item, i) in data" :key="i" class="oss-card">
<div class="content">
<img
v-if="item.fileType.indexOf('image') >= 0"
:src="item.url"
class="img"
@click="showPic(item)"
/>
<div
v-else-if="item.fileType.indexOf('video') >= 0"
class="video"
@click="showVideo(item)"
>
<!-- 文件小于5MB显示video -->
<video v-if="item.fileSize < 1024 * 1024 * 5" class="cover">
<source :src="item.url"/>
</video>
<img class="play" src="@/assets/play.png"/>
</div>
<div v-else class="other">
<div class="name">{{ item.name }}</div>
<div class="key">{{ item.fileKey }}</div>
<div class="info">
文件类型：{{ item.fileType }} 文件大小：{{
((item.fileSize * 1.0) / (1024 * 1024)).toFixed(2)
}}
MB 创建时间：{{ item.createTime }}
:headers="accessToken"
:max-size="20480"
:on-error="handleError"
:on-exceeded-size="handleMaxSize"
:on-success="handleSuccess"
:show-upload-list="false"
multiple
style="display: inline-block"
>
<Button>上传图片</Button>
</Upload>
<Dropdown @on-click="handleDropdown" v-if="!isComponent">
<Button>
更多操作
<Icon type="md-arrow-dropdown"/>
</Button>
<DropdownMenu slot="list">
<DropdownItem name="refresh">刷新</DropdownItem>
<DropdownItem v-show="showType == 'list'" name="removeAll"
>批量删除
</DropdownItem>
</DropdownMenu>
</Dropdown>
</div>
</div>
</div>
<div class="actions">
<div class="btn">
<Tooltip content="下载" placement="top">
<Icon
size="16"
type="md-download"
@click="download(item)"
/>
</Tooltip>
</div>
<div class="btn">
<Tooltip content="重命名" placement="top">
<Icon size="16" type="md-create" @click="rename(item)"/>
</Tooltip>
</div>
<div class="btn-no">
<Tooltip content="删除" placement="top">
<Icon size="16" type="md-trash" @click="remove(item)"/>
</Tooltip>
</div>
<div>
<CheckboxGroup v-model="selectedOss" @on-change="selectOssChange">
<div class="img-box">
<div v-for="(item, index) in data" :key="index" class="img-item">
<Checkbox :label="item.id+','+item.url" class="check-box">
<template>
<div class="card" @mouseenter.active="onMouseOver(item, index)" @mouseleave.active="onMouseOut(item, index)">
<!--<div class="custom-checkbox-card-mask"><div class="custom-checkbox-card-mask-dot"/></div>-->
<img :src="item.url" alt="" />
<div v-if="item.isShowPreview" class="preview">
<div @click.prevent="download(item)"><Tooltip content="下载"><Icon type="md-cloud-download" size="18" /></Tooltip></div>
<div @click.prevent="remove(item)"><Tooltip content="删除"><Icon type="md-trash" size="18" /></Tooltip></div>
<div @click.prevent="showPic(item)"><Tooltip content="预览"><Icon type="ios-eye" size="22" /></Tooltip></div>
</div>
</div>
</template>
</Checkbox>
<div>
<Tooltip :content="item.name" placement="bottom">
<div class="text">{{item.name}}</div>
</Tooltip>
</div>
</div>
</div>
</CheckboxGroup>
</div>
<div class="page-box">
<Page :total="total" :page-size="searchForm.pageSize" show-elevator @on-change="pageChange" size="small" />
</div>
</div>
</Card>
</div>
</Col>
</Row>
<!--<div class="oss-operation padding-row">-->
<!--<div>-->
<!--<Upload-->
<!--ref="up"-->
<!--:action="commonUrl + '/common/common/upload/file'"-->
<!--:data="{-->
<!--directoryPath: searchForm.fileDirectoryId,-->
<!--}"-->
<!--:headers="accessToken"-->
<!--:max-size="20480"-->
<!--:on-error="handleError"-->
<!--:on-exceeded-size="handleMaxSize"-->
<!--:on-success="handleSuccess"-->
<!--:show-upload-list="false"-->
<!--multiple-->
<!--style="display: inline-block"-->
<!--&gt;-->
<!--<Button>上传图片</Button>-->
<!--</Upload>-->
<!--<Dropdown @on-click="handleDropdown" v-if="!isComponent">-->
<!--<Button>-->
<!--更多操作-->
<!--<Icon type="md-arrow-dropdown"/>-->
<!--</Button>-->
<!--<DropdownMenu slot="list">-->
<!--<DropdownItem name="refresh">刷新</DropdownItem>-->
<!--<DropdownItem v-show="showType == 'list'" name="removeAll"-->
<!--&gt;批量删除-->
<!--</DropdownItem>-->
<!--</DropdownMenu>-->
<!--</Dropdown>-->
<!--</div>-->
<!--</div>-->
</div>
<Row class="mt_10" justify="end" type="flex">
<Page
:current="searchForm.pageNumber"
:page-size="searchForm.pageSize"
:page-size-opts="pageSizeOpts"
:total="total"
show-elevator
show-sizer
show-total
size="small"
@on-change="changePage"
@on-page-size-change="changePageSize"
></Page>
</Row>
<!--<Alert show-icon v-if="!isComponent">-->
<!--已选择-->
<!--<span>{{ selectCount }}</span> 项-->
<!--<a class="select-clear" @click="clearSelectAll">清空</a>-->
<!--<span v-if="selectCount > 0" style="margin-left: 15px"-->
<!--&gt;共计 {{ totalSize }} 存储量</span-->
<!--&gt;-->
<!--</Alert>-->
<!--<div v-show="showType === 'list'" >-->
<!--<div class="flex">-->
<!--<div class="article-category mr_10">-->
<!--<Tree-->
<!--:data="treeData"-->
<!--@on-contextmenu="handleContextMenu"-->
<!--@on-select-change="handleCateChange"-->
<!--&gt;-->
<!--<template slot="contextMenu" v-if="!isComponent">-->
<!--<DropdownItem @click.native="handleContextMenuEdit"-->
<!--&gt;编辑-->
<!--</DropdownItem-->
<!--&gt;-->
<!--<DropdownItem-->
<!--style="color: #ed4014"-->
<!--@click.native="handleContextMenuDelete"-->
<!--&gt;删除-->
<!--</DropdownItem-->
<!--&gt;-->
<!--</template>-->
<!--</Tree>-->
<!--<Alert v-if="!isComponent">鼠标右键编辑/删除分组</Alert>-->
<!--<div class="group-row flex" v-if="!isComponent">-->
<!--<Button @click="handleClickAddGroup">添加分组</Button>-->
<!--</div>-->
<!--</div>-->
<!--<Table-->
<!--ref="table"-->
<!--:columns="isComponent ? viewColumns : columns"-->
<!--:data="data"-->
<!--:loading="loading"-->
<!--border-->
<!--class="table"-->
<!--sortable="custom"-->
<!--@on-sort-change="changeSort"-->
<!--@on-selection-change="changeSelect"-->
<!--&gt;-->
<!--<template slot="fileKey" slot-scope="{ row }">-->
<!--<a @click="copyFileUrl(row)">{{ row.fileKey }}</a>-->
<!--</template>-->
<!--</Table>-->
<!--</div>-->
<!--</div>-->
<!--<div v-show="showType === 'thumb'">-->
<!--<div class="oss-wrapper">-->
<!--<Card v-for="(item, i) in data" :key="i" class="oss-card">-->
<!--<div class="content">-->
<!--<img-->
<!--v-if="item.fileType.indexOf('image') >= 0"-->
<!--:src="item.url"-->
<!--class="img"-->
<!--@click="showPic(item)"-->
<!--/>-->
<!--<div-->
<!--v-else-if="item.fileType.indexOf('video') >= 0"-->
<!--class="video"-->
<!--@click="showVideo(item)"-->
<!--&gt;-->
<!--&lt;!&ndash; 文件小于5MB显示video &ndash;&gt;-->
<!--<video v-if="item.fileSize < 1024 * 1024 * 5" class="cover">-->
<!--<source :src="item.url"/>-->
<!--</video>-->
<!--<img class="play" src="@/assets/play.png"/>-->
<!--</div>-->
<!--<div v-else class="other">-->
<!--<div class="name">{{ item.name }}</div>-->
<!--<div class="key">{{ item.fileKey }}</div>-->
<!--<div class="info">-->
<!--文件类型：{{ item.fileType }} 文件大小：{{-->
<!--((item.fileSize * 1.0) / (1024 * 1024)).toFixed(2)-->
<!--}}-->
<!--MB 创建时间：{{ item.createTime }}-->
<!--</div>-->
<!--</div>-->
<!--<div class="actions">-->
<!--<div class="btn">-->
<!--<Tooltip content="下载" placement="top">-->
<!--<Icon-->
<!--size="16"-->
<!--type="md-download"-->
<!--@click="download(item)"-->
<!--/>-->
<!--</Tooltip>-->
<!--</div>-->
<!--<div class="btn">-->
<!--<Tooltip content="重命名" placement="top">-->
<!--<Icon size="16" type="md-create" @click="rename(item)"/>-->
<!--</Tooltip>-->
<!--</div>-->
<!--<div class="btn-no">-->
<!--<Tooltip content="删除" placement="top">-->
<!--<Icon size="16" type="md-trash" @click="remove(item)"/>-->
<!--</Tooltip>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--</Card>-->
<!--</div>-->
<!--</div>-->
<!--<Row class="mt_10" justify="end" type="flex">-->
<!--<Page-->
<!--:current="searchForm.pageNumber"-->
<!--:page-size="searchForm.pageSize"-->
<!--:page-size-opts="pageSizeOpts"-->
<!--:total="total"-->
<!--show-elevator-->
<!--show-sizer-->
<!--show-total-->
<!--size="small"-->
<!--@on-change="changePage"-->
<!--@on-page-size-change="changePageSize"-->
<!--&gt;</Page>-->
<!--</Row>-->
</Card>
</Row>
<Modal
@ -342,7 +429,6 @@ export default {
commonUrl, // 上传文件路径
config, // api地址
fileDirectoryId: "",
groupFormValidate: {
id: [],
level: 0,
@ -384,7 +470,7 @@ export default {
fileKey: "",
fileType: "",
pageNumber: 1, // 当前页数
pageSize: 10, // 页面大小
pageSize: 27, // 页面大小
sort: "createTime", // 默认排序字段
order: "desc", // 默认排序方式
startDate: "", // 起始时间
@ -731,6 +817,27 @@ export default {
selectedGroupData: "",
insertOrUpdate: "insert",
groupLoading: false,
// 图片列表
selectedOss: [],
myData: [
{
title: 'parent 1',
expand: true,
render: (h, { root, node, data }) => {
return h('span', {style: {display: 'inline-block', width: '100%'}}, [
h('span', [h("Icon", {type: 'ios-folder-outline', style: {marginRight: '8px'}}), h('span', data.title)]),
h('span', {style: {display: 'inline-block', float: 'right', marginRight: '32px'}},
[h("Button", {...this.buttonProps, icon: 'ios-add', type: 'primary', style: {width: '64px'}, onClick: () => { this.append(data) }})
])
]);
},
children: [
{title: 'child 1-1', expand: true, children: [{title: 'leaf 1-1-1', expand: true}, {title: 'leaf 1-1-2', expand: true}]},
{title: 'child 1-2', expand: true, children: [{title: 'leaf 1-2-1', expand: true}, {title: 'leaf 1-2-1', expand: true}]}
]
}
],
buttonProps: {type: 'default', size: 'small',},
};
},
watch: {
@ -739,11 +846,64 @@ export default {
},
choose(val) {
if (val) this.selectImage = val
},
selectedOss(val) {
if (val) {
this.$emit("callback", {url: val[val.length-1].split(',')[1]});
}
}
},
methods: {
onMouseOver(item, index) {
this.$set(this.data[index], 'isShowPreview', true);
this.$forceUpdate();
},
onMouseOut(item, index) {
this.$set(this.data[index], 'isShowPreview', false);
},
// 复选框值改变时触发
selectOssChange(e) {
if (e) {
this.selectList = e.map(item => {return { id: item.split(',')[0]}});
this.selectCount = e.length;
// let size = 0;
// e.forEach((item) => {size += item.fileSize * 1.0;});
// this.totalSize = ((size * 1.0) / (1024 * 1024)).toFixed(2) + " MB";
this.$emit("selected", e);
}
},
// 页码改变时回调
pageChange(value) {
this.$set(this, 'selectedOss', []);
this.searchForm.pageNumber = value;
this.getDataList();
},
// 自定义tree节点显示内容和交互
renderContent (h, { root, node, data }) {
return h('span', {style: {display: 'inline-block', width: '100%'}},
[
h('span', [h("Icon", {type: 'ios-paper-outline', style: {marginRight: '8px'}}), h('span', data.title)]),
h('span', {style: {display: 'inline-block', float: 'right', marginRight: '10px'}},
[
h("Dropdown", {style: {marginLeft: "4px"}},
[
h("Icon", {props: {type: 'ios-more', size: "20",}, style: {display: 'inline-block'}, on:{click: () => {}}}),
h("DropdownMenu", {slot: "list"
}, [
h("DropdownItem", { nativeOn:{click: () => {this.handleContextMenuEdit()}} }, "编辑"),
h("DropdownItem", { nativeOn:{click: () => {this.handleContextMenuDelete()}} }, "删除"),
])
]),
])
]);
},
handleContextMenu(val) {
console.log('handleContextMenu', val);
this.selectedGroupData = val;
},
// 编辑分组
@ -768,6 +928,7 @@ export default {
const res = await delFileDirectory(this.selectedGroupData.value);
if (res.success) {
this.$Message.success("删除成功!");
this.getDataList();
this.getAllList();
}
},
@ -870,7 +1031,7 @@ export default {
obj.level = item.level;
obj.expand = false;
obj.selected = false;
obj.contextmenu = true;
obj.contextmenu = false;
obj.parentId = item.parentId;
obj.children = this.getTree(item.children); // 递归调用
arr.push(obj);
@ -881,18 +1042,21 @@ export default {
// 选择分类回调
handleCateChange(data) {
this.selectedGroupData = data[0];
let {value, type, level} = data[0];
this.list.push({value, type, level});
this.searchForm.fileDirectoryId = value;
if (value === "0" || value === 0) {
delete this.searchForm.fileDirectoryId;
this.groupFormValidate.level = 0;
} else {
this.groupFormValidate.level = Number(level) + 1;
if (data) {
this.selectedGroupData = data[0];
let {value, type, level} = data[0];
this.list.push({value, type, level});
this.searchForm.fileDirectoryId = value;
if (value === "0" || value === 0) {
delete this.searchForm.fileDirectoryId;
this.groupFormValidate.level = 0;
} else {
this.groupFormValidate.level = Number(level) + 1;
}
this.searchForm.userEnums = type;
this.getDataList();
this.$set(this, 'selectedOss', []);
}
this.searchForm.userEnums = type;
this.getDataList();
},
/**
* 选择
@ -903,7 +1067,7 @@ export default {
// 更多操作
handleDropdown(name) {
if (name === "refresh") {
this.getDataList();
this.getDataList('refresh');
} else if (name === "removeAll") {
this.removeAll();
}
@ -981,7 +1145,7 @@ export default {
this.getDataList();
},
// 获取列表数据
getDataList() {
getDataList(type = null) {
if (this.showType == "list") {
this.pageSizeOpts = [10, 20, 50];
} else {
@ -993,6 +1157,9 @@ export default {
this.data = res.result.records;
this.total = res.result.total;
if (type === 'refresh') {
this.$Message.success('刷新成功！');
}
});
},
// 搜索
@ -1064,16 +1231,15 @@ export default {
loading: true,
onOk: () => {
let ids = "";
this.selectList.forEach(function (e) {
ids += e.id + ",";
});
this.selectList.forEach(function (e) {ids += e.id + ",";});
ids = ids.substring(0, ids.length - 1);
deleteFile(ids).then((res) => {
this.$Modal.remove();
if (res.success) {
this.$set(this, 'selectedOss', []);
// this.clearSelectAll();
this.init();
this.$Message.success("批量删除文件成功");
this.clearSelectAll();
this.getDataList();
}
})
.catch((err) => {
@ -1157,6 +1323,8 @@ export default {
if (!this.isComponent) {
// 是组件的话，初始化不调用接口
this.init();
} else {
this.searchForm.pageSize =18; // 页面大小
}
},
};

2
manager/src/views/sys/setting-manage/setting/BASE_SETTING.vue
View File

@ -75,7 +75,7 @@
</div>
</Form>
<Modal width="1200px" v-model="picModelFlag">
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
</div>

41
seller/src/views/goods/goods-seller/goodsOperationSec.vue
View File

@ -102,7 +102,7 @@
<h4>商品规格及图片</h4>
<div class="form-item-view">
<FormItem class="form-item-view-el required" label="主图" prop="goodsGalleryFiles">
<div style="display: flex; flex-wrap: flex-start">
<div style="display: flex; flex-wrap: wrap;">
<vuedraggable :animation="200" :list="baseInfoForm.goodsGalleryFiles">
<div v-for="(item, __index) in baseInfoForm.goodsGalleryFiles" :key="__index"
class="demo-upload-list">
@ -110,27 +110,29 @@
<img :src="item"/>
<div class="demo-upload-list-cover">
<div>
<Icon size="30" type="md-search" @click.native="handleViewGoodsPicture(item.url)"></Icon>
<Icon size="30" type="md-search" @click.native="handleViewGoodsPicture(item)"></Icon>
<Icon size="30" type="md-trash" @click.native="handleRemoveGoodsPicture(item)"></Icon>
</div>
</div>
</template>
</div>
</vuedraggable>
<Upload ref="upload"
:action="uploadFileUrl" :before-upload="handleBeforeUploadGoodsPicture"
:format="['jpg', 'jpeg', 'png', 'webp']"
:headers="{ ...accessToken }"
:max-size="2048" :on-error="() => { $Spin.hide(); }" :on-exceeded-size="handleMaxSize"
:on-format-error="handleFormatError" :on-progress="() => { $Spin.show(); }"
:on-success="handleSuccessGoodsPicture" :show-upload-list="false" multiple
style="margin-left: 10px"
type="drag">
<div style="width: 148px; height: 148px; line-height: 148px">
<Icon size="20" type="md-add"></Icon>
</div>
</Upload>
<!--<Upload ref="upload"-->
<!--:action="uploadFileUrl" :before-upload="handleBeforeUploadGoodsPicture"-->
<!--:format="['jpg', 'jpeg', 'png', 'webp']"-->
<!--:headers="{ ...accessToken }"-->
<!--:max-size="2048" :on-error="() => { $Spin.hide(); }" :on-exceeded-size="handleMaxSize"-->
<!--:on-format-error="handleFormatError" :on-progress="() => { $Spin.show(); }"-->
<!--:on-success="handleSuccessGoodsPicture" :show-upload-list="false" multiple-->
<!--style="margin-left: 10px"-->
<!--type="drag">-->
<!--<div style="width: 148px; height: 148px; line-height: 148px">-->
<!--<Icon size="20" type="md-add"></Icon>-->
<!--</div>-->
<!--</Upload>-->
</div>
<div style="width: 100%;display: flex;justify-content: start;margin-top: 10px;">
<Button @click="handleCLickImg('goodsGalleryFiles')" type="primary">上传图片</Button>
</div>
<Modal v-model="goodsPictureVisible" title="View Image">
<img v-if="goodsPictureVisible" :src="previewGoodsPicture" style="width: 100%"/>
@ -474,7 +476,7 @@
<!--<ossManage @callback="callbackSelected" ref="ossManage" />-->
<!--</Modal>-->
<Modal v-model="picModalFlag" width="1200px" @on-ok="confirmUrls">
<ossManage ref="ossManage" @callback="callbackSelected" @selected="(list)=>{ selectedImage = list}"/>
<ossManage ref="ossManage" :isComponent="true" @callback="callbackSelected" @selected="(list)=>{ selectedImage = list}"/>
</Modal>
</div>
@ -490,7 +492,7 @@ import {uploadFile} from "@/libs/axios";
import {regular} from "@/utils";
import DPlayer from 'dplayer';
// import ossManage from "@/views/sys/oss-manage/ossManage";
import ossManage from "@/views/shop/ossManage";
import ossManage from "@/views/shop/ossManages";
export default {
@ -745,8 +747,9 @@ export default {
if (val && this.selectedFormBtnName == 'selectedSkuImages') {
this.selectedSku.images.push(val);
} else {
this.baseInfoForm[this.selectedFormBtnName].push(val);
this.baseInfoForm[this.selectedFormBtnName].push(val.url);
}
},
confirmUrls() {
if (this.selectedImage && this.selectedFormBtnName == 'selectedSkuImages') {

2
seller/src/views/lili-components/editor/upload-image.vue
View File

@ -57,7 +57,7 @@
</Modal>
<Modal width="1000" v-model="showOssManager" @on-ok="confirmUrls">
<OssManage ref="ossManage" @selected="(list)=>{ selectedImage = list}" @callback="handleCallback" />
<OssManage ref="ossManage" :isComponent="true" @selected="(list)=>{ selectedImage = list}" @callback="handleCallback" />
</Modal>
</div>
</template>

4
seller/src/views/my-components/lili/upload-pic-thumb.vue
View File

@ -57,7 +57,7 @@
</Modal>
<Modal width="1200px" v-model="picModalFlag" @on-ok="confirmUrls">
<ossManage @callback="callbackSelected" @selected="(list)=>{ selectedImage = list}" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" @selected="(list)=>{ selectedImage = list}" ref="ossManage" />
</Modal>
</div>
</template>
@ -65,7 +65,7 @@
<script>
import { uploadFile } from "@/libs/axios";
import vuedraggable from "vuedraggable";
import ossManage from "@/views/shop/ossManage";
import ossManage from "@/views/shop/ossManages";
export default {
name: "uploadPicThumb",
components: {

2
seller/src/views/shop/hotzone/components/Zone.vue
View File

@ -100,7 +100,7 @@
import changeSize from "../directives/changeSize";
import dragItem from "../directives/dragItem";
// import ossManage from "@/views/sys/oss-manage/ossManage";
import ossManage from "@/views/shop/ossManage";
import ossManage from "@/views/shop/ossManages";
export default {
name: "Zone",

2
seller/src/views/shop/modelFormItem.vue
View File

@ -231,7 +231,7 @@ import Recommend from "./modelList/recommend.vue";
import NotEnough from "./modelList/notEnough.vue";
import Seckill from "./modelList/seckill.vue";
// import ossManage from "@/views/sys/oss-manage/ossManage";
import ossManage from "@/views/shop/ossManage";
import ossManage from "@/views/shop/ossManages";
export default {
name: "modelFormItem",

2
seller/src/views/shop/modelList/carousel.vue
View File

@ -121,7 +121,7 @@
<script>
// import ossManage from "@/views/sys/oss-manage/ossManage";
import ossManage from "@/views/shop/ossManage";
import ossManage from "@/views/shop/ossManages";
export default {
name: "modelCarousel",
props: ["data"],

4
seller/src/views/shop/modelList/carousel1.vue
View File

@ -85,14 +85,14 @@
></liliDialog>
<!-- 选择图片 -->
<Modal width="1200px" v-model="picModelFlag" footer-hide>
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
</div>
</template>
<script>
// import ossManage from "@/views/sys/oss-manage/ossManage";
import ossManage from "@/views/shop/ossManage";
import ossManage from "@/views/shop/ossManages";
export default {
name: "modelCarousel",
props: ["data"],

2
seller/src/views/shop/modelList/carousel2.vue
View File

@ -175,7 +175,7 @@
></liliDialog>
<!-- 选择图片 -->
<Modal width="1200px" v-model="picModelFlag" footer-hide>
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
</div>
</template>

2
seller/src/views/shop/modelList/newGoodsSort.vue
View File

@ -140,7 +140,7 @@
</template>
<script>
// import ossManage from "@/views/sys/oss-manage/ossManage";
import ossManage from "@/views/shop/ossManage";
import ossManage from "@/views/shop/ossManages";
export default {
props:{
data:{

2
seller/src/views/shop/modelList/recommend.vue
View File

@ -206,7 +206,7 @@
</template>
<script>
// import ossManage from "@/views/sys/oss-manage/ossManage";
import ossManage from "@/views/shop/ossManage";
import ossManage from "@/views/shop/ossManages";
export default {
props: {
data: {

263
seller/src/views/shop/ossManage.scss Normal file
View File

@ -0,0 +1,263 @@
.search {
.oss-operation {
margin-bottom: 2vh;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
button {
margin-right: 5px;
}
}
}
.none {
display: none;
}
.oss-wrapper {
display: flex;
flex-wrap: wrap;
position: relative;
}
.oss-card {
margin: 10px 20px 10px 0;
width: 290px;
:hover {
.content .other .name {
color: #1890ff;
transition: color .3s;
}
}
cursor: pointer;
.ivu-card-body {
padding: 0;
}
.content {
display: flex;
flex-direction: column;
:hover {
.play {
transition: opacity .3s;
opacity: 1 !important;
}
}
.img {
height: 135px;
object-fit: cover;
}
.video {
height: 135px;
position: relative;
.cover {
height: 100%;
width: 100%;
object-fit: fill;
}
.play {
position: absolute;
top: 43px;
left: 117px;
height: 50px;
width: 50px;
opacity: 0.8;
}
}
.other {
padding: 16px;
height: 135px;
.name {
font-size: 16px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
color: rgba(0, 0, 0, .85);
font-weight: 500;
margin-bottom: 4px;
}
.key {
overflow: hidden;
text-overflow: ellipsis;
height: 45px;
word-break: break-all;
color: rgba(0, 0, 0, .45);
}
.info {
font-size: 12px;
color: rgba(0, 0, 0, .45);
overflow: hidden;
text-overflow: ellipsis;
height: 36px;
word-break: break-all;
}
}
.actions {
display: flex;
align-items: center;
height: 50px;
background: #f7f9fa;
border-top: 1px solid #e8e8e8;
i:hover {
color: #1890ff;
}
.btn {
display: flex;
justify-content: center;
width: 33.33%;
border-right: 1px solid #e8e8e8;
}
.btn-no {
display: flex;
justify-content: center;
width: 33.33%;
}
}
}
}
.oss-manage-box {
.file-list {
height: 100%;
box-sizing: border-box;
border-right: 1px solid #e5e6eb;
padding: 16px 0 24px;
}
.pic-list {
height: 100%;
box-sizing: border-box;
padding: 0 0 24px 0;
}
.img-box {
width: 100%;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: flex-start;
align-content: flex-start;
margin-top: 20px;
.img-item {
width: 120px;
height: 158px;
box-sizing: border-box;
margin: 0 13px 8px;
position: relative;
.card {
width: 120px;
height: 120px;
border-radius: 8px;
border: 2px solid transparent;
overflow: hidden;
box-sizing: border-box;
position: relative;
img {
width: 100%;
height: 100%;
}
.checkbox {
position: absolute;
top: 10px;
right: 10px;
z-index: 1000;
}
.preview {
width: 100%;
height: 26px;
background-color: #ffffff;
text-align: center;
line-height: 30px;
color: #666666;
position: absolute;
left: 0;
bottom: 0;
display: flex;
flex-wrap: nowrap;
> div {
width: 100%;
flex: 1;
}
}
}
.card:hover,
.custom-checkbox-card-checked {
border: 2px solid #ff5c58;
}
.text {
width: 120px;
height: 36px;
cursor: pointer;
color: #252931;
font-size: 14px;
line-height: 36px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
}
}
.page-box {
display: flex;
justify-content: flex-end;
margin-top: 20px;
}
.pagination-box {
display: flex;
flex-direction: row-reverse;
}
/* Checkbox默认的样式 */
.check-box {
.ivu-checkbox {
position: absolute;
right: 10px;
top: 10px;
z-index: 100;
}
}
/* 覆盖iView默认的Checkbox样式 */
.ivu-checkbox-wrapper {
/*font-size: 16px; !* 修改字体大小 *!*/
/*color: #495060; !* 修改文本颜色 *!*/
/* 添加其他需要的样式 */
}
.ivu-checkbox-inner {
/*width: 20px; !* 修改选框大小 *!*/
/*height: 20px;*/
/*border-color: #dcdee2; !* 修改边框颜色 *!*/
/* 添加其他需要的样式 */
}
/* 当Checkbox被选中时的样式 */
.ivu-checkbox-checked .ivu-checkbox-inner {
/*background-color: #2db7f5; !* 修改选中时的背景颜色 *!*/
}
/* 当Checkbox不可用时的样式 */
.ivu-checkbox-disabled .ivu-checkbox-inner {
/*background-color: #e9e9e9; !* 修改禁用状态下的背景颜色 *!*/
}
.demo-tree-render .ivu-tree-title{
width: 94%;
}
}

1126
seller/src/views/shop/ossManages.vue Normal file
View File

File diff suppressed because it is too large Load Diff

4
seller/src/views/shop/wap/decorate.vue
View File

@ -221,13 +221,13 @@
></liliDialog>
<hotzone ref="hotzone" @changeZone="changeZone"></hotzone>
<Modal width="1200px" v-model="picModelFlag">
<ossManage @callback="callbackSelected" ref="ossManage" />
<ossManage @callback="callbackSelected" :isComponent="true" ref="ossManage" />
</Modal>
</div>
</template>
<script>
// import ossManage from "@/views/sys/oss-manage/ossManage";
import ossManage from "@/views/shop/ossManage";
import ossManage from "@/views/shop/ossManages";
import hotzone from "@/views/shop/hotzone";
import { modelData } from "./config";
import ways from "@/views/lili-dialog/wap.js"; // 选择链接的类型