|
@@ -2,11 +2,12 @@
|
|
|
<div class="smart-report-img-set-page">
|
|
|
<div class="top-wrap">
|
|
|
<el-input v-model="keyword" :placeholder="$t('SystemManage.BaseConfig.resource_placeholder01')" clearable style="width:200px;margin-right:20px" @input="handleSearch"></el-input>
|
|
|
- <el-select :placeholder="$t('SystemManage.BaseConfig.resource_placeholder02')" v-model="type" clearable style="width:200px" @change="handleSearch">
|
|
|
- <el-option :label="$t('SystemManage.BaseConfig.resource_type01')" :value="1"></el-option>
|
|
|
- <el-option :label="$t('SystemManage.BaseConfig.resource_type02')" :value="2"></el-option>
|
|
|
+ <el-select :placeholder="$t('SystemManage.BaseConfig.resource_placeholder02')" v-model="type" clearable style="width:200px" @change="handleSearch">
|
|
|
+ <el-option :label="libraryType==2?$t('SystemManage.BaseConfig.ppt_type01'):$t('SystemManage.BaseConfig.resource_type01')" :value="1"></el-option>
|
|
|
+ <el-option :label="libraryType==2?$t('SystemManage.BaseConfig.ppt_type02'):$t('SystemManage.BaseConfig.resource_type02')" :value="2"></el-option>
|
|
|
+ <el-option v-if="libraryType==2" :label="$t('SystemManage.BaseConfig.ppt_type03')" :value="3"></el-option>
|
|
|
</el-select>
|
|
|
- <el-button type="primary" style="float:right" @click="handleShowUploadPop" v-permission="permissionBtn.baseConfigPermission.etaBaseConfig_source_upload">{{$t('SystemManage.BaseConfig.resource_btn04')}}</el-button>
|
|
|
+ <el-button type="primary" style="float:right" @click="handleShowUploadPop" v-if="(libraryType==1&&permissionBtn.checkPermissionBtn(permissionBtn.baseConfigPermission.etaBaseConfig_source_upload)) || (libraryType==2&&permissionBtn.checkPermissionBtn(permissionBtn.baseConfigPermission.etaBaseConfig_source_ppt_upload))">{{libraryType==1?$t('SystemManage.BaseConfig.resource_btn04'):$t('SystemManage.BaseConfig.resource_btn01')}}</el-button>
|
|
|
</div>
|
|
|
|
|
|
<div class="select-status-box" v-if="selectIds.length>0">
|
|
@@ -22,24 +23,24 @@
|
|
|
|
|
|
|
|
|
<ul class="img-list-wrap">
|
|
|
- <li class="img-item" v-for="item in list" :key="item.ResourceId">
|
|
|
- <div :class="['select-box',selectIds.includes(item.ResourceId)?'select-box-active':'']" @click="handleSelectItem(item)"></div>
|
|
|
+ <li class="img-item" v-for="item in list" :key="item.ResourceId || item.ImageConfId">
|
|
|
+ <div :class="['select-box',selectIds.includes(item.ResourceId || item.ImageConfId)?'select-box-active':'']" @click="handleSelectItem(item)"></div>
|
|
|
<div class="opt-box">
|
|
|
<div class="item" @click="handleShowImgFull(item)">
|
|
|
<img src="~@/assets/img/icons/fullsreen.png" alt="">
|
|
|
</div>
|
|
|
- <el-dropdown @command="handleClickOpt">
|
|
|
+ <el-dropdown @command="handleClickOpt" v-if="(libraryType==1&&(permissionBtn.checkPermissionBtn(permissionBtn.baseConfigPermission.etaBaseConfig_source_edit)|| permissionBtn.checkPermissionBtn(permissionBtn.baseConfigPermission.etaBaseConfig_source_del))) || (libraryType==2&&(permissionBtn.checkPermissionBtn(permissionBtn.baseConfigPermission.etaBaseConfig_source_ppt_edit) || permissionBtn.checkPermissionBtn(permissionBtn.baseConfigPermission.etaBaseConfig_source_ppt_del)))">
|
|
|
<div class="item">
|
|
|
<img src="~@/assets/img/icons/more.png" alt="">
|
|
|
</div>
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
- <el-dropdown-item :command="{type:'edit',data:item}">{{$t('Dialog.title_prefix_edit')}}</el-dropdown-item>
|
|
|
- <el-dropdown-item :command="{type:'del',data:item}" style="color: #AD352F;">{{$t('Table.delete_btn')}}</el-dropdown-item>
|
|
|
+ <el-dropdown-item v-if="(libraryType==1&&permissionBtn.checkPermissionBtn(permissionBtn.baseConfigPermission.etaBaseConfig_source_edit)) || (libraryType==2&&permissionBtn.checkPermissionBtn(permissionBtn.baseConfigPermission.etaBaseConfig_source_ppt_edit))" :command="{type:'edit',data:item}">{{$t('Dialog.title_prefix_edit')}}</el-dropdown-item>
|
|
|
+ <el-dropdown-item v-if="(libraryType==1&&permissionBtn.checkPermissionBtn(permissionBtn.baseConfigPermission.etaBaseConfig_source_del)) || (libraryType==2&&permissionBtn.checkPermissionBtn(permissionBtn.baseConfigPermission.etaBaseConfig_source_ppt_del))" :command="{type:'del',data:item}" style="color: #AD352F;">{{$t('Table.delete_btn')}}</el-dropdown-item>
|
|
|
</el-dropdown-menu>
|
|
|
</el-dropdown>
|
|
|
</div>
|
|
|
- <img class="img" :src="item.ImgUrl" alt="">
|
|
|
- <p class="name">{{item.ImgName}}</p>
|
|
|
+ <img class="img" :src="item.ImgUrl || item.Url" alt="">
|
|
|
+ <p class="name">{{item.ImgName || item.ImageName}}</p>
|
|
|
</li>
|
|
|
</ul>
|
|
|
<tableNoData :text="$t('Table.prompt_slogan')" v-if="list.length===0"/>
|
|
@@ -165,7 +166,75 @@
|
|
|
</el-form>
|
|
|
|
|
|
</el-dialog>
|
|
|
- <el-image-viewer
|
|
|
+
|
|
|
+ <!-- ppt上传图片弹窗 -->
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="uploadImgPpt"
|
|
|
+ :title="ruleForm.ImageConfId?$t('SystemManage.BaseConfig.ppt_btn02'):$t('SystemManage.BaseConfig.resource_btn01')"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :append-to-body="true"
|
|
|
+ @close="cancelPpt"
|
|
|
+ custom-class="classify-dialog"
|
|
|
+ center
|
|
|
+ width="550px"
|
|
|
+ v-dialogDrag
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ :model="ruleForm"
|
|
|
+ :rules="formRules"
|
|
|
+ ref="ruleForms"
|
|
|
+ label-width="120px"
|
|
|
+ class="upload-img-form"
|
|
|
+ >
|
|
|
+ <el-form-item :label="$t('SystemManage.BaseConfig.resource_label01')" prop="ImageName">
|
|
|
+ <el-input v-model="ruleForm.ImageName" :placeholder="$t('SystemManage.BaseConfig.resource_placeholder01')"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('SystemManage.BaseConfig.resource_label02')" prop="ImageType">
|
|
|
+ <el-radio-group :disabled="ruleForm.ImageConfId" v-model="ruleForm.ImageType">
|
|
|
+ <el-radio :label="1">{{$t('SystemManage.BaseConfig.ppt_type01')}}</el-radio>
|
|
|
+ <el-radio :label="2">{{$t('SystemManage.BaseConfig.ppt_type02')}}</el-radio>
|
|
|
+ <el-radio :label="3">{{$t('SystemManage.BaseConfig.ppt_type03')}}</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('SystemManage.BaseConfig.resource_btn01')"
|
|
|
+ prop="Url"
|
|
|
+ >
|
|
|
+ <el-upload
|
|
|
+ :disabled="ruleForm.ImageConfId"
|
|
|
+ action=""
|
|
|
+ accept="image/*"
|
|
|
+ :http-request="handleUploadImg"
|
|
|
+ :show-file-list="false"
|
|
|
+ >
|
|
|
+ <div class="upload-box">
|
|
|
+ <template v-if="!ruleForm.Url">
|
|
|
+ <i class="el-icon-plus" style="font-size: 24px;"></i>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <img class="upload-img" :src="ruleForm.Url" alt="">
|
|
|
+ <div class="upload-mask">
|
|
|
+ <i class="el-icon-zoom-in" @click.stop="handleShowImgPpt()"></i>
|
|
|
+ <i class="el-icon-delete" v-if="!ruleForm.ImageConfId" @click.stop="ruleForm.Url=''"></i>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ <p>{{$t('SystemManage.BaseConfig.upload_ppt_suggest')}}</p>
|
|
|
+ </el-form-item>
|
|
|
+ <div style="text-align: center;padding: 30px 0;margin-top: 60px;">
|
|
|
+ <el-button style="width:120px;" @click="cancelPpt()" >{{$t('Dialog.cancel_btn')}}</el-button>
|
|
|
+ <el-button type="primary" style="margin-left:20px;width:120px;" @click="handlePptSave">{{$t('Dialog.confirm_save_btn')}}</el-button>
|
|
|
+ </div>
|
|
|
+ </el-form>
|
|
|
+ <el-image-viewer
|
|
|
+ :zIndex="9999"
|
|
|
+ v-if="showPptViewer"
|
|
|
+ :on-close="()=>{this.picShowList=[];this.showPptViewer = false}"
|
|
|
+ :url-list="picShowList"
|
|
|
+ />
|
|
|
+ </el-dialog>
|
|
|
+ <el-image-viewer
|
|
|
v-if="showViewer"
|
|
|
:on-close="()=>{this.picShowList=[];this.showViewer = false}"
|
|
|
:url-list="picShowList"
|
|
@@ -181,6 +250,24 @@ import draggable from 'vuedraggable'
|
|
|
import VueDragResize from 'vue-drag-resize'
|
|
|
export default {
|
|
|
components:{ElImageViewer,draggable,VueDragResize},
|
|
|
+ props:{
|
|
|
+ libraryType:{
|
|
|
+ type:Number,
|
|
|
+ default:1
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch:{
|
|
|
+ libraryType:{
|
|
|
+ handler(newval){
|
|
|
+ this.page = 1;
|
|
|
+ this.keyword=''
|
|
|
+ this.type=''
|
|
|
+ this.list=[]
|
|
|
+ this.getImgList()
|
|
|
+ },
|
|
|
+ deep:true
|
|
|
+ }
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
keyword:'',
|
|
@@ -191,6 +278,7 @@ export default {
|
|
|
total:0,
|
|
|
|
|
|
uploadImgPop:false,
|
|
|
+ uploadImgPpt:false,
|
|
|
formData:{
|
|
|
id:0,
|
|
|
name:'',
|
|
@@ -198,10 +286,19 @@ export default {
|
|
|
imgUrl:'',
|
|
|
layout:''
|
|
|
},
|
|
|
+ ruleForm:{
|
|
|
+ ImageName:'',
|
|
|
+ Url:"",
|
|
|
+ ConfType:1,
|
|
|
+ ImageType:''
|
|
|
+ },
|
|
|
formRules:{
|
|
|
name:[{ required: true, message: this.$t('SystemManage.BaseConfig.resource_placeholder01')||'请输入图片名称', trigger: 'blur' }],
|
|
|
type:[{ required: true, message: this.$t('SystemManage.BaseConfig.resource_placeholder02')||'请选择图片类型', trigger: 'change' }],
|
|
|
- imgUrl:[{ required: true, message: this.$t('SystemManage.BaseConfig.resource_placeholder03')||'请上传图片', trigger: 'change' }]
|
|
|
+ imgUrl:[{ required: true, message: this.$t('SystemManage.BaseConfig.resource_placeholder03')||'请上传图片', trigger: 'change' }],
|
|
|
+ ImageName:[{ required: true, message: this.$t('SystemManage.BaseConfig.resource_placeholder01')||'请输入图片名称', trigger: 'blur' }],
|
|
|
+ ImageType:[{ required: true, message: this.$t('SystemManage.BaseConfig.resource_placeholder02')||'请选择图片类型', trigger: 'change' }],
|
|
|
+ Url:[{ required: true, message: this.$t('SystemManage.BaseConfig.resource_placeholder03')||'请上传图片', trigger: 'change' }]
|
|
|
},
|
|
|
step:1,
|
|
|
steps:[this.$t('SystemManage.BaseConfig.select_layout'),this.$t('SystemManage.BaseConfig.edit_layout')],
|
|
@@ -236,6 +333,7 @@ export default {
|
|
|
{value:'center',label:this.$t('SystemManage.BaseConfig.style_text_align_center')},
|
|
|
{value:'right',label:this.$t('SystemManage.BaseConfig.style_text_align_right')}],
|
|
|
showViewer:false,
|
|
|
+ showPptViewer:false,
|
|
|
picShowList:[],
|
|
|
rigtMenuHideTimer:null,
|
|
|
delIds:[],//要删除的id集合
|
|
@@ -253,19 +351,22 @@ export default {
|
|
|
},
|
|
|
methods: {
|
|
|
handleSelectItem(e){
|
|
|
- const index=this.selectIds.indexOf(e.ResourceId)
|
|
|
+ const key=this.libraryType==1?'ResourceId':'ImageConfId'
|
|
|
+ console.log(e[key])
|
|
|
+ const index=this.selectIds.indexOf(e[key])
|
|
|
if(index>-1){
|
|
|
this.selectIds.splice(index,1)
|
|
|
}else{
|
|
|
- this.selectIds.push(e.ResourceId)
|
|
|
+ this.selectIds.push(e[key])
|
|
|
}
|
|
|
|
|
|
this.checkAll=this.selectIds.length===this.list.length?true:false
|
|
|
this.isIndeterminate=this.selectIds.length>0&&this.selectIds.length<this.list.length
|
|
|
},
|
|
|
handleCheckAllChange(val){
|
|
|
+ const key=this.libraryType==1?'ResourceId':'ImageConfId'
|
|
|
if(val){
|
|
|
- this.selectIds=this.list.map(item=>item.ResourceId)
|
|
|
+ this.selectIds=this.list.map(item=>item[key])
|
|
|
}else{
|
|
|
this.selectIds=[]
|
|
|
}
|
|
@@ -285,16 +386,26 @@ export default {
|
|
|
this.isIndeterminate=false
|
|
|
this.checkAll=false
|
|
|
this.delIds=[]
|
|
|
-
|
|
|
- const res=await apiSmartReport.imgReourceList({
|
|
|
- CurrentIndex:this.page,
|
|
|
- PageSize:this.pageSize,
|
|
|
- Type:this.type,
|
|
|
- Keyword:this.keyword
|
|
|
- })
|
|
|
- if(res.Ret===200){
|
|
|
- this.list=res.Data.List||[]
|
|
|
- this.total=res.Data.Paging.Totals
|
|
|
+ let res=''
|
|
|
+ if(this.libraryType==1){
|
|
|
+ res=await apiSmartReport.imgReourceList({
|
|
|
+ CurrentIndex:this.page,
|
|
|
+ PageSize:this.pageSize,
|
|
|
+ Type:this.type,
|
|
|
+ Keyword:this.keyword
|
|
|
+ })
|
|
|
+ }else{
|
|
|
+ res=await apiSmartReport.pptMaterialList({
|
|
|
+ CurrentIndex:this.page,
|
|
|
+ PageSize:this.pageSize,
|
|
|
+ ImageType:this.type?this.type:null,
|
|
|
+ ImageName:this.keyword,
|
|
|
+ ConfType:1
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if(res&&res.Ret===200){
|
|
|
+ this.list=res.Data?res.Data.List:[]
|
|
|
+ this.total=res.Data?res.Data.Paging.Totals:0
|
|
|
}
|
|
|
},
|
|
|
|
|
@@ -310,8 +421,13 @@ export default {
|
|
|
form.append('file',file.file);
|
|
|
bannerupload(form).then(res=>{
|
|
|
// console.log(res);
|
|
|
- if(res.Ret!==200) return
|
|
|
- this.formData.imgUrl=res.Data.ResourceUrl
|
|
|
+ if(res.Ret!==200) return
|
|
|
+ if(this.libraryType==1){
|
|
|
+ this.formData.imgUrl=res.Data.ResourceUrl
|
|
|
+ }else{
|
|
|
+ this.ruleForm.Url=res.Data.ResourceUrl
|
|
|
+ this.$refs.ruleForms.clearValidate('Url');
|
|
|
+ }
|
|
|
})
|
|
|
|
|
|
},
|
|
@@ -375,6 +491,33 @@ export default {
|
|
|
handleCloseImgUpload(){
|
|
|
this.uploadImgPop=false
|
|
|
},
|
|
|
+ handlePptSave(){
|
|
|
+ this.$refs.ruleForms.validate(async (valid)=>{
|
|
|
+ if(valid){
|
|
|
+ const params={
|
|
|
+ ...this.ruleForm
|
|
|
+ }
|
|
|
+ let res=''
|
|
|
+ if(this.ruleForm.ImageConfId){
|
|
|
+ res=await apiSmartReport.pptEditMaterial(params)
|
|
|
+ }else{
|
|
|
+ res=await apiSmartReport.pptAddMaterial([params])
|
|
|
+ }
|
|
|
+ if(res&&res.Ret===200){
|
|
|
+ this.$message.success(this.ruleForm.ImageConfId?this.$t('MsgPrompt.edit_msg'):this.$t('MsgPrompt.add_msg'))
|
|
|
+ this.cancelPpt()
|
|
|
+ this.page=1
|
|
|
+ this.getImgList()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ cancelPpt(){
|
|
|
+ this.uploadImgPpt=false
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ this.$refs.ruleForms.clearValidate()
|
|
|
+ })
|
|
|
+ },
|
|
|
cancelHandle(){
|
|
|
this.step=1
|
|
|
this.formData.id=0
|
|
@@ -400,34 +543,57 @@ export default {
|
|
|
this.$refs.ruleForm.clearValidate()
|
|
|
})
|
|
|
},
|
|
|
+ handleShowImgPpt(){
|
|
|
+ this.showPptViewer=true
|
|
|
+ this.picShowList=[this.ruleForm.Url]
|
|
|
+ },
|
|
|
handleShowImgFull(e){
|
|
|
console.log(e);
|
|
|
- this.picShowList=[e.ImgUrl]
|
|
|
+ this.picShowList=[this.libraryType==1?e.ImgUrl:e.Url]
|
|
|
this.showViewer=true
|
|
|
},
|
|
|
|
|
|
handleClickOpt(e){
|
|
|
if(e.type==='del'){
|
|
|
- this.delIds=[e.data.ResourceId]
|
|
|
+ this.delIds=[this.libraryType==1?e.data.ResourceId:e.data.ImageConfId]
|
|
|
this.handleImgDel()
|
|
|
}
|
|
|
if(e.type==='edit'){
|
|
|
- this.formData.id=e.data.ResourceId
|
|
|
- this.formData.name=e.data.ImgName
|
|
|
- this.formData.type=e.data.Type
|
|
|
- this.formData.imgUrl=e.data.ImgUrl
|
|
|
- this.formData.layout=e.data.Style
|
|
|
+ if(this.libraryType==1){
|
|
|
+ this.formData.id=e.data.ResourceId
|
|
|
+ this.formData.name=e.data.ImgName
|
|
|
+ this.formData.type=e.data.Type
|
|
|
+ this.formData.imgUrl=e.data.ImgUrl
|
|
|
+ this.formData.layout=e.data.Style
|
|
|
|
|
|
- this.uploadImgPop=true
|
|
|
+ this.uploadImgPop=true
|
|
|
+ }else{
|
|
|
+ this.ruleForm=JSON.parse(JSON.stringify(e.data))
|
|
|
+
|
|
|
+ this.uploadImgPpt=true
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
handleShowUploadPop(){
|
|
|
- this.formData.id=0
|
|
|
- this.formData.name=''
|
|
|
- this.formData.type=''
|
|
|
- this.formData.imgUrl=''
|
|
|
- this.formData.layout=''
|
|
|
- this.uploadImgPop=true
|
|
|
+ if(this.libraryType==1){
|
|
|
+ this.formData.id=0
|
|
|
+ this.formData.name=''
|
|
|
+ this.formData.type=''
|
|
|
+ this.formData.imgUrl=''
|
|
|
+ this.formData.layout=''
|
|
|
+ this.uploadImgPop=true
|
|
|
+ }else{
|
|
|
+ this.ruleForm={
|
|
|
+ ImageName:'',
|
|
|
+ Url:"",
|
|
|
+ ConfType:1,
|
|
|
+ ImageType:''
|
|
|
+ }
|
|
|
+ this.uploadImgPpt=true
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ this.$refs.ruleForms.clearValidate()
|
|
|
+ })
|
|
|
+ }
|
|
|
},
|
|
|
|
|
|
handleBatchDel(){
|
|
@@ -438,14 +604,18 @@ export default {
|
|
|
handleImgDel(){
|
|
|
this.$confirm(this.$t('SystemManage.BaseConfig.resource_del_msg'),this.$t('Confirm.prompt'),{
|
|
|
type: 'warning'
|
|
|
- }).then(()=>{
|
|
|
- apiSmartReport.imgReourceDel({ResourceIds:this.delIds.join(',')}).then(res=>{
|
|
|
- if(res.Ret===200){
|
|
|
- this.$message.success(this.$t('MsgPrompt.delete_msg'))
|
|
|
- this.page=1
|
|
|
- this.getImgList()
|
|
|
- }
|
|
|
- })
|
|
|
+ }).then(async ()=>{
|
|
|
+ let res=''
|
|
|
+ if(this.libraryType==1){
|
|
|
+ res=await apiSmartReport.imgReourceDel({ResourceIds:this.delIds.join(',')})
|
|
|
+ }else{
|
|
|
+ res=await apiSmartReport.pptDeleteMaterial(this.delIds.map(el=>{return {ImageConfId:el}}))
|
|
|
+ }
|
|
|
+ if(res&&res.Ret===200){
|
|
|
+ this.$message.success(this.$t('MsgPrompt.delete_msg'))
|
|
|
+ this.page=1
|
|
|
+ this.getImgList()
|
|
|
+ }
|
|
|
})
|
|
|
},
|
|
|
// 切换步骤
|
|
@@ -563,7 +733,7 @@ export default {
|
|
|
display: none;
|
|
|
}
|
|
|
.smart-report-img-set-page{
|
|
|
- padding: 30px;
|
|
|
+ padding:11px 30px 30px;
|
|
|
padding-bottom: 100px;
|
|
|
.select-status-box{
|
|
|
background-color: #F8F8F8;
|