fix(view): 上传七牛

Author: lisgroup

admin/src/components/common/navBar.vue

@@ -1,48 +1,49 @@
 <template>
-  <div>
+  <div class="nav">
     <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
       <el-row :gutter="1">
         <el-col :xs="6" :sm="6" :md="4" :lg="4" :xl="4">
           <div class="grid-content">
             <el-menu-item index="1">
-              <router-link :to="{name: 'index'}">首页</router-link>
+              <router-link :to="{name: 'index'}">公交-首页</router-link>
             </el-menu-item>
           </div>
         </el-col>
         <el-col :xs="6" :sm="6" :md="4" :lg="4" :xl="4">
           <div class="grid-content">
             <el-menu-item index="3">
-              <router-link :to="{name: 'echarts'}">图表</router-link>
+              <router-link :to="{name: 'out'}" class="login">中文排版</router-link>
             </el-menu-item>
           </div>
         </el-col>
         <el-col :xs="6" :sm="6" :md="4" :lg="4" :xl="4">
           <div class="grid-content">
             <el-menu-item index="4">
-              <router-link :to="{path: '/login'}">用户中心</router-link>
+              <router-link :to="{name: 'excel'}" class="login">在线表格 Excel</router-link>
+            </el-menu-item>
+          </div>
+        </el-col>
+        <el-col :xs="6" :sm="6" :md="4" :lg="4" :xl="4">
+          <div class="grid-content">
+            <el-menu-item index="4">
+              <router-link :to="{name: 'upload'}" class="login">图片转文字</router-link>
             </el-menu-item>
           </div>
         </el-col>
         <el-col :xs="6" :sm="6" :md="4" :lg="4" :xl="4">
           <div class="grid-content">
             <el-submenu index="2">
-              <template slot="title">常用工具</template>
-              <el-menu-item index="2-1" class="sub">
-                <router-link :to="{name: 'out'}" class="login">中文排版</router-link>
-              </el-menu-item>
-              <el-menu-item index="2-2">
-                <router-link :to="{name: 'md'}" class="login">markdown</router-link>
-              </el-menu-item>
+              <template slot="title">其它工具</template>
               <el-menu-item index="2-2">
-                <router-link :to="{name: 'excel'}" class="login">在线表格</router-link>
+                <router-link :to="{name: 'md'}" class="login">Markdown</router-link>
               </el-menu-item>
               <el-menu-item index="2-2">
-                <router-link :to="{name: 'upload'}" class="login">图片转文字</router-link>
+                <router-link :to="{name: 'echarts'}">图表</router-link>
               </el-menu-item>
             </el-submenu>
           </div>
         </el-col>
-        <el-col :xs="6" :sm="6" :md="0" :lg="0" :xl="0"/>
+        <!--<el-col :xs="6" :sm="6" :md="0" :lg="0" :xl="0"/>-->
       </el-row>
     </el-menu>
   </div>
@@ -60,6 +61,18 @@ export default {
 </script>
 
 <style scoped>
+  .nav {
+    padding-left: 0;
+    margin-bottom: 20px;
+    list-style: none
+  }
+  .nav:after, .nav:before {
+    display:table;
+    content:" "
+  }
+  .nav:after {
+    clear:both
+  }
   .el-row {
     /*margin-bottom: 20px;*/
     height: 50px;

admin/src/views/home/excel.vue

@@ -3,12 +3,13 @@
     <nav-bar/>
     <el-upload
       ref="upload"
+      :data="dataObj"
+      :action="uploadUrl"
       :on-preview="handlePreview"
       :on-remove="handleRemove"
       :before-upload="beforeUpload"
       :file-list="fileList"
-      class="upload-demo"
-      action="">
+      class="upload-demo">
       <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
       <div slot="tip" class="el-upload__tip">只能上传 Excel 文件，且不超过 500kb</div>
     </el-upload>
@@ -30,16 +31,32 @@
 
 <script>
 import XLSX from 'xlsx'
+import request from '../../utils/request'
+
 export default {
   data() {
     return {
       fileList: [],
       upLoadNumber: 100000,
       tableTitle: '',
       tableData: [],
-      tableHeader: ''
+      tableHeader: '',
+      uploadUrl: 'http://up.qiniu.com',
+      dialogImageUrl: '',
+      dialogVisible: false,
+      desc: '',
+      dataObj: {}
     }
   },
+  created() {
+    // 加载页面时候需要获取本次上传七牛的 Token ，并且赋值
+    const that = this
+    request.get('/api/getToken').then(res => {
+      // console.log(that.dataObj)
+      that.dataObj = { 'token': res.data.token }
+      console.log(that.dataObj)
+    })
+  },
   methods: {
     submitUpload() {
       this.$refs.upload.submit()