refine upload

src/assets/iconfont/iconfont.js

@@ -14,6 +14,12 @@
     '' +
     '</symbol>' +
     '' +
+    '<symbol id="icon-quanxian" viewBox="0 0 1024 1024">' +
+    '' +
+    '<path d="M818.246893 412.326906l-45.988404 0 0-70.991868c0-152.307871-123.463939-275.778974-275.778974-275.778974s-275.78102 123.471103-275.78102 275.778974l0 70.991868-45.987381 0c-25.379017 0-45.988404 20.566408-45.988404 45.987381l0 455.407074c0 25.428136 20.560268 45.988404 45.988404 45.988404l643.535779 0c25.37697 0 45.988404-20.560268 45.988404-45.988404L864.235296 458.314287C864.190271 432.893314 843.623863 412.326906 818.246893 412.326906L818.246893 412.326906zM680.331823 412.326906 312.62516 412.326906l0-70.991868c0-101.55393 82.344426-183.853331 183.854355-183.853331 101.509928 0 183.853331 82.343403 183.853331 183.853331L680.332846 412.326906 680.331823 412.326906zM680.331823 412.326906"  ></path>' +
+    '' +
+    '</symbol>' +
+    '' +
     '<symbol id="icon-zonghe" viewBox="0 0 1024 1024">' +
     '' +
     '<path d="M770.56 460.8l250.88 0C998.4 220.16 803.84 25.6 563.2 2.56l0 250.88C668.16 273.92 750.08 355.84 770.56 460.8L770.56 460.8zM770.56 460.8"  ></path>' +

src/components/Tinymce/components/editorImage.vue

@@ -5,14 +5,14 @@
         <el-dialog v-model="dialogVisible">
             <el-upload
                     class="editor-slide-upload"
-                    action="https://upload.qbox.me"
+                    action="https://httpbin.org/post"
                     :data="dataObj"
                     :multiple="true"
                     :file-list="fileList"
                     :show-file-list="true"
                     list-type="picture-card"
                     :on-remove="handleRemove"
-                    :before-upload="beforeUpload">
+                    :on-success="handleImageScucess">
                 <el-button size="small" type="primary">点击上传</el-button>
             </el-upload>
             <el-button @click="dialogVisible = false">取 消</el-button>
@@ -56,6 +56,9 @@
             }
           }
         },
+        handleImageScucess(file) {
+          this.list.push({ url: file.files.file });
+        },
         beforeUpload() {
           const _self = this;
           return new Promise((resolve, reject) => {

src/components/Tinymce/index.vue

@@ -100,47 +100,38 @@
               this.$emit('input', editor.getContent({ format: 'raw' }));
             });
           },
-          images_dataimg_filter(img) {
+          // images_dataimg_filter(img) {
-            setTimeout(() => {
+          //   setTimeout(() => {
-              const $image = $(img);
+          //     const $image = $(img);
-              $image.removeAttr('width');
+          //     $image.removeAttr('width');
-              $image.removeAttr('height');
+          //     $image.removeAttr('height');
-              if ($image[0].height && $image[0].width) {
+          //     if ($image[0].height && $image[0].width) {
-                $image.attr('data-wscntype', 'image');
+          //       $image.attr('data-wscntype', 'image');
-                $image.attr('data-wscnh', $image[0].height);
+          //       $image.attr('data-wscnh', $image[0].height);
-                $image.attr('data-wscnw', $image[0].width);
+          //       $image.attr('data-wscnw', $image[0].width);
-                $image.addClass('wscnph');
+          //       $image.addClass('wscnph');
-              }
+          //     }
-            }, 0);
+          //   }, 0);
-            return img
+          //   return img
-          },
+          // },
-          images_upload_handler(blobInfo, success, failure, progress) {
+          // images_upload_handler(blobInfo, success, failure, progress) {
-            progress(0);
+          //   progress(0);
-            const token = _this.$store.getters.token;
+          //   const token = _this.$store.getters.token;
-            getToken(token).then(response => {
+          //   getToken(token).then(response => {
-              const url = response.data.qiniu_url;
+          //     const url = response.data.qiniu_url;
-              const formData = new FormData();
+          //     const formData = new FormData();
-              formData.append('token', response.data.qiniu_token);
+          //     formData.append('token', response.data.qiniu_token);
-              formData.append('key', response.data.qiniu_key);
+          //     formData.append('key', response.data.qiniu_key);
-              formData.append('file', blobInfo.blob(), url);
+          //     formData.append('file', blobInfo.blob(), url);
-              upload(formData).then(() => {
+          //     upload(formData).then(() => {
-                success(url);
+          //       success(url);
-                progress(100);
+          //       progress(100);
-                // setTimeout(() => {
+          //     })
-                //   const doc = tinymce.activeEditor.getDoc();
+          //   }).catch(err => {
-                //   const $$ = tinymce.dom.DomQuery;
+          //     failure('出现未知问题，刷新页面，或者联系程序员')
-                //   const $image = $$(doc).find('img[src="' + url + '"]')
+          //     console.log(err);
-                //   $image.addClass('wscnph');
+          //   });
-                //   $image.attr('data-wscntype', 'image');
+          // },
-                //   $image.attr('data-wscnh', $image[0].height || 640);
-                //   $image.attr('data-wscnw', $image[0].width || 640);
-                // }, 0);
-              })
-            }).catch(err => {
-              failure('出现未知问题，刷新页面，或者联系程序员')
-              console.log(err);
-            });
-          },
           setup(editor) {
             editor.addButton('h2', {
               title: '小标题', // tooltip text seen on mouseover

src/components/Upload/singleImage.vue

@@ -6,8 +6,8 @@
                 drag
                 :multiple="false"
                 :show-file-list="false"
-                action="https://upload.qbox.me"
+                action="https://httpbin.org/post"
-                :before-upload="beforeUpload"
+
                 :on-success="handleImageScucess">
             <i class="el-icon-upload"></i>
             <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>

src/components/Upload/singleImage2.vue

@@ -6,8 +6,8 @@
                 drag
                 :multiple="false"
                 :show-file-list="false"
-                action="https://upload.qbox.me"
+                action="https://httpbin.org/post"
-                :before-upload="beforeUpload"
+
                 :on-success="handleImageScucess">
             <i class="el-icon-upload"></i>
             <div class="el-upload__text">Drag或<em>点击上传</em></div>

src/components/Upload/singleImage3.vue

@@ -6,8 +6,8 @@
                 drag
                 :multiple="false"
                 :show-file-list="false"
-                action="https://upload.qbox.me"
+                action="https://httpbin.org/post"
-                :before-upload="beforeUpload"
+
                 :on-success="handleImageScucess">
             <i class="el-icon-upload"></i>
             <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
@@ -15,7 +15,7 @@
         <div class="image-preview image-app-preview">
             <div class="image-preview-wrapper" v-show="imageUrl.length>1">
                 <div class='app-fake-conver'>&nbsp&nbsp全球 付费节目单 最热 经济</div>
-                <img :src="imageUrl+'?imageView2/1/h/180/w/320/q/100'">
+                <img :src="imageUrl">
                 <div class="image-preview-action">
                     <i @click="rmImage" class="el-icon-delete"></i>
                 </div>
@@ -23,7 +23,7 @@
         </div>
         <div class="image-preview">
             <div class="image-preview-wrapper" v-show="imageUrl.length>1">
-                <img :src="imageUrl+'?imageView2/1/w/200/h/200'">
+                <img :src="imageUrl">
                 <div class="image-preview-action">
                     <i @click="rmImage" class="el-icon-delete"></i>
                 </div>
@@ -57,8 +57,8 @@
         emitInput(val) {
           this.$emit('input', val);
         },
-        handleImageScucess() {
+        handleImageScucess(file) {
-          this.emitInput(this.tempUrl)
+          this.emitInput(file.files.file)
         },
         beforeUpload() {
           const _self = this;

src/main.js

@@ -36,7 +36,6 @@ Object.keys(filters).forEach(key => {
   Vue.filter(key, filters[key])
 });
 
-
 function hasPermission(roles, permissionRoles) {
   if (roles.indexOf('admin') >= 0) return true;
   return roles.some(role => permissionRoles.indexOf(role) >= 0)

src/router/index.js

@@ -54,6 +54,8 @@ const Table = resolve => require(['../views/example/table'], resolve);
 const Form1 = resolve => require(['../views/example/form1'], resolve);
 const Form2 = resolve => require(['../views/example/form2'], resolve);
 
+/* permission */
+const Permission = resolve => require(['../views/permission/index'], resolve);
 
 /* admin*/
 // const AdminCreateUser = resolve => require(['../views/admin/createUser'], resolve);
@@ -86,6 +88,19 @@ export default new Router({
                 { path: 'dashboard', component: dashboard }
       ]
     },
+
+    {
+      path: '/permission',
+      component: Layout,
+      redirect: '/permission/index',
+      name: '权限测试',
+      icon: 'quanxian',
+      meta: { role: ['admin'] },
+      noDropdown: true,
+      children: [
+       { path: 'index', component: Permission, name: '权限测试页', meta: { role: ['admin'] } }
+      ]
+    },
     {
       path: '/components',
       component: Layout,

src/views/permission/index.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="app-container">
+     <div style='margin-bottom:15px;'>你的权限： {{roles}}</div>
+     切换权限：
+      <el-radio-group v-model="role">
+        <el-radio-button label="editor"></el-radio-button>
+      </el-radio-group>
+  </div>
+</template>
+
+<script>
+    import { mapGetters } from 'vuex';
+    export default{
+      data() {
+        return {
+          role: ''
+        }
+      },
+      computed: {
+        ...mapGetters([
+          'roles'
+        ])
+      },
+      watch: {
+        role(val) {
+          this.$store.commit('SET_ROLES', [val]);
+          window.location.reload()
+        }
+      }
+    }
+</script>