sasp-admin 0.2.63 → 0.2.64

package/src/components/ifmLink.vue

@@ -1,6 +1,11 @@
 <!--外部超链接-->
 <template>
-    <div id="ifmLinkContrainer">
+    <div  v-if="davpUrl" ref="wujiedavpRef" style="width: 100%;height: 100%">
+        <wujie-davp-view :url="davpUrl" degrade>
+
+        </wujie-davp-view>
+    </div>
+    <div id="ifmLinkContrainer"　v-else>
         <div style="position: absolute;top:0;bottom:0;left:0;right:0;box-sizing: border-box;"
              v-loading="loading"
              element-loading-text="正在加载，请稍后..."
@@ -25,16 +30,28 @@
                 url : this.linkUrl ? this.linkUrl : '',
                 loading: true,
                 showIframe: false,
+                davpUrl:""
             }
         },
         watch: {
             linkUrl() {
                 this.url = this.linkUrl ? this.linkUrl : '';
+                this.loadWujieDavpUrl();
             },
-
-
+        },
+        created() {
+            this.loadWujieDavpUrl();
         },
         methods: {
+            loadWujieDavpUrl(){
+                if(this.url && (this.url.indexOf('/dashbarodPreview') > -1 ||　this.url.indexOf('/reportPreview') > -1)){
+                  if (this.url.indexOf('/dashbarodPreview') > -1) {
+                    this.davpUrl = this.url.substring(this.url.indexOf('dashbarodPreview'));
+                  } else {
+                    this.davpUrl = this.url.substring(this.url.indexOf('reportPreview'));
+                  }
+                }
+            },
             onLoad() {
                 this.loading = false;
                 this.showIframe = true;

package/src/components/public/data/plDataSelect.vue

@@ -832,14 +832,16 @@
              */
             changeData(label,val){
                 this.dataValue = val;
-                if(this.saveType == "text"){
-                    this.changeField(this.field,label);
-                    this.$set(this.formData, this.backfillField, label);
-                }else{
-                    this.changeField(this.field,val);
+                const value = this.saveType == "text" ? label : val;
+                this.$emit('input', value);
+                this.$emit('change', value);
+                this.change && this.change(value, label);
+                if(this.changeField){
+                    this.changeField(this.field, value);
+                }
+                if(this.formData && this.backfillField){
                     this.$set(this.formData, this.backfillField, label);
                 }
-
             },
             /**
              * 远程连接树数据回调

package/src/components/public/org/sysOrgPosUserSelect.vue

@@ -48,6 +48,13 @@
                                 <el-form-item label="用户名称">
                                     <el-input v-model="crud.searchForm.userNamePinYin" placeholder="中文、拼音全拼、简拼"></el-input>
                                 </el-form-item>
+                                <el-form-item label="查看已选择用户">
+                                  <el-radio-group v-model="crud.searchForm.showCheckedUser" :disabled="checkedUser.length === 0"
+                                                  style="margin-right: 10px">
+                                    <el-radio label="1">是</el-radio>
+                                    <el-radio label="0">否</el-radio>
+                                  </el-radio-group>
+                                </el-form-item>
                                 <el-form-item>
                                     <el-button type="primary" icon="el-icon-search" @click="doSearch()">查询</el-button>
                                     <el-button icon="el-icon-close" @click="resetSearch()">清空</el-button>
@@ -61,9 +68,10 @@
                                   @selection-change="selectChange" style="width: 100%;height: 100%" @row-click="rowClick">
                             <el-table-column type="selection" width="40" align="center"></el-table-column>
                             <el-table-column type="index" label="序号" align="center" width="60"></el-table-column>
-                            <el-table-column prop="userName" label="用户名称" align="center"></el-table-column>
-                            <el-table-column prop="orgName" label="所属组织" align="center"></el-table-column>
-                            <el-table-column prop="posName" label="所属岗位" align="center"></el-table-column>
+                            <el-table-column prop="userName" label="用户名称" align="center" min-width="60"></el-table-column>
+                            <el-table-column prop="userAccount" label="用户账号" align="center" min-width="60"></el-table-column>
+                            <el-table-column prop="orgName" label="所属组织" :formatter="formatterOrgName" align="center" min-width="200"></el-table-column>
+                            <el-table-column prop="posName" label="所属岗位" align="center" min-width="100"></el-table-column>
                         </el-table>
                     </el-main>
                     <el-footer style="height: 40px">
@@ -145,6 +153,7 @@
             orgDims:{type:String,default:""}, // 逗号分隔的维度字符串，也就是roleType
             orgTreeIds:{type:String,default:""}, // 过滤组织的条件
             defaultChooseIds:{type:String,default:""}, // 已选择的人员信息
+            parentChooseDataIds:{type:String,default:""}, // 已选择的父级级联ID
             defaultOrgIds:{type:String,default:""},
             defaultPosIds:{type:String,default:""},
             defaultUserIds:{type:String,default:""},
@@ -170,9 +179,9 @@
                     vue: this,
                     entityName: "sysOrgPosUser",
                     searchUrl: this.api.sysOrgPosUser.findPageParam,
-                    noClearSearchColumns:["orgTreeId","posTreeId","noneUserId","authUserType",
+                    noClearSearchColumns:["orgTreeId","posTreeId","noneUserId","authUserType","showCheckedUser",
                         "created","empowerId","commonUserType","filterUserSource","userLinkIdPam",'filterLoginUser','tenantId'],
-                    searchForm:{"orgTreeId":"$$$$$","tenantId":this.tenantId}, // 初始化时虽然不会产生数据因为nosearch，但是输入跳转会触发搜索，当前没条件就会生成所有数据，加上这个不查数据，树节点点击时清空它了
+                    searchForm:{"orgTreeId":"$$$$$","tenantId":this.tenantId,showCheckedUser:"0"}, // 初始化时虽然不会产生数据因为nosearch，但是输入跳转会触发搜索，当前没条件就会生成所有数据，加上这个不查数据，树节点点击时清空它了
                     initNoSearch:true,
                 }),
                 defaultProps:{children: 'children', label: 'name'}, // 树组件的配置信息
@@ -368,6 +377,7 @@
                         vm.initChooseInfo(); // 初始化已选择的内容
                     });
                 }else{
+                    vm.chooseCascadeParentDataIds = vm.parentChooseDataIds || "";
                     vm.initChooseInfo();
                 }
             },
@@ -502,22 +512,20 @@
                 let vm = this;
                 vm.posArr.forEach(elem =>{ //先比较额外数据岗位
                     if(vm.openLowLevelCheckbox){
-                        if(vm.openLowLevelCheckbox){
-                            if(vm.expandOrignArr.join(",").indexOf(elem.id)!=-1){
-                                //设置一级节点为可选中状态
+                        if(vm.expandOrignArr.join(",").indexOf(elem.id)!=-1){
+                            //设置一级节点为可选中状态
+                            vm.$set(elem,'disabled',false);
+                        }else {
+                            if(vm.chooseCascadeDataIds.indexOf(elem["id"])!= -1 ){
+                                //则设置其子节点也
+                                vm.$set(elem,'disabled',true);
+                            }else{
                                 vm.$set(elem,'disabled',false);
-                            }else {
-                                if(vm.chooseCascadeDataIds.indexOf(elem["id"])!= -1 ){
-                                    //则设置其子节点也
-                                    vm.$set(elem,'disabled',true);
-                                }else{
-                                    vm.$set(elem,'disabled',false);
-                                }
                             }
+                        }
 
-                            vm.$set(vm.isChecked, elem.id, (vm.chooseCascadeParentDataIds.indexOf(elem.id)!= -1)); //设置默认选中状态
+                        vm.$set(vm.isChecked, elem.id, (vm.chooseCascadeParentDataIds.indexOf(elem.id)!= -1)); //设置默认选中状态
 
-                        }
                     }
                 });
                 data.forEach(function (elem) {
@@ -779,6 +787,11 @@
                     </el-tooltip>
                     </span>
                 );
+                    if(vm.isChecked[data.id]){
+                      this.$nextTick(() => {
+                          vm.dChange(data,true);
+                      })
+                    }
                 }
                 return  MyComempte;
             },
@@ -938,6 +951,13 @@
                         return item["id"] != id;
                     });
                     vm.$refs.orgSelectTree.setTreeCheckedKeys(id,false,false);
+                    let temple = vm.$refs.orgSelectTree;
+                    if(vm.isChecked[id]){
+                        vm.isChecked[id] = false;
+                        let nodesMap = temple.getAllNode(); // 节点集合
+                        let currentData = nodesMap[id].data;
+                        this.dChange(currentData,false);
+                    }
                 }
             },
             removePos(id){
@@ -987,6 +1007,8 @@
                 let crud = vm.crud;
                 let objData = {};
                 let searchForm = crud.searchForm;
+                vm.crud.searchForm["checkedUserIds"] = "";
+                vm.crud.searchForm["showCheckedUser"] = "0";
                 crud.noClearSearchColumns && crud.noClearSearchColumns.forEach(function (key) {
                     objData[key] = searchForm[key];
                 });
@@ -999,6 +1021,15 @@
                 if(vm.tenantId){
                     vm.crud.searchForm["tenantId"] = vm.tenantId;
                 }
+                if(this.crud.searchForm.showCheckedUser === "1"){
+                  let checkedUserIds = [];
+                  (vm.checkedUser || []).forEach(item => {
+                      checkedUserIds.push(item["userId"]);
+                  })
+                    vm.crud.searchForm["checkedUserIds"] = checkedUserIds.join(",");
+                }else{
+                    vm.crud.searchForm["checkedUserIds"] = "";
+                }
                 vm.crud.search(vm.checkSelectedMsg);
             },
             rowClick(row){ // table行点击事件
@@ -1186,6 +1217,14 @@
                     }
                 })
 
+            },
+
+            formatterOrgName(row, column, cellValue){
+                if(row["orgParentTreeName"]){
+                  return row["orgParentTreeName"] + "->" + row["orgName"];
+                }else{
+                  return row["orgName"];
+                }
             }
 
         }

package/src/components/public/upload/plImage.vue

@@ -33,7 +33,9 @@
         },
         async getImgInfo(vm){
             const res = await vm.axios.post(vm.api.baseUploadUrl+'viewFile', {fkId: vm.fkid});
-            if(!res || !res.data || res.data.constructor !== Array || res.data.length <= 0) return [];
+            if(!res || !res.data || res.data.constructor !== Array || res.data.length <= 0) {
+              return [];
+            }
             return res.data;
         }
     };

package/src/components/public/upload/plUpload.vue

@@ -30,6 +30,12 @@
                 <div class="pl-file-list-item-text">
                     {{ file.name }}
                 </div>
+                <div class="pl-file-list-bottom item-text-other" style="margin-top: -8px;" v-if="file.fileName2">
+                    <div class="file-list-bottom-box">
+                        <span class="date-badge" v-if="file.isThisYearFile">{{ file.isThisYearFile ? 'new' : '' }}</span>
+                        <div class="file-list-bottom-cont">{{ file.fileName2 }}</div>
+                    </div>
+                </div>
                 <div class="pl-file-list-item-btn pos-abs-full">
                     <div class="top-btn" @click.stop="tempRemove(file)" v-if="!isDisabled && !isView">
                         <i class="el-icon-close btn-close" title="删除"></i>
@@ -52,6 +58,9 @@
                     </div>
                 </div>
             </div>
+            <div style='width: 135px'></div>
+            <div style='width: 135px'></div>
+            <div style='width: 135px'></div>
         </div>
 
         <el-dialog class="pl-upload-temp-dialog" :visible.sync="tempDialogVisible"
@@ -74,7 +83,9 @@
           title="水印选择" append-to-body
           :visible.sync="waterdialogVisible"
           width="300px">
-            <el-select v-model="checkWaterMarkText" placeholder="请选择" >
+            <el-select v-model="checkWaterMarkText" placeholder="请选择"
+               :allow-create="waterMakeConfig.isDiyWater==true" :filterable="waterMakeConfig.isDiyWater==true"
+            >
                 <el-option
                   v-for="item in (waterMakeConfig.waterArr||[])"
                   :key="item"
@@ -87,6 +98,21 @@
             <el-button type="primary" @click="downLoadWaterMarkFile">确 定</el-button>
           </span>
         </el-dialog>
+<!--        <el-dialog-->
+<!--          title="附件预览" append-to-body top="0"-->
+<!--          :visible.sync="ofddialogVisible" custom-class="pl-upload-preview-dialog"-->
+<!--          width="100%" height="100%">-->
+<!--          <ofd-preview :file-url="filePreview.fileUrl" :title="filePreview.fileTitle" v-if="ofddialogVisible"></ofd-preview>-->
+<!--        </el-dialog>-->
+        <el-dialog
+          title="附件预览" append-to-body top="0" ref="docxRef" @close="closeDocxDialog()"
+          :visible.sync="docxDialogVisible" custom-class="pl-upload-web-preview-dialog"
+          width="100%" height="100%">
+          <ofd-preview :file-url="filePreview.fileUrl" :title="filePreview.fileTitle" v-if="ofddialogVisible"></ofd-preview>
+          <div style="position: absolute;top: -40px;right: -40px;width: 80px;height: 80px;border-radius: 0 0 0 40px;z-index: 9999;background-color: rgba(0, 0, 0, 70%);cursor: pointer;line-height: 80px;overflow: hidden" @click="closeDocxDialog()">
+            <i class="el-icon-close" style="position: absolute;bottom: 13px;left: 13px;font-size: 20px;color: #7f7e7e"></i>
+          </div>
+        </el-dialog>
     </div>
 </template>
 
@@ -99,8 +125,7 @@
     import APlayer from 'aplayer';
     import 'aplayer/dist/APlayer.min.css';
     import uploadImg from "./uploadImg";
-    import html2canvas from 'html2canvas'
-
+    import OfdPreview from "./preview/OfdPreview.vue";
     Vue.use(Viewer, {
         defaultOptions: {
             zIndex: 9999
@@ -110,6 +135,7 @@
     export default {
         name: "pl-upload",
         components: {
+          OfdPreview,
             'd-player': VueDPlayer,
         },
         props: {
@@ -148,7 +174,7 @@
             },
             ifTempRemove: {
                 type: Boolean,
-                default: false
+                default: true
             },
             tempRemoveFile: {
                 type: Array,
@@ -196,7 +222,8 @@
                     pdf: ["pdf"],
                     txt: ["txt"],
                     project: ["mpp"],
-                    visio: ["vsdx", "vsd"]
+                    visio: ["vsdx", "vsd"],
+                    ofd:["ofd"]
                 },
                 loading: false,
                 objExtensionToImgType: {},
@@ -219,14 +246,22 @@
                 type: "success",
                 disableFileArr: [], // 不可以上传的文件类型
                 hasWater: false,
+                ofddialogVisible:false,
+                docxDialogVisible:false,
+                filePreview:{
+                    fileUrl:"",
+                    fileTitle:"",
+                },
                 waterdialogVisible:false,
                 checkWaterMarkText:"",
                 downloadWaterMake:{
                     waterMakeText: "我是水印",
                     fileName:"水印下载",
                     fileType:"png",
-                    fileUrl:""
-                }
+                    fileUrl:"",
+                    waterMakeType:"true"
+                },
+                docxLoading:'',
             }
         },
 
@@ -249,6 +284,10 @@
         },
 
         methods: {
+            closeDocxDialog(){
+              this.ofddialogVisible = false;
+              this.docxDialogVisible = false;
+            },
             /*
             ** 初始化配置
             */
@@ -318,18 +357,19 @@
                             return;
                         }
                         file.downloadUrl = vm.api.baseUploadUrl + "downloadFile?id=" + file.id;
+                        file.viewUrl = vm.api.baseUploadUrl + "previewFile?id=" + file.id;
                         // file.downloadUrl = file.downloadUrl.replace("uploadController/downloadFile?id", "wepUploadAction!downloadFile?fjid");
                         // 获取小写文件扩展名
                         let extension = (file.extension || "").toLowerCase();
                         if (extension === "jpg" || extension === "jpeg" || extension === "png") {
-                            file.url = file.downloadUrl;
+                            file.url = file.viewUrl;
                             file.isPreview = true;
                         } else if (vm.objExtensionToImgType[extension]) {
                             file.url = uploadImg[vm.objExtensionToImgType[extension] + ".png"];
                             const dtype = vm.objExtensionToImgType[extension].toLowerCase();
                             if (dtype === 'word' || dtype === 'excel' ||
                                 dtype === 'powerpoint' || dtype === 'pdf' ||
-                                dtype === 'video'
+                                dtype === 'video'||dtype === 'ofd'
                             ) {
                                 file.isPreview = true;
                             } else if (dtype === 'sound') {
@@ -354,7 +394,8 @@
                                             let waterMake = {
                                                 waterMakeText: vm.waterMakeConfig.defaultWaterMake,
                                                 fileName:file.name,
-                                                fileType:extension
+                                                fileType:extension,
+                                                repeat:vm.waterMakeConfig.waterMakeType
                                             }
                                             vm.base64AddWaterMaker(imgResult, waterMake,"view").then((res) => {
                                                 // 这里可以把添加水印后的文件传给后端，我这里只是举例并没有做
@@ -423,11 +464,13 @@
 
                 // 保留this指向 后面会用到的
                 let vm = this;
+                console.log(waterMakeConfig);
                 return new Promise((resolve, reject) => {
-                    let waterMaketext = waterMakeConfig.waterMakeText || "我是水印";
-                    // let waterMaketext = "仅限投标使用，盖章有效"
-                    let repeat = waterMakeConfig.repeat || true;
-                    let fontSize = 30;
+                    let waterMaketext = waterMakeConfig.waterMakeText || "中通服和信科技有限公司";
+                    //let waterMaketext = "中国申信安徽公司法院云平台云计算安全评估能力补齐项目"
+                    let repeat = waterMakeConfig.repeat=="false"?false:true;
+                    //let repeat = true;
+                    let fontSize = 50;
                     const canvas = document.createElement('canvas');
                     const ctx = canvas.getContext('2d');
                     const img = new Image();
@@ -444,26 +487,29 @@
                         // 以左上角为坐标原点 进行绘制图像
                         ctx.drawImage(img, 0, 0, img.width, img.height);
                         ctx.save();
-
-                        let strWidth = 50;
-                        let strHeight = 40;
-                        strWidth = ctx.measureText(waterMaketext).width + 40;
+                        let strWidth = 100;
+                        let strHeight = 1000;
+                        strWidth = ctx.measureText(waterMaketext).width + 600;
                         strHeight = strHeight + 30;
-                        ctx.fillStyle = "rgba(232,232,238,.8)";//设置文字颜色及透明度
-                        ctx.rotate(-0.5); // 水印初始偏转角度
+                        ctx.fillStyle = "rgba(5,5,5,0.3)";//设置文字颜色及透明度
                         if (repeat) {
-                            let moveX = strWidth * 3;
-                            let moveY = 200;
-                            ctx.font = fontSize + 'px 黑体';
-                            for (let i = strWidth * 0.65 * -1; i < img.width; i += moveX) {
-                                for (let j = strHeight; j < img.height * 2; j += moveY) {
+                          ctx.translate(-(img.width/3),0);
+                          ctx.rotate(-Math.PI/5); // 水印初始偏转角度
+                          let repeatfontsize = ((img.width/2)/waterMaketext.length);
+                            ctx.font = repeatfontsize + 'px 宋体';
+                            for (let i = 0; i < img.width; i += (waterMaketext.length*repeatfontsize+80)) {
+                                for (let j = 0; j < img.height * 2; j += (repeatfontsize+100)) {
                                     ctx.fillText(waterMaketext, i, j);
                                     ctx.save();
                                 }
                             }
                         } else {
-                            ctx.font = fontSize * 2 + 'px 黑体';
-                            ctx.fillText(waterMaketext, img.width * 0.1, img.height * 0.85); //在图片上添加字体
+                          let norepeatfontsize = ((img.width*2/3)/waterMaketext.length);
+                            ctx.translate(((img.width/2)-(waterMaketext.length*2/5*(norepeatfontsize))),((img.height*4/5)));
+                            ctx.rotate(-Math.PI/5);
+                            ctx.font = norepeatfontsize + 'px 宋体';
+                            // ctx.fillText(waterMaketext, (img.width/2)-(waterMaketext.length*(norepeatfontsize)/2), (img.height/2)); //在图片上添加字体
+                            ctx.fillText(waterMaketext, 0, 0); //在图片上添加字体
                             ctx.save();
                         }
                         if(type=="view"){
@@ -506,7 +552,7 @@
                 let formData = new FormData();
                 formData.append("file", item.file);
                 formData.append("fkId", vm.fileFkId);
-                formData.append("extraPath", this.extraPath);
+                formData.append("extraPath", "");
                 //创建axios实例
                 vm.axios.defaults.headers = null;
                 const axiosInstance = vm.axios.create({
@@ -672,27 +718,49 @@
                     this.previewImg(file, index);
                 } else {
                     const dtype = this.objExtensionToImgType[type].toLowerCase();
-                    if (dtype === 'word' || dtype === 'excel' ||
-                        dtype === 'powerpoint' || dtype === 'pdf') {
-                        this.previewDoc(type, file.id);
-                    } else if (dtype === 'video') {
+                    if (dtype === 'pdf' || dtype === 'powerpoint'|| (dtype === 'word' && window.isLocal)) {
+                        const routeData = this.$router.resolve({
+                          path: '/pdfpreview',
+                          query: {fjid: file.id}
+                        });
+                        window.open(routeData.href, '_blank');
+                    }  else if (dtype === 'video') {
                         this.previewAudiovisual(type, file);
                     } else if (dtype === 'sound') {
                         this.previewPlaySound(type, file);
+                    }else if(dtype === "ofd"){
+                      this.filePreview.fileUrl = file.viewUrl;
+                      this.filePreview.fileTitle = file.name;
+                      this.ofddialogVisible = true;
+                      this.docxDialogVisible = true;
+                    } else if(dtype === 'excel' || (dtype === 'word' && !window.isLocal)){
+                        this.previewOffice(dtype, file.id);
                     }
                 }
             },
+            previewOffice(type,fjid){
+                const routeData = this.$router.resolve({
+                    path: '/officeViewer',
+                    query: {fjType: type, fjid: fjid}
+                });
+                window.open(routeData.href, '_blank');
+            },
             /*
             ** 预览图片
             */
             previewImg(file, index) {
                 const viewer = this.$el.querySelector('#viewer-selection').$viewer;
-                viewer.images = viewer.images.filter(data => {
-                    if (data.currentSrc.indexOf("static/images/upload") == -1) {
-                        return data;
+                let delNum = 0;
+                viewer.images = viewer.images.filter((data,num) => {
+                    if (data.currentSrc.indexOf("static/images/upload") == -1&&data.currentSrc.indexOf("static/img/") == -1) {
+                      return data;
+                    }else{
+                      if(num<index){
+                        delNum++;
+                      }
                     }
                 });
-                viewer.index = index;
+                viewer.index = index-delNum;
                 viewer.options.hide = () => {
                     // 不延时关闭的话会影响原dialog隐藏显示
                     setTimeout(() => {
@@ -724,6 +792,8 @@
                     case 'pdf':
                         fjType = 'pdf';
                         break;
+                  default:
+                    break;
                 }
                 const routeData = this.$router.resolve({
                     path: '/pdfViewer',
@@ -808,7 +878,8 @@
                                     let waterMake = {
                                         waterMakeText: this.checkWaterMarkText||this.downloadWaterMake.waterMakeText,
                                         fileName:this.downloadWaterMake.fileName,
-                                        fileType:this.downloadWaterMake.fileType
+                                        fileType:this.downloadWaterMake.fileType,
+                                        repeat:this.downloadWaterMake.repeat
                                     }
                                     this.base64AddWaterMaker(imgResult, waterMake,"download").then((res) => {
                                         // 这里可以把添加水印后的文件传给后端，我这里只是举例并没有做
@@ -816,7 +887,8 @@
                                             waterMakeText: this.waterMakeConfig.defaultWaterMake,
                                             fileName:"",
                                             fileType:"png",
-                                            fileUrl:""
+                                            fileUrl:"",
+                                            repeat:this.downloadWaterMake.repeat
                                         }
                                         this.waterdialogVisible = false;
                                     });
@@ -841,7 +913,8 @@
                         waterMakeText: this.waterMakeConfig.defaultWaterMake,
                         fileName:fileName,
                         fileType:type,
-                        fileUrl:url
+                        fileUrl:url,
+                        repeat:this.waterMakeConfig.waterMakeType
                     }
                     //获取系统参数
                     if (this.downInstructions) {
@@ -1013,6 +1086,36 @@
           white-space: nowrap;
           overflow: hidden;
         }
+
+        .pl-file-list-bottom {
+          color: #666666;
+          text-align: center;
+          margin: 0 4px;
+
+          .file-list-bottom-box {
+            height: 24px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+
+            .date-badge {
+              display: inline-block;
+              color: #fff;
+              //position: absolute;
+              //left: -37px;
+              //top: 2px;
+              background-color: rgba(250,0,0,.8);
+              border-radius: 10px;
+              font-size: 12px;
+              height: 16px;
+              line-height: 16px;
+              padding: 0 6px;
+              text-align: center;
+              white-space: nowrap;
+              border: 1px solid #fff;
+            }
+          }
+        }
       }
     }
 
@@ -1117,8 +1220,32 @@
   }
 </style>
 
-<style>
+<style lang="scss">
     .pl-upload-container .el-upload, .pl-upload-container .el-upload-dragger {
         width: 100%;
     }
+    .pl-upload-preview-dialog .el-dialog__body{
+      bottom: 0!important;
+    }
+    .pl-upload-web-preview-dialog {
+      background: rgba(0, 0, 0, 0.5)!important;
+      .el-dialog__body{
+        top: 0!important;
+        bottom: 0!important;
+        padding: 0;
+        overflow: hidden!important;
+        //overflow-y: auto;
+
+        .modal-box{
+          height: calc(100% - 60px)!important;
+          margin-top: 30px;
+          .background-shadow{
+            background: transparent!important;
+          }
+        }
+      }
+    }
+    .pl-upload-web-preview-dialog .el-dialog__header{
+      display: none;
+    }
 </style>