Skip to content

E
ElectricitySheep
Commit 4fe69012 authored by 黄奎's avatar 黄奎
Browse files
Options

新增多选

parent b4603283
Hide whitespace changes
Inline Side-by-side
Showing with 590 additions and 565 deletions
src/components/CommodityMan/materialMan.vue
View file @ 4fe69012
<template>
<div class="ChooseImg materialMan">
<div class="head-title">
<span class="point" @click="SelectRecycled(1)" :class="scgroupMsg.Recycled==2 ? 'blue' :''">素材管理</span>
<span v-if="scgroupMsg.Recycled==2"> / 回收站</span>
<el-button @click="SelectRecycled(2)" style="float:right;margin-top: -5px;" size="small" type="primary">回收站</el-button>
<span class="point" @click="SelectRecycled(1)" :class="scgroupMsg.Recycled==2 ? 'blue' :''">素材管理</span>
<span v-if="scgroupMsg.Recycled==2"> / 回收站</span>
<el-button @click="SelectRecycled(2)" style="float:right;margin-top: -5px;" size="small" type="primary">回收站
</el-button>
</div>
<div v-loading="loading" style="margin-top:10px;background:#fff;padding:20px">
<div class="TabDiv">
<span :class="commonType==1?'spanActive':''" @click="handleClick(1)">图片</span>
<span :class="commonType==2?'spanActive':''" @click="handleClick(2)">视频</span>
</div>
<div>
<div style="height: 718px;" flex="box:first">
<div style="margin-right: 15px;width: auto;-webkit-box-flex: 0;flex-shrink: 0;flex-grow: 0;">
<el-button @click="addGroup" style="margin-bottom: 12px;" type="primary" size="small">添加分组</el-button>
<div style="border: 1px solid rgb(227, 227, 227);width:250px">
<!-- <div style="margin:20px 0">
<div class="TabDiv">
<span :class="commonType==1?'spanActive':''" @click="handleClick(1)">图片</span>
<span :class="commonType==2?'spanActive':''" @click="handleClick(2)">视频</span>
</div>
<div>
<div style="height: 718px;" flex="box:first">
<div style="margin-right: 15px;width: auto;-webkit-box-flex: 0;flex-shrink: 0;flex-grow: 0;">
<el-button @click="addGroup" style="margin-bottom: 12px;" type="primary" size="small">添加分组</el-button>
<div style="border: 1px solid rgb(227, 227, 227);width:250px">
<!-- <div style="margin:20px 0">
<el-input v-model="val" style="width:90%;margin:0 5%" placeholder="请输入分类名称搜索" size="small"></el-input>
</div> -->
<div class="el-scrollbar" style="width: 100%;height:670px">
<div class="el-scrollbar__wrap" style="margin-bottom: -8px; margin-right: -8px;">
<div class="el-scrollbar__view">
<li :class="PageMsg.GroupId==0?'selectActive' : ''" @click="SelectGroup(0)" class="el-menu-item" style="padding-left: 10px;padding-right: 10px;">
<i class="el-icon-tickets"></i>
<span>全部</span>
</li>
<li :class="PageMsg.GroupId==item.Id?'selectActive' : ''" @click="SelectGroup(item.Id)" v-for="(item,index) in groupList" :key="index" class="el-menu-item" style="padding-left: 10px;padding-right: 10px;">
<div flex="dir:left box:last">
<el-col :span="18" style="overflow: hidden; text-overflow: ellipsis;">
<i class="el-icon-tickets"></i>
<span>{{item.Name}}</span>
</el-col>
<el-col class="blue" :span="6">
<span v-if="scgroupMsg.Recycled==1" @click.prevent="EditGroup(item)">编辑 |</span>
<span v-if="scgroupMsg.Recycled==2" @click.prevent="HYGroup(item)">还原 |</span>
<!-- 回收 -->
<span v-if="scgroupMsg.Recycled==1" @click.prevent="HsGroup(item)">删除</span>
<!--回收站删除 -->
<span v-if="scgroupMsg.Recycled==2" @click.prevent="DeleteGroup(item)">删除</span>
</el-col>
</div>
</li>
</div>
</div>
</div>
</div>
<div class="el-scrollbar" style="width: 100%;height:670px">
<div class="el-scrollbar__wrap" style="margin-bottom: -8px; margin-right: -8px;">
<div class="el-scrollbar__view">
<li :class="PageMsg.GroupId==0?'selectActive' : ''" @click="SelectGroup(0)" class="el-menu-item"
style="padding-left: 10px;padding-right: 10px;">
<i class="el-icon-tickets"></i>
<span>全部</span>
</li>
<li :class="PageMsg.GroupId==item.Id?'selectActive' : ''" @click="SelectGroup(item.Id)"
v-for="(item,index) in groupList" :key="index" class="el-menu-item"
style="padding-left: 10px;padding-right: 10px;">
<div flex="dir:left box:last">
<el-col :span="18" style="overflow: hidden; text-overflow: ellipsis;">
<i class="el-icon-tickets"></i>
<span>{{item.Name}}</span>
</el-col>
<el-col class="blue" :span="6">
<span v-if="scgroupMsg.Recycled==1" @click.prevent="EditGroup(item)">编辑 |</span>
<span v-if="scgroupMsg.Recycled==2" @click.prevent="HYGroup(item)">还原 |</span>
<!-- 回收 -->
<span v-if="scgroupMsg.Recycled==1" @click.prevent="HsGroup(item)">删除</span>
<!--回收站删除 -->
<span v-if="scgroupMsg.Recycled==2" @click.prevent="DeleteGroup(item)">删除</span>
</el-col>
</div>
</li>
</div>
</div>
</div>
</div>
</div>
<div flex="dir:top" class="box">
<div>
<div class="basefix" style="margin-bottom:12px">
<span>全部</span>
<div style="display:inline-block;float:right">
<div style="margin-left: 20px;display:inline-block;" class="appendInput">
<el-input @keyup.enter.native="GetPageList()" size="small" style="width:250px" placeholder="请输入内容"
v-model="PageMsg.Name">
<el-button @click="GetPageList" slot="append" icon="el-icon-search"></el-button>
</el-input>
</div>
<el-checkbox style="margin-left:12px" :indeterminate="isIndeterminate" v-model="checkAll"
@change="CheckAllChange">全选</el-checkbox>
<el-button v-if="PageMsg.Recycled==1" @click="HsPage" style="margin:0 12px" size="small">删除
</el-button>
<el-button v-if="PageMsg.Recycled==2" @click="HYPage" style="margin-left:12px" size="small">还原
</el-button>
<el-button v-if="PageMsg.Recycled==2" @click="DeletePage" size="small">删除</el-button>
<el-dropdown v-if="scgroupMsg.Recycled==1" size="small" split-button>
移动至
<el-dropdown-menu slot="dropdown">
<el-dropdown-item v-for="(item,index) in groupList" :key="index">
<div @click="SelectPageId(item)">{{item.Name}}</div>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
<div style="border: 1px solid rgb(227, 227, 227);height:674px">
<div class="basefix app-attachment-list">
<template v-if="PageMsg.Type==1">
<div class="material-item material-upload">
<div class="app-upload" flex="main:center cross:center" style="width: 140px; height: 140px;">
<el-upload class="avatar-uploader" action="" accept="image/jpeg,image/gif,image/png,image/bmp"
:show-file-list="false" :http-request="UploadImage" multiple>
<i class="el-icon-upload"></i>
</el-upload>
</div>
</div>
<div flex="dir:top" class="box">
<div>
<div class="basefix" style="margin-bottom:12px">
<span>全部</span>
<div style="display:inline-block;float:right">
<div style="margin-left: 20px;display:inline-block;" class="appendInput">
<el-input @keyup.enter.native="GetPageList()" size="small" style="width:250px" placeholder="请输入内容" v-model="PageMsg.Name">
<el-button @click="GetPageList" slot="append" icon="el-icon-search"></el-button>
</el-input>
</div>
<el-checkbox style="margin-left:12px" :indeterminate="isIndeterminate" v-model="checkAll" @change="CheckAllChange">全选</el-checkbox>
<el-button v-if="PageMsg.Recycled==1" @click="HsPage" style="margin:0 12px" size="small">删除</el-button>
<el-button v-if="PageMsg.Recycled==2" @click="HYPage" style="margin-left:12px" size="small">还原</el-button>
<el-button v-if="PageMsg.Recycled==2" @click="DeletePage" size="small">删除</el-button>
<el-dropdown v-if="scgroupMsg.Recycled==1" size="small" split-button>
移动至
<el-dropdown-menu slot="dropdown">
<el-dropdown-item v-for="(item,index) in groupList" :key="index">
<div @click="SelectPageId(item)">{{item.Name}}</div>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
<div style="border: 1px solid rgb(227, 227, 227);height:674px">
<div class="basefix app-attachment-list">
<template v-if="PageMsg.Type==1">
<div class="material-item material-upload">
<div class="app-upload" flex="main:center cross:center" style="width: 140px; height: 140px;">
<el-upload class="avatar-uploader" action=""
accept="image/jpeg,image/gif,image/png,image/bmp"
:show-file-list="false" :http-request="UploadImage">
<i class="el-icon-upload"></i>
</el-upload>
</div>
</div>
<el-tooltip v-for="(item,index) in PageList" :key="index" class="item" effect="dark" :content="item.Name" placement="top-start">
<div @click="PageSelect(item,index)" :class="item.Selected ? 'selected' :''" class="el-tooltip item material-item ">
<img :src="getIconLink(item.Path)" class="material-img" style="width: 140px; height: 140px;">
<div flex="dir:left" style="margin-top: 5px;">
<div class="material-name">{{item.Name}}</div>
<div style="margin: 0px 5px;">|</div>
<div>
<button type="button" class="el-button el-button--text" style="padding: 0px;">
<span @click="EditPage(item)">编辑</span>
</button>
</div>
</div>
</div>
</el-tooltip>
</template>
<template v-if="PageMsg.Type==2">
<div class="material-item material-upload">
<div class="app-upload" flex="main:center cross:center" style="width: 140px; height: 140px;">
<el-upload class="avatar-uploader" action=""
:before-upload="beforeAvatarUpload"
accept="video/mp4,video/ogg,video/webm"
:show-file-list="false" :http-request="UploadImage">
<i class="el-icon-upload"></i>
</el-upload>
</div>
</div>
<el-tooltip v-for="(item,index) in PageList" :key="index" class="item" effect="dark" :content="item.Name" placement="top-start">
<div @click="PageSelect(item,index)" :class="item.Selected ? 'selected' :''" class="el-tooltip item material-item ">
<img :src="getIconLink(item.Path)+'?x-oss-process=video/snapshot,t_9,f_jpg,w_299,h_0,m_fast'" class="material-img" style="width: 140px; height: 140px;">
<div class="material-video-info"><i class="el-icon-video-play"></i> <span>{{Time(item.VideoTime)}}</span></div>
<div flex="dir:left" style="margin-top: 5px;">
<div class="material-name">{{item.Name}}</div>
<div style="margin: 0px 5px;">|</div>
<div>
<button type="button" class="el-button el-button--text" style="padding: 0px;">
<span @click="EditPage(item)">编辑</span>
</button>
</div>
</div>
</div>
</el-tooltip>
</template>
</div>
<div style="padding-right:10px">
<el-pagination style="text-align:right"
background
:current-page="currentPage4"
@current-change="handleCurrentChange"
:page-size="PageMsg.pageSize"
layout="prev, pager, next,jumper"
:total="total">
</el-pagination>
</div>
</div>
<el-tooltip v-for="(item,index) in PageList" :key="index" class="item" effect="dark"
:content="item.Name" placement="top-start">
<div @click="PageSelect(item,index)" :class="item.Selected ? 'selected' :''"
class="el-tooltip item material-item ">
<img :src="getIconLink(item.Path)" class="material-img" style="width: 140px; height: 140px;">
<div flex="dir:left" style="margin-top: 5px;">
<div class="material-name">{{item.Name}}</div>
<div style="margin: 0px 5px;">|</div>
<div>
<button type="button" class="el-button el-button--text" style="padding: 0px;">
<span @click="EditPage(item)">编辑</span>
</button>
</div>
</div>
</div>
</el-tooltip>
</template>
<template v-if="PageMsg.Type==2">
<div class="material-item material-upload">
<div class="app-upload" flex="main:center cross:center" style="width: 140px; height: 140px;">
<el-upload class="avatar-uploader" action="" :before-upload="beforeAvatarUpload"
accept="video/mp4,video/ogg,video/webm" :show-file-list="false" :http-request="UploadImage" multiple>
<i class="el-icon-upload"></i>
</el-upload>
</div>
</div>
<el-tooltip v-for="(item,index) in PageList" :key="index" class="item" effect="dark"
:content="item.Name" placement="top-start">
<div @click="PageSelect(item,index)" :class="item.Selected ? 'selected' :''"
class="el-tooltip item material-item ">
<img :src="getIconLink(item.Path)+'?x-oss-process=video/snapshot,t_9,f_jpg,w_299,h_0,m_fast'"
class="material-img" style="width: 140px; height: 140px;">
<div class="material-video-info"><i class="el-icon-video-play"></i>
<span>{{Time(item.VideoTime)}}</span></div>
<div flex="dir:left" style="margin-top: 5px;">
<div class="material-name">{{item.Name}}</div>
<div style="margin: 0px 5px;">|</div>
<div>
<button type="button" class="el-button el-button--text" style="padding: 0px;">
<span @click="EditPage(item)">编辑</span>
</button>
</div>
</div>
</div>
</el-tooltip>
</template>
</div>
<div style="padding-right:10px">
<el-pagination style="text-align:right" background :current-page="currentPage4"
@current-change="handleCurrentChange" :page-size="PageMsg.pageSize"
layout="prev, pager, next,jumper" :total="total">
</el-pagination>
</div>
</div>
</div>
<video style="display:none;" controls="controls" id="aa" oncanplaythrough="myFunction(this)">
</video>
</div>
</div>
</div>
<video style="display:none;" controls="controls" id="aa" oncanplaythrough="myFunction(this)">
</video>
</div>
<!-- 新增分组 -->
<el-dialog title="分组管理" :visible.sync="addGroupMsgDig" width="400px">
<el-form :model="addGroupMsg" :rules="addGroupMsgrules" ref="addGroupMsg" label-width="100px">
<el-form-item label="分组名称" prop="Name">
<el-input
size="small"
type="text"
placeholder="请输入内容"
v-model="addGroupMsg.Name"
maxlength="8"
show-word-limit
>
</el-input>
<el-input size="small" type="text" placeholder="请输入内容" v-model="addGroupMsg.Name" maxlength="8"
show-word-limit>
</el-input>
</el-form-item>
<el-form-item label="排序" prop="Sort">
<el-input @keyup.native="checkInteger(addGroupMsg,'Sort')" size="small" v-model="addGroupMsg.Sort"></el-input>
......@@ -177,13 +178,8 @@
<el-dialog title="图片名称修改" :visible.sync="pageMsgDig" width="400px">
<el-form :model="addpageMsg" :rules="addpageMsg" ref="addpageMsg" label-width="100px">
<el-form-item label="图片名称" prop="Name">
<el-input
size="small"
type="text"
placeholder="请输入内容"
v-model="addpageMsg.Name"
>
</el-input>
<el-input size="small" type="text" placeholder="请输入内容" v-model="addpageMsg.Name">
</el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
......@@ -191,458 +187,470 @@
<el-button size="small" type="primary" @click="pagesubmitForm('addpageMsg')">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
name: 'ChooseImg',
data(){
return{
loading:false,
commonType:1,
activeName:'first',
val:'',
Id:'',
currentPage4:1,
scgroupMsg:{
Id:0,
Name:'',
Type:1,
Recycled:1,
export default {
name: 'ChooseImg',
data() {
return {
loading: false,
commonType: 1,
activeName: 'first',
val: '',
Id: '',
currentPage4: 1,
scgroupMsg: {
Id: 0,
Name: '',
Type: 1,
Recycled: 1,
},
isIndeterminate:false,
groupList:[],
addGroupMsg:{
Id:0,
Name:'',
Type:'',
Sort:'',
isIndeterminate: false,
groupList: [],
addGroupMsg: {
Id: 0,
Name: '',
Type: '',
Sort: '',
},
addGroupMsgrules:{
Name: [{
addGroupMsgrules: {
Name: [{
required: true,
message: '请填写分组名称',
trigger: 'blur'
}],
Sort: [{
}],
Sort: [{
required: true,
message: '请填写排序',
trigger: 'blur'
}],
}],
},
addGroupMsgDig:false,
PageMsg:{
Id:0,
Name:'',
Type:1,
Recycled:1,
pageIndex:1,
pageSize:20,
GroupId:0,
addGroupMsgDig: false,
PageMsg: {
Id: 0,
Name: '',
Type: 1,
Recycled: 1,
pageIndex: 1,
pageSize: 20,
GroupId: 0,
},
PageList:[],
total:0,
addpageMsg:{
Id:0,
Name:'',
Type:1,
GroupId:0,
Path:'',
Image:'',
VideoTime:0,
WithHeight:0,
PageList: [],
total: 0,
addpageMsg: {
Id: 0,
Name: '',
Type: 1,
GroupId: 0,
Path: '',
Image: '',
VideoTime: 0,
WithHeight: 0,
},
pageMsgDig:false,
checkList:[],
checkAllList:[],
checkAll:false,
}
},
created(){
pageMsgDig: false,
checkList: [],
checkAllList: [],
checkAll: false,
}
},
created() {
this.GetMemberGradeList();
this.GetPageList();
},
mounted(){
},
methods:{
Time(value){
var theTime = parseInt(value);// 秒
    var middle= 0;// 分
    var hour= 0;// 小时
    if(theTime > 60) {
        middle= parseInt(theTime/60);
        theTime = parseInt(theTime%60);
        if(middle> 60) {
            hour= parseInt(middle/60);
            middle= parseInt(middle%60);
        }
    }
    var result = ""+parseInt(theTime);
if(theTime<10){
result="0"+parseInt(theTime);
},
mounted() {
},
methods: {
Time(value) {
var theTime = parseInt(value); // 秒
var middle = 0; // 分
var hour = 0; // 小时
if (theTime > 60) {
middle = parseInt(theTime / 60);
theTime = parseInt(theTime % 60);
if (middle > 60) {
hour = parseInt(middle / 60);
middle = parseInt(middle % 60);
}
}
    if(middle > 0) {
        result = ""+parseInt(middle)+":"+result;
    }
else{
result = "00:"+result;
var result = "" + parseInt(theTime);
if (theTime < 10) {
result = "0" + parseInt(theTime);
}
    if(hour> 0) {
        result = ""+parseInt(hour)+"小时"+result;
    }
    return result;
},
SelectPageId(item){
this.PageList.forEach(item=>{
if(item.Selected){
this.checkList.push(item.Id)
}
if (middle > 0) {
result = "" + parseInt(middle) + ":" + result;
} else {
result = "00:" + result;
}
if (hour > 0) {
result = "" + parseInt(hour) + "小时" + result;
}
return result;
},
SelectPageId(item) {
this.PageList.forEach(item => {
if (item.Selected) {
this.checkList.push(item.Id)
}
})
if(this.checkList.length==0){
this.Error("至少选择一项！");
return;
if (this.checkList.length == 0) {
this.Error("至少选择一项！");
return;
}
let MaterialIds= this.checkList.join(",");
let msg={
MaterialIds:MaterialIds,
GroupId:item.Id,
Type:this.commonType
let MaterialIds = this.checkList.join(",");
let msg = {
MaterialIds: MaterialIds,
GroupId: item.Id,
Type: this.commonType
}
this.apipost("/api/product/SetMaterialInfoTransfer",msg, res => {
this.loading=false;
if(res.data.resultCode==1){
this.GetPageList();
this.checkList=[];
}
this.apipost("/api/product/SetMaterialInfoTransfer", msg, res => {
this.loading = false;
if (res.data.resultCode == 1) {
this.GetPageList();
this.checkList = [];
}
})
},
// 全选
CheckAllChange(val){
this.PageList.forEach(item=>{
if(val){
item.Selected=true;
}else{
item.Selected=false;
},
// 全选
CheckAllChange(val) {
this.PageList.forEach(item => {
if (val) {
item.Selected = true;
} else {
item.Selected = false;
}
}
})
},
// 删除
DeletePage(){
this.checkList=[];
this.PageList.forEach(item=>{
if(item.Selected){
this.checkList.push(item.Id)
}
},
// 删除
DeletePage() {
this.checkList = [];
this.PageList.forEach(item => {
if (item.Selected) {
this.checkList.push(item.Id)
}
})
if(this.checkList.length==0){
this.Error("至少选择一项！");
return;
if (this.checkList.length == 0) {
this.Error("至少选择一项！");
return;
}
let MaterialIds= this.checkList.join(",");
this.loading=true;
this.apipost("/api/product/DelMaterialInfo",{MaterialIds:MaterialIds}, res => {
this.loading=false;
if(res.data.resultCode==1){
this.GetPageList();
this.checkList=[];
}
let MaterialIds = this.checkList.join(",");
this.loading = true;
this.apipost("/api/product/DelMaterialInfo", {
MaterialIds: MaterialIds
}, res => {
this.loading = false;
if (res.data.resultCode == 1) {
this.GetPageList();
this.checkList = [];
}
})
},
// 还原
HYPage(){
this.checkList=[];
this.PageList.forEach(item=>{
if(item.Selected){
this.checkList.push(item.Id)
}
},
// 还原
HYPage() {
this.checkList = [];
this.PageList.forEach(item => {
if (item.Selected) {
this.checkList.push(item.Id)
}
})
if(this.checkList.length==0){
this.Error("至少选择一项！");
return;
if (this.checkList.length == 0) {
this.Error("至少选择一项！");
return;
}
let MaterialIds= this.checkList.join(",");
this.loading=true;
this.apipost("/api/product/SetMaterialInfoRestore",{MaterialIds:MaterialIds}, res => {
this.loading=false;
if(res.data.resultCode==1){
this.GetPageList();
this.checkList=[];
}
let MaterialIds = this.checkList.join(",");
this.loading = true;
this.apipost("/api/product/SetMaterialInfoRestore", {
MaterialIds: MaterialIds
}, res => {
this.loading = false;
if (res.data.resultCode == 1) {
this.GetPageList();
this.checkList = [];
}
})
},
// 回收
HsPage(){
this.checkList=[];
this.PageList.forEach(item=>{
if(item.Selected){
this.checkList.push(item.Id)
}
},
// 回收
HsPage() {
this.checkList = [];
this.PageList.forEach(item => {
if (item.Selected) {
this.checkList.push(item.Id)
}
})
if(this.checkList.length==0){
this.Error("至少选择一项！");
return;
if (this.checkList.length == 0) {
this.Error("至少选择一项！");
return;
}
let MaterialIds= this.checkList.join(",");
this.loading=true;
this.apipost("/api/product/SetMaterialInfoRecycled",{MaterialIds:MaterialIds}, res => {
this.loading=false;
if(res.data.resultCode==1){
this.GetPageList();
this.checkList=[];
}
let MaterialIds = this.checkList.join(",");
this.loading = true;
this.apipost("/api/product/SetMaterialInfoRecycled", {
MaterialIds: MaterialIds
}, res => {
this.loading = false;
if (res.data.resultCode == 1) {
this.GetPageList();
this.checkList = [];
}
})
},
// 单个删除
PageSelect(item,index){
item.Selected=!item.Selected;
},
// 数组去重
unique(arr) {
return arr.filter(function(item, index, arr) {
//当前元素，在原始数组中的第一个索引==当前索引值，否则返回当前元素
return arr.indexOf(item, 0) === index;
},
// 单个删除
PageSelect(item, index) {
item.Selected = !item.Selected;
},
// 数组去重
unique(arr) {
return arr.filter(function (item, index, arr) {
//当前元素，在原始数组中的第一个索引==当前索引值，否则返回当前元素
return arr.indexOf(item, 0) === index;
});
},
SelectGroup(id){
this.PageMsg.GroupId=id;
this.addpageMsg.GroupId=id;
},
SelectGroup(id) {
this.PageMsg.GroupId = id;
this.addpageMsg.GroupId = id;
this.GetPageList();
},
EditPage(item){
this.pageMsgDig=true;
this.addpageMsg={
Id:item.Id,
Name:item.Name,
Type:item.Type,
GroupId:item.GroupId,
Path:item.Path,
Image:item.Image,
VideoTime:item.VideoTime,
WithHeight:item.WithHeight,
},
EditPage(item) {
this.pageMsgDig = true;
this.addpageMsg = {
Id: item.Id,
Name: item.Name,
Type: item.Type,
GroupId: item.GroupId,
Path: item.Path,
Image: item.Image,
VideoTime: item.VideoTime,
WithHeight: item.WithHeight,
}
},
pagesubmitForm(formName) {
},
pagesubmitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.apipost('/api/product/SetMaterialInfo',this.addpageMsg,
res => {
if (res.data.resultCode === 1) {
this.GetPageList();
this.Success(res.data.message)
this.pageMsgDig=false;
} else {
this.Error(res.data.message);
}
},
null
);
} else {
if (valid) {
this.apipost('/api/product/SetMaterialInfo', this.addpageMsg,
res => {
if (res.data.resultCode === 1) {
this.GetPageList();
this.Success(res.data.message)
this.pageMsgDig = false;
} else {
this.Error(res.data.message);
}
},
null
);
} else {
return false;
}
}
});
},
beforeAvatarUpload(file) {
this.getTimes(file); //
},
getTimes(file) { //获取时长
},
beforeAvatarUpload(file) {
this.getTimes(file); //
},
getTimes(file) { //获取时长
var content = file;
var url = URL.createObjectURL(content);
//经测试，发现audio也可获取视频的时长
var audioElement = new Audio(url);
audioElement.addEventListener("loadedmetadata", (_event) => {
this.audioDuration = parseInt(audioElement.duration);
this.addpageMsg.VideoTime=this.audioDuration;
this.audioDuration = parseInt(audioElement.duration);
this.addpageMsg.VideoTime = this.audioDuration;
});
},
UploadImage(file) {
},
UploadImage(file) {
this.UploadFileToTencent(this.FileType().GoodsImg, file.file, res => {
if (res.resultCode == 1) {
if(this.addpageMsg.Type==2){
this.addpageMsg.Image = res.FileUrl;
}
this.addpageMsg.Path = res.FileUrl;
this.addpageMsg.Name = res.FileName;
this.addPageList();
if (this.addpageMsg.Type == 2) {
this.addpageMsg.Image = res.FileUrl;
}
this.addpageMsg.Path = res.FileUrl;
this.addpageMsg.Name = res.FileName;
this.addPageList();
}
})
},
// 新增素材信息
addPageList(){
this.apipost("/api/product/SetMaterialInfo",this.addpageMsg, res => {
if(res.data.resultCode==1){
this.GetPageList();
}
},
// 新增素材信息
addPageList() {
this.apipost("/api/product/SetMaterialInfo", this.addpageMsg, res => {
if (res.data.resultCode == 1) {
this.GetPageList();
}
})
},
SelectRecycled(num){
this.scgroupMsg.Recycled=num;
this.PageMsg.Recycled=num;
this.GetMemberGradeList();
this.GetPageList();
},
EditGroup(item){
this.addGroupMsgDig=true;
this.addGroupMsg={
Id:item.Id,
Name:item.Name,
Type:item.Type,
Sort:item.Sort,
},
SelectRecycled(num) {
this.scgroupMsg.Recycled = num;
this.PageMsg.Recycled = num;
this.GetMemberGradeList();
this.GetPageList();
},
EditGroup(item) {
this.addGroupMsgDig = true;
this.addGroupMsg = {
Id: item.Id,
Name: item.Name,
Type: item.Type,
Sort: item.Sort,
}
},
HYGroup(item){
let that=this;
},
HYGroup(item) {
let that = this;
that.$confirm('是否还原?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.apipost('/api/product/SetMaterialGroupRestore',{GroupId:item.Id},
res => {
if (res.data.resultCode === 1) {
this.GetMemberGradeList();
this.Success(res.data.message)
this.apipost('/api/product/SetMaterialGroupRestore', {
GroupId: item.Id
},
res => {
if (res.data.resultCode === 1) {
this.GetMemberGradeList();
this.Success(res.data.message)
} else {
this.Error(res.data.message);
}
},
null
);
} else {
this.Error(res.data.message);
}
},
null
);
}).catch(() => {
});
},
HsGroup(item){
let that=this;
},
HsGroup(item) {
let that = this;
that.$confirm('是否删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.apipost('/api/product/SetMaterialGroupRecycled',{GroupId:item.Id},
res => {
if (res.data.resultCode === 1) {
this.GetMemberGradeList();
this.Success(res.data.message)
this.apipost('/api/product/SetMaterialGroupRecycled', {
GroupId: item.Id
},
res => {
if (res.data.resultCode === 1) {
this.GetMemberGradeList();
this.Success(res.data.message)
} else {
this.Error(res.data.message);
}
},
null
);
} else {
this.Error(res.data.message);
}
},
null
);
}).catch(() => {
});
},
DeleteGroup(item){
let that=this;
},
DeleteGroup(item) {
let that = this;
that.$confirm('是否删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.apipost('/api/product/DelMaterialGroupInfo',{GroupId:item.Id},
res => {
if (res.data.resultCode === 1) {
this.GetMemberGradeList();
this.Success(res.data.message)
this.apipost('/api/product/DelMaterialGroupInfo', {
GroupId: item.Id
},
res => {
if (res.data.resultCode === 1) {
this.GetMemberGradeList();
this.Success(res.data.message)
} else {
this.Error(res.data.message);
}
},
null
);
} else {
this.Error(res.data.message);
}
},
null
);
}).catch(() => {
});
},
addGroup(){
this.addGroupMsgDig=true;
this.addGroupMsg={
Id:0,
Name:'',
Type:this.commonType,
Sort:'',
},
addGroup() {
this.addGroupMsgDig = true;
this.addGroupMsg = {
Id: 0,
Name: '',
Type: this.commonType,
Sort: '',
}
},
GroupsubmitForm (formName) {
},
GroupsubmitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.apipost('/api/product/SetMaterialGroupInfo',this.addGroupMsg,
res => {
if (res.data.resultCode === 1) {
this.GetMemberGradeList();
this.Success(res.data.message)
this.addGroupMsgDig=false;
} else {
this.Error(res.data.message);
}
},
null
);
} else {
if (valid) {
this.apipost('/api/product/SetMaterialGroupInfo', this.addGroupMsg,
res => {
if (res.data.resultCode === 1) {
this.GetMemberGradeList();
this.Success(res.data.message)
this.addGroupMsgDig = false;
} else {
this.Error(res.data.message);
}
},
null
);
} else {
return false;
}
}
});
},
GetMemberGradeList(){
this.loading=true;
this.apipost("/api/product/GetMaterialGroupList",this.scgroupMsg, res => {
this.loading=false;
this.groupList=res.data.data;
},
GetMemberGradeList() {
this.loading = true;
this.apipost("/api/product/GetMaterialGroupList", this.scgroupMsg, res => {
this.loading = false;
this.groupList = res.data.data;
})
},
GetPageList(){
this.loading=true;
this.apipost("/api/product/GetMaterialInfoPageList",this.PageMsg, res => {
this.loading=false;
this.total=res.data.data.count;
let data=res.data.data.pageData;
this.checkAllList=[];
data.forEach(item=>{
this.checkAllList.push(item.Id)
item.Selected=false;
})
this.PageList=data;
},
GetPageList() {
this.loading = true;
this.apipost("/api/product/GetMaterialInfoPageList", this.PageMsg, res => {
this.loading = false;
this.total = res.data.data.count;
let data = res.data.data.pageData;
this.checkAllList = [];
data.forEach(item => {
this.checkAllList.push(item.Id)
item.Selected = false;
})
this.PageList = data;
})
},
handleClick(val){
this.commonType=val;
this.scgroupMsg.Type=val;
this.PageMsg.Type=val;
this.addpageMsg.Type=val;
this.GetMemberGradeList();
this.GetPageList();
},
handleClick(val) {
this.commonType = val;
this.scgroupMsg.Type = val;
this.PageMsg.Type = val;
this.addpageMsg.Type = val;
this.GetMemberGradeList();
this.GetPageList();
},
handleCurrentChange(val) {
},
handleCurrentChange(val) {
this.PageMsg.pageIndex = val;
this.GetPageList();
},
},
},
}
}
</script>
<style>
.materialMan .material-video-info {
.materialMan .material-video-info {
background: rgba(0, 0, 0, .35);
color: #fff;
position: absolute;
......@@ -650,31 +658,37 @@ export default {
bottom: 31px;
padding: 1px 3px;
font-size: 14px;
}
.materialMan .TabDiv .spanActive{
}
.materialMan .TabDiv .spanActive {
border-bottom: 2px solid #409EFF;
color:#409EFF;
}
.materialMan .TabDiv span{
color: #409EFF;
}
.materialMan .TabDiv span {
font-size: 14px;
margin-right: 20px;
display: inline-block;
height: 100%;
cursor: pointer;
}
.materialMan .TabDiv{
}
.materialMan .TabDiv {
height: 40px;
line-height: 40px;
border-bottom: 2px solid #f3f3f3;
margin-bottom: 20px;
}
.materialMan .selectActive .el-icon-tickets{
}
.materialMan .selectActive .el-icon-tickets {
color: #409EFF;
}
.materialMan .selectActive{
}
.materialMan .selectActive {
color: #409EFF;
}
.materialMan .material-name {
}
.materialMan .material-name {
color: #666666;
font-size: 13px;
margin-top: 0px;
......@@ -685,17 +699,21 @@ export default {
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
}
.materialMan .material-item.checked, .material-item.selected {
}
.materialMan .material-item.checked,
.material-item.selected {
box-shadow: 0 0 0 1px #1ed0ff;
background: #daf5ff;
border-radius: 5px;
}
.materialMan .material-upload i {
}
.materialMan .material-upload i {
font-size: 30px;
color: #909399;
}
.materialMan .material-item {
}
.materialMan .material-item {
display: inline-block;
cursor: pointer;
position: relative;
......@@ -705,29 +723,35 @@ export default {
margin: 7.5px;
text-align: center;
padding: 10px 10px 0;
}
.materialMan .material-upload {
}
.materialMan .material-upload {
box-shadow: none;
border: 1px dashed #b2b6bd;
height: 140px;
width: 140px;
margin: 17.5px;
padding: 0;
}
}
.ChooseImg .app-attachment-list{
.ChooseImg .app-attachment-list {
padding: 5px;
}
.materialMan .appendInput .el-input.is-active .el-input__inner,.materialMan .appendInput .el-input__inner:focus{
}
.materialMan .appendInput .el-input.is-active .el-input__inner,
.materialMan .appendInput .el-input__inner:focus {
border-color: #DCDFE6;
}
.ChooseImg .appendInput .el-input__inner{
}
.ChooseImg .appendInput .el-input__inner {
border-right: none;
outline: none;
}
.ChooseImg .appendInput .el-input-group__append{
background-color: #fff!important;
}
.ChooseImg .appendInput .el-input-group__append {
background-color: #fff !important;
border-left: none;
padding: 0 15px;
}
}
</style>
src/components/global/ChooseImg.vue
View file @ 4fe69012
......@@ -42,14 +42,14 @@
<div class="basefix app-attachment-list">
<div class="app-attachment-item app-attachment-upload">
<el-upload class="avatar-uploader" action="" accept="image/jpeg,image/gif,image/png,image/bmp"
:show-file-list="false" :http-request="UploadImage">
:show-file-list="false" :http-request="UploadImage">
<div class="app-upload" flex="main:center cross:center" style="width: 100px; height: 100px;">
<i class="el-icon-upload"></i>
<i class="el-icon-upload"></i>
</div>
</el-upload>
</div>
<el-tooltip v-for="(item,index) in PageList" :key="index" class="item" effect="dark" :content="'双击选中【'+item.Name+'】'"
placement="top-start">
<el-tooltip v-for="(item,index) in PageList" :key="index" class="item" effect="dark"
:content="'双击选中【'+item.Name+'】'" placement="top-start">
<div @click="PageSelect(item,1)" @dblclick="PageSelect(item,2)" :class="selectId==item.Id ? 'selected' :''"
class="el-tooltip item app-attachment-item">
<img :src="getIconLink(item.Path)" class="app-attachment-img" style="width: 100px; height: 100px;">
......@@ -91,6 +91,8 @@
<script>
export default {
//是否多选
props: ["IsMultiple"],
name: 'ChooseImg',
data() {
return {
......@@ -199,19 +201,18 @@
this.apipost("/api/product/SetMaterialInfo", this.addpageMsg, res => {
if (res.data.resultCode == 1) {
this.GetPageList();
}
})
},
// clickType 1单击 2双击
PageSelect(item,clickType) {
PageSelect(item, clickType) {
this.emitmsg = {
selectId: item.Id,
url: item.Path
}
this.selectId = item.Id;
if(clickType==2){
this.SelectImgId();
if (clickType == 2) {
this.SelectImgId();
}
},
......@@ -282,7 +283,7 @@
},
SelectGroup(id) {
this.PageMsg.GroupId = id;
this.addpageMsg.GroupId=id;
this.addpageMsg.GroupId = id;
this.GetPageList();
},
handleCurrentChange(val) {
......
src/plug/index.js
View file @ 4fe69012
......@@ -132,7 +132,7 @@ export default {
var filename = fileObj.name;
var index = filename.lastIndexOf(".");
var suffix = filename.substr(index);
var timestamp1 = Date.parse(new Date());
var timestamp1 = Date.parse(new Date())+"_"+(Math.ceil(Math.random()*1000));
let str = '';
if (this.isOnline()) {
str = "/Test"
......
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