From 4cda3f7df2655bd07cb9d503e36ff0f239d967b9 Mon Sep 17 00:00:00 2001
From: guqing <38999863+DarrenGu@users.noreply.github.com>
Date: Wed, 26 Jun 2019 22:59:23 +0800
Subject: [PATCH 1/3] =?UTF-8?q?=E9=99=84=E4=BB=B6=E7=B1=BB=E5=9E=8B?=
 =?UTF-8?q?=E5=88=A4=E6=96=AD=E9=9D=9E=E5=9B=BE=E7=89=87=E4=B8=8D=E9=A2=84?=
 =?UTF-8?q?=E8=A7=88=EF=BC=8C=E5=A2=9E=E5=8A=A0=E8=A7=86=E9=A2=91=E9=A2=84?=
 =?UTF-8?q?=E8=A7=88=20(#25)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* 补充了日志九宫格图片上传功能

* 完善日志图片功能

* 增加对文件类型的判断，不是图片则不支持预览

* 增加附加视频预览功能，并对不支持预览的缩略图做不支持处理

* 修复eslint
---
 package.json                                  |   5 +-
 src/components/Upload/UploadPhoto.vue         | 139 +++++++++++
 src/views/attachment/AttachmentList.vue       |  29 ++-
 .../components/AttachmentDetailDrawer.vue     |  95 ++++++-
 src/views/dashboard/Dashboard.vue             |  55 ++++-
 src/views/sheet/internal/JournalList.vue      | 231 ++++++++++--------
 6 files changed, 446 insertions(+), 108 deletions(-)
 create mode 100644 src/components/Upload/UploadPhoto.vue

diff --git a/package.json b/package.json
index 1689866e..18eb587f 100644
--- a/package.json
+++ b/package.json
@@ -21,12 +21,13 @@
     "vue": "^2.6.10",
     "vue-clipboard2": "^0.3.0",
     "vue-codemirror-lite": "^1.0.4",
+    "vue-count-to": "^1.0.13",
     "vue-cropper": "0.4.9",
     "vue-ls": "^3.2.1",
     "vue-router": "^3.0.6",
+    "vue-video-player": "^5.0.2",
     "vuejs-logger": "^1.5.3",
-    "vuex": "^3.1.1",
-    "vue-count-to": "^1.0.13"
+    "vuex": "^3.1.1"
   },
   "devDependencies": {
     "@babel/polyfill": "^7.4.4",
diff --git a/src/components/Upload/UploadPhoto.vue b/src/components/Upload/UploadPhoto.vue
new file mode 100644
index 00000000..86bec4ed
--- /dev/null
+++ b/src/components/Upload/UploadPhoto.vue
@@ -0,0 +1,139 @@
+<template>
+  <div class="clearfix">
+    <a-upload
+      :name="name"
+      :customRequest="handleUpload"
+      listType="picture-card"
+      :fileList="fileList"
+      @preview="handlePreview"
+      @change="handleChange"
+    >
+      <div v-if="fileList.length < 9 && plusPhotoVisible" id="plus-photo-uploadbox">
+        <a-icon type="plus"/>
+        <div class="ant-upload-text">Upload</div>
+      </div>
+    </a-upload>
+    <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel">
+      <img alt="example" style="width: 100%" :src="previewImage">
+    </a-modal>
+  </div>
+</template>
+<script>
+import axios from 'axios'
+import attachmentApi from '@/api/attachment'
+export default {
+  props: {
+    photoList: {
+      type: Array,
+      required: false,
+      default: function() {
+        return []
+      }
+    },
+    plusPhotoVisible: {
+      type: Boolean,
+      required: false,
+      default: true
+    }
+  },
+  data() {
+    return {
+      name: 'file',
+      previewVisible: false,
+      previewImage: '',
+      fileList: [],
+      uploadHandler: attachmentApi.upload
+    }
+  },
+  created() {
+    // 在生命周期开始时调用一次赋值解决watch没有监控到数据的问题
+    this.handlerEditPreviewPhoto(this.photoList)
+  },
+  watch: {
+    photoList(newValue, oldValue) {
+      this.handlerEditPreviewPhoto(newValue)
+    }
+  },
+  methods: {
+    handlerEditPreviewPhoto(data) {
+      // 先清空
+      this.fileList = []
+      // 编辑日志时回显图片
+      if (data !== null && data !== undefined) {
+        for (var i = 0; i < data.length; i++) {
+          // 构造合适的对象
+          this.fileList.push({
+            uid: data[i].id,
+            name: data[i].name,
+            status: 'done',
+            url: data[i].thumbnail
+          })
+        }
+      }
+    },
+    handleCancel() {
+      this.previewVisible = false
+    },
+    handlePreview(file) {
+      this.previewImage = file.url || file.thumbUrl
+      this.previewVisible = true
+    },
+    handleChange({ fileList }) {
+      this.fileList = fileList
+    },
+    handleUpload(option) {
+      this.$log.debug('Uploading option', option)
+      const CancelToken = axios.CancelToken
+      const source = CancelToken.source()
+
+      const data = new FormData()
+      data.append(this.name, option.file)
+
+      this.uploadHandler(
+        data,
+        progressEvent => {
+          if (progressEvent.total > 0) {
+            progressEvent.percent = (progressEvent.loaded / progressEvent.total) * 100
+          }
+          this.$log.debug('Uploading percent: ', progressEvent.percent)
+          option.onProgress(progressEvent)
+        },
+        source.token,
+        option.file
+      )
+        .then(response => {
+          this.$log.debug('Uploaded successfully', response)
+          option.onSuccess(response, option.file)
+          this.$emit('success', response, option.file)
+        })
+        .catch(error => {
+          this.$log.debug('Failed to upload file', error)
+          option.onError(error, error.response)
+          this.$emit('failure', error, option.file)
+        })
+      return {
+        abort: () => {
+          this.$log.debug('Upload operation aborted by the user')
+          source.cancel('Upload operation canceled by the user.')
+        }
+      }
+    }
+  }
+}
+</script>
+<style>
+/* you can make up upload button and sample style by using stylesheets */
+.ant-upload-select-picture-card i {
+  font-size: 32px;
+  color: #999;
+}
+
+.ant-upload-select-picture-card .ant-upload-text {
+  margin-top: 8px;
+  color: #666;
+}
+.ant-upload-list-picture-card {
+  /* 将浮动恢复为默认值,避免出现纵向换行情况 */
+  float: initial;
+}
+</style>
diff --git a/src/views/attachment/AttachmentList.vue b/src/views/attachment/AttachmentList.vue
index 689c85ac..3626e3bf 100644
--- a/src/views/attachment/AttachmentList.vue
+++ b/src/views/attachment/AttachmentList.vue
@@ -99,7 +99,8 @@
               @click="handleShowDetailDrawer(item)"
             >
               <div class="attach-thumb">
-                <img :src="item.thumbPath">
+                <span v-show="!handleJudgeMediaType(item)">当前格式不支持预览</span>
+                <img :src="item.thumbPath" v-show="handleJudgeMediaType(item)">
               </div>
               <a-card-meta>
                 <ellipsis
@@ -242,6 +243,23 @@ export default {
     onUploadClose() {
       this.loadAttachments()
       this.loadMediaTypes()
+    },
+    handleJudgeMediaType(attachment) {
+      var mediaType = attachment.mediaType
+      // 判断文件类型
+      if (mediaType) {
+        var prefix = mediaType.split('/')[0]
+
+        if (prefix === 'image') {
+          // 是图片
+          return true
+        } else {
+          // 非图片
+          return false
+        }
+      }
+      // 没有获取到文件返回false
+      return false
     }
   }
 }
@@ -262,13 +280,20 @@ export default {
   position: relative;
   padding-bottom: 56%;
   overflow: hidden;
-  img {
+  img, span{
     width: 100%;
     height: 100%;
     position: absolute;
     top: 0;
     left: 0;
   }
+  span {
+    display: flex;
+    font-size: 12px;
+    align-items: center;
+    justify-content: center;
+    color: #9b9ea0;
+  }
 }
 
 .ant-card-meta {
diff --git a/src/views/attachment/components/AttachmentDetailDrawer.vue b/src/views/attachment/components/AttachmentDetailDrawer.vue
index 9ff754c2..ba0d8427 100644
--- a/src/views/attachment/components/AttachmentDetailDrawer.vue
+++ b/src/views/attachment/components/AttachmentDetailDrawer.vue
@@ -18,7 +18,15 @@
           :paragraph="{rows: 8}"
         >
           <div class="attach-detail-img">
-            <img :src="attachment.path">
+            <div v-show="nonsupportPreviewVisible">此文件不支持预览</div>
+            <img :src="attachment.path" v-show="photoPreviewVisible">
+            <video-player
+              class="video-player-box"
+              v-show="videoPreviewVisible"
+              ref="videoPlayer"
+              :options="playerOptions"
+              :playsinline="true">
+            </video-player>
           </div>
         </a-skeleton>
       </a-col>
@@ -74,7 +82,7 @@
                 <span slot="title">附件大小：</span>
               </a-list-item-meta>
             </a-list-item>
-            <a-list-item>
+            <a-list-item v-if="photoPreviewVisible">
               <a-list-item-meta :description="attachment.height+'x'+attachment.width">
                 <span slot="title">图片尺寸：</span>
               </a-list-item-meta>
@@ -100,7 +108,7 @@
                 </span>
               </a-list-item-meta>
             </a-list-item>
-            <a-list-item>
+            <a-list-item v-if="photoPreviewVisible">
               <a-list-item-meta>
                 <span slot="description">![{{ attachment.name }}]({{ attachment.path }})</span>
                 <span slot="title">
@@ -148,15 +156,40 @@
 import { mixin, mixinDevice } from '@/utils/mixin.js'
 import attachmentApi from '@/api/attachment'
 import photoApi from '@/api/photo'
+import 'video.js/dist/video-js.css'
+import { videoPlayer } from 'vue-video-player'
 
 export default {
   name: 'AttachmentDetailDrawer',
   mixins: [mixin, mixinDevice],
+  components: {
+    videoPlayer
+  },
   data() {
     return {
       detailLoading: true,
       editable: false,
-      photo: {}
+      photo: {},
+      photoPreviewVisible: false,
+      videoPreviewVisible: false,
+      nonsupportPreviewVisible: false,
+      playerOptions: {
+        // videojs options
+        muted: true,
+        language: 'zh-CN',
+        aspectRatio: '16:9',
+        fluid: true,
+        controls: true,
+        loop: false,
+        playbackRates: [0.7, 1.0, 1.5, 2.0],
+        sources: [{
+          type: 'video/mp4',
+          src: 'https://cdn.theguardian.tv/webM/2015/07/20/150716YesMen_synd_768k_vp8.webm'
+        }],
+        poster: '/static/images/author.jpg',
+        width: document.documentElement.clientWidth,
+        notSupportedMessage: '此视频暂无法播放，请稍后再试'
+      }
     }
   },
   model: {
@@ -182,6 +215,11 @@ export default {
   created() {
     this.loadSkeleton()
   },
+  computed: {
+    player() {
+      return this.$refs.videoPlayer.player
+    }
+  },
   watch: {
     visiable: function(newValue, oldValue) {
       this.$log.debug('old value', oldValue)
@@ -189,6 +227,12 @@ export default {
       if (newValue) {
         this.loadSkeleton()
       }
+    },
+    attachment: function(newValue, oldValue) {
+      if (newValue) {
+        var attachment = newValue
+        this.handleJudgeMediaType(attachment)
+      }
     }
   },
   methods: {
@@ -250,7 +294,47 @@ export default {
     },
     onClose() {
       this.$emit('close', false)
+    },
+    handleJudgeMediaType(attachment) {
+      var mediaType = attachment.mediaType
+      // 判断文件类型
+      if (mediaType) {
+        var prefix = mediaType.split('/')[0]
+
+        if (prefix === 'video' || prefix === 'flv') {
+          this.videoPreviewVisible = true
+          this.photoPreviewVisible = false
+          this.nonsupportPreviewVisible = false
+          // 设置视频地址
+          this.$set(this.playerOptions.sources, 0, {
+            type: mediaType,
+            src: attachment.path
+          })
+          console.log(this.playerOptions.sources)
+        } else if (prefix === 'image') {
+          this.photoPreviewVisible = true
+          this.videoPreviewVisible = false
+          this.nonsupportPreviewVisible = false
+        } else {
+          this.nonsupportPreviewVisible = true
+          this.videoPreviewVisible = false
+          this.photoPreviewVisible = false
+        }
+      }
     }
+    // handleDownLoadPhoto(attachment) {
+    //   var path = attachment.path
+
+    //   var index = path.lastIndexOf('/')
+    //   var filename = path.substr(index+1, path.length)
+    //   //  chrome/firefox
+    //   var aTag = document.createElement('a')
+    //   aTag.download = filename
+    //   aTag.href = path//URL.createObjectURL(blob)
+    //   aTag.target = '_blank'
+    //   aTag.click()
+    //   URL.revokeObjectURL(aTag.href)
+    // }
   }
 }
 </script>
@@ -259,4 +343,7 @@ export default {
 .attach-detail-img img {
   width: 100%;
 }
+.video-player-box {
+  width: 100%;
+}
 </style>
diff --git a/src/views/dashboard/Dashboard.vue b/src/views/dashboard/Dashboard.vue
index 8e3016ed..2c31458d 100644
--- a/src/views/dashboard/Dashboard.vue
+++ b/src/views/dashboard/Dashboard.vue
@@ -200,11 +200,26 @@
                 placeholder="写点什么吧..."
               />
             </a-form-item>
+
+            <!-- 日志图片上传 -->
+            <a-form-item v-show="showMoreOptions">
+              <UploadPhoto
+                @success="handlerPhotoUploadSuccess"
+                :photoList="photoList"
+              ></UploadPhoto>
+            </a-form-item>
+
             <a-form-item>
               <a-button
                 type="primary"
                 @click="handleCreateJournalClick"
               >保存</a-button>
+              <a
+                href="javascript:;"
+                class="more-options-btn"
+                type="default"
+                @click="handleUploadPhotoWallClick"
+              >更多选项<a-icon type="down" /></a>
             </a-form-item>
           </a-form>
         </a-card>
@@ -318,6 +333,7 @@ import logApi from '@/api/log'
 import adminApi from '@/api/admin'
 import journalApi from '@/api/journal'
 import countTo from 'vue-count-to'
+import UploadPhoto from '../../components/Upload/UploadPhoto.vue'
 export default {
   name: 'Dashboard',
   mixins: [mixin, mixinDevice],
@@ -325,10 +341,13 @@ export default {
     PageView,
     AnalysisCard,
     RecentCommentTab,
-    countTo
+    countTo,
+    UploadPhoto
   },
   data() {
     return {
+      photoList: [],
+      showMoreOptions: false,
       startVal: 0,
       logType: logApi.logType,
       activityLoading: true,
@@ -339,7 +358,11 @@ export default {
       postData: [],
       logData: [],
       countsData: {},
-      journal: {},
+      journal: {
+        content: '',
+        photos: []
+      },
+      journalPhotos: [], // 日志图片集合最多九张
       logs: [],
       options: [],
       keys: ['blog_url'],
@@ -398,6 +421,18 @@ export default {
     next()
   },
   methods: {
+    handlerPhotoUploadSuccess(response, file) {
+      var callData = response.data.data
+      var photo = {
+        name: callData.name,
+        url: callData.path,
+        thumbnail: callData.thumbPath,
+        suffix: callData.suffix,
+        width: callData.width,
+        height: callData.height
+      }
+      this.journalPhotos.push(photo)
+    },
     loadOptions() {
       optionApi.listAll(this.keys).then(response => {
         this.options = response.data.data
@@ -426,11 +461,20 @@ export default {
       this.$router.push({ name: 'PostEdit', query: { postId: post.id } })
     },
     handleCreateJournalClick() {
+      // 给属性填充数据
+      this.journal.photos = this.journalPhotos
+
       journalApi.create(this.journal).then(response => {
         this.$message.success('发表成功！')
         this.journal = {}
+        this.photoList = []
+        this.showMoreOptions = false
       })
     },
+    handleUploadPhotoWallClick() {
+      // 是否显示上传照片墙组件
+      this.showMoreOptions = !this.showMoreOptions
+    },
     handleShowLogDrawer() {
       this.logDrawerVisiable = true
       this.loadLogs()
@@ -458,3 +502,10 @@ export default {
   }
 }
 </script>
+
+<style scoped="scoped">
+	.more-options-btn{
+		margin-left: 15px;
+		text-decoration: none;
+	}
+</style>
diff --git a/src/views/sheet/internal/JournalList.vue b/src/views/sheet/internal/JournalList.vue
index 5bcfa814..fb89bac0 100644
--- a/src/views/sheet/internal/JournalList.vue
+++ b/src/views/sheet/internal/JournalList.vue
@@ -6,18 +6,12 @@
           <div class="table-page-search-wrapper">
             <a-form layout="inline">
               <a-row :gutter="48">
-                <a-col
-                  :md="6"
-                  :sm="24"
-                >
+                <a-col :md="6" :sm="24">
                   <a-form-item label="关键词">
-                    <a-input v-model="queryParam.keyword" />
+                    <a-input v-model="queryParam.keyword"/>
                   </a-form-item>
                 </a-col>
-                <a-col
-                  :md="6"
-                  :sm="24"
-                >
+                <a-col :md="6" :sm="24">
                   <a-form-item label="状态">
                     <a-select placeholder="请选择状态">
                       <a-select-option value="1">公开</a-select-option>
@@ -25,32 +19,19 @@
                     </a-select>
                   </a-form-item>
                 </a-col>
-                <a-col
-                  :md="6"
-                  :sm="24"
-                >
+                <a-col :md="6" :sm="24">
                   <span class="table-page-search-submitButtons">
-                    <a-button
-                      type="primary"
-                      @click="loadJournals(true)"
-                    >查询</a-button>
-                    <a-button
-                      style="margin-left: 8px;"
-                      @click="resetParam"
-                    >重置</a-button>
+                    <a-button type="primary" @click="loadJournals(true)">查询</a-button>
+                    <a-button style="margin-left: 8px;" @click="resetParam">重置</a-button>
                   </span>
                 </a-col>
               </a-row>
             </a-form>
           </div>
           <div class="table-operator">
-            <a-button
-              type="primary"
-              icon="plus"
-              @click="handleNew"
-            >写日志</a-button>
+            <a-button type="primary" icon="plus" @click="handleNew">写日志</a-button>
           </div>
-          <a-divider />
+          <a-divider/>
           <div style="margin-top:15px">
             <a-list
               itemLayout="vertical"
@@ -58,42 +39,46 @@
               :dataSource="journals"
               :loading="listLoading"
             >
-              <a-list-item
-                slot="renderItem"
-                slot-scope="item, index"
-                :key="index"
-              >
+              <a-list-item slot="renderItem" slot-scope="item, index" :key="index">
+                <!-- 日志图片集合 -->
+                <a-card
+                  hoverable
+                  v-for="(photo, photoIndex) in item.photos"
+                  :key="photoIndex"
+                  class="photo-card"
+                  @click="handlerPhotoPreview(photo)"
+                >
+                  <img alt="example" :src="photo.thumbnail" slot="cover">
+                </a-card>
+
+                <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancelPreview">
+                  <img
+                    :alt="previewPhoto.name + previewPhoto.description"
+                    style="width: 100%"
+                    :src="previewPhoto.url"
+                  >
+                </a-modal>
+
                 <template slot="actions">
                   <span>
                     <a href="javascript:void(0);">
-                      <a-icon
-                        type="like-o"
-                        style="margin-right: 8px"
-                      />{{ item.likes }}
+                      <a-icon type="like-o" style="margin-right: 8px"/>
+                      {{ item.likes }}
                     </a>
                   </span>
                   <span>
-                    <a
-                      href="javascript:void(0);"
-                      @click="handleCommentShow(item)"
-                    >
-
-                      <a-icon
-                        type="message"
-                        style="margin-right: 8px"
-                      />{{ item.commentCount }}
+                    <a href="javascript:void(0);" @click="handleCommentShow(item)">
+                      <a-icon type="message" style="margin-right: 8px"/>
+                      {{ item.commentCount }}
                     </a>
                   </span>
                   <!-- <span>
                     From 微信
-                  </span> -->
+                  </span>-->
                 </template>
                 <template slot="extra">
-                  <a
-                    href="javascript:void(0);"
-                    @click="handleEdit(item)"
-                  >编辑</a>
-                  <a-divider type="vertical" />
+                  <a href="javascript:void(0);" @click="handleEdit(item)">编辑</a>
+                  <a-divider type="vertical"/>
                   <a-popconfirm
                     title="你确定要删除这条日志？"
                     @confirm="handleDelete(item.id)"
@@ -103,13 +88,10 @@
                     <a href="javascript:void(0);">删除</a>
                   </a-popconfirm>
                 </template>
+
                 <a-list-item-meta :description="item.content">
                   <span slot="title">{{ item.createTime | moment }}</span>
-                  <a-avatar
-                    slot="avatar"
-                    size="large"
-                    :src="user.avatar"
-                  />
+                  <a-avatar slot="avatar" size="large" :src="user.avatar"/>
                 </a-list-item-meta>
               </a-list-item>
               <div class="page-wrapper">
@@ -132,29 +114,35 @@
     <!-- 编辑日志弹窗 -->
     <a-modal v-model="visible">
       <template slot="title">
-        {{ title }} <a-tooltip
-          slot="action"
-          title="只能输入250字"
-        >
-          <a-icon type="info-circle-o" />
+        {{ title }}
+        <a-tooltip slot="action" title="只能输入250字">
+          <a-icon type="info-circle-o"/>
         </a-tooltip>
       </template>
       <template slot="footer">
-        <a-button
-          key="submit"
-          type="primary"
-          @click="createOrUpdateJournal"
-        >
-          发布
-        </a-button>
+        <a-button key="submit" type="primary" @click="createOrUpdateJournal">发布</a-button>
       </template>
       <a-form layout="vertical">
         <a-form-item>
-          <a-input
-            type="textarea"
-            :autosize="{ minRows: 8 }"
-            v-model="journal.content"
-          />
+          <a-input type="textarea" :autosize="{ minRows: 8 }" v-model="journal.content"/>
+        </a-form-item>
+        <a-form-item v-show="showMoreOptions">
+          <UploadPhoto
+            @success="handlerPhotoUploadSuccess"
+            :photoList="photoList"
+            :plusPhotoVisible="plusPhotoVisible"
+          ></UploadPhoto>
+        </a-form-item>
+        <a-form-item>
+          <a
+            href="javascript:;"
+            class="more-options-btn"
+            type="default"
+            @click="handleUploadPhotoWallClick"
+          >
+            更多选项
+            <a-icon type="down"/>
+          </a>
         </a-form-item>
       </a-form>
     </a-modal>
@@ -166,21 +154,11 @@
       v-model="selectCommentVisible"
     >
       <template slot="footer">
-        <a-button
-          key="submit"
-          type="primary"
-          @click="handleReplyComment"
-        >
-          回复
-        </a-button>
+        <a-button key="submit" type="primary" @click="handleReplyComment">回复</a-button>
       </template>
       <a-form layout="vertical">
         <a-form-item>
-          <a-input
-            type="textarea"
-            :autosize="{ minRows: 8 }"
-            v-model="replyComment.content"
-          />
+          <a-input type="textarea" :autosize="{ minRows: 8 }" v-model="replyComment.content"/>
         </a-form-item>
       </a-form>
     </a-modal>
@@ -194,23 +172,16 @@
       destroyOnClose
       @close="()=>this.commentVisiable = false"
     >
-      <a-row
-        type="flex"
-        align="middle"
-      >
+      <a-row type="flex" align="middle">
         <a-col :span="24">
           <a-comment>
-            <a-avatar
-              :src="user.avatar"
-              :alt="user.nickname"
-              slot="avatar"
-            />
+            <a-avatar :src="user.avatar" :alt="user.nickname" slot="avatar"/>
             <p slot="content">{{ journal.content }}</p>
 
             <span slot="datetime">{{ journal.createTime | moment }}</span>
           </a-comment>
         </a-col>
-        <a-divider />
+        <a-divider/>
         <a-col :span="24">
           <journal-comment-tree
             v-for="(comment,index) in comments"
@@ -231,12 +202,22 @@ import { mixin, mixinDevice } from '@/utils/mixin.js'
 import journalApi from '@/api/journal'
 import journalCommentApi from '@/api/journalComment'
 import userApi from '@/api/user'
-
+import UploadPhoto from '@/components/Upload/UploadPhoto.vue'
 export default {
   mixins: [mixin, mixinDevice],
-  components: { JournalCommentTree },
+  components: { JournalCommentTree, UploadPhoto },
   data() {
     return {
+      plusPhotoVisible: true,
+      photoList: [], // 编辑图片时回显所需对象
+      previewVisible: false,
+      showMoreOptions: false,
+      previewPhoto: {
+        // 图片预览信息临时对象
+        name: '',
+        description: '',
+        url: ''
+      },
       title: '发表',
       listLoading: false,
       visible: false,
@@ -255,7 +236,12 @@ export default {
       },
       journals: [],
       comments: [],
-      journal: {},
+      journal: {
+        id: undefined,
+        content: '',
+        photos: []
+      },
+      journalPhotos: [], // 日志图片集合最多九张
       selectComment: null,
       replyComment: {},
       user: {}
@@ -266,6 +252,30 @@ export default {
     this.loadUser()
   },
   methods: {
+    handleCancelPreview() {
+      this.previewVisible = false
+    },
+    handlerPhotoPreview(photo) {
+      // 日志图片预览
+      this.previewVisible = true
+      this.previewPhoto = photo
+    },
+    handlerPhotoUploadSuccess(response, file) {
+      var callData = response.data.data
+      var photo = {
+        name: callData.name,
+        url: callData.path,
+        thumbnail: callData.thumbPath,
+        suffix: callData.suffix,
+        width: callData.width,
+        height: callData.height
+      }
+      this.journalPhotos.push(photo)
+    },
+    handleUploadPhotoWallClick() {
+      // 是否显示上传照片墙组件
+      this.showMoreOptions = !this.showMoreOptions
+    },
     loadJournals(isSearch) {
       this.queryParam.page = this.pagination.page - 1
       this.queryParam.size = this.pagination.size
@@ -289,11 +299,19 @@ export default {
       this.title = '新建'
       this.visible = true
       this.journal = {}
+
+      // 显示图片上传框
+      this.plusPhotoVisible = true
+      this.photoList = []
     },
     handleEdit(item) {
       this.title = '编辑'
       this.journal = item
       this.visible = true
+
+      // 为编辑时需要回显图片数组赋值,并隐藏图片上传框
+      this.plusPhotoVisible = false
+      this.photoList = item.photos
     },
     handleDelete(id) {
       journalApi.delete(id).then(response => {
@@ -330,6 +348,9 @@ export default {
       })
     },
     createOrUpdateJournal() {
+      // 给属性填充数据
+      this.journal.photos = this.journalPhotos
+
       if (this.journal.id) {
         journalApi.update(this.journal.id, this.journal).then(response => {
           this.$message.success('更新成功！')
@@ -339,6 +360,7 @@ export default {
         journalApi.create(this.journal).then(response => {
           this.$message.success('发表成功！')
           this.loadJournals()
+          this.photoList = []
         })
       }
       this.visible = false
@@ -356,3 +378,16 @@ export default {
   }
 }
 </script>
+<style scoped="scoped">
+.more-options-btn {
+  margin-left: 15px;
+  text-decoration: none;
+}
+
+/* 日志图片卡片样式 */
+.photo-card {
+  width: 104px;
+  display: inline-block;
+  margin-right: 5px;
+}
+</style>

From f2817971c43685503b6058b9cde2e2621284b345 Mon Sep 17 00:00:00 2001
From: johnniang <johnniang@riseup.net>
Date: Sat, 29 Jun 2019 00:45:04 +0800
Subject: [PATCH 2/3] Enable api base url modification

---
 package-lock.json           | 293 +++++++++++++++++++++++++++++++-----
 src/core/bootstrap.js       |   4 +-
 src/store/getters.js        |   8 +-
 src/store/modules/app.js    |  16 +-
 src/store/mutation-types.js |   1 +
 src/utils/service.js        |   2 +-
 src/views/user/Login.vue    |  65 +++++++-
 7 files changed, 339 insertions(+), 50 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 0898b880..0ca2d5ad 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "halo-admin",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -1983,7 +1983,7 @@
       "dependencies": {
         "ajv": {
           "version": "5.5.2",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.2.tgz",
+          "resolved": "http://registry.npm.taobao.org/ajv/download/ajv-5.5.2.tgz?cache=0&other_urls=http%3A%2F%2Fregistry.npm.taobao.org%2Fajv%2Fdownload%2Fajv-5.5.2.tgz",
           "integrity": "sha1-c7Xuyj+rZT49P5Qis0GtQiBdyWU=",
           "dev": true,
           "optional": true,
@@ -1996,7 +1996,7 @@
         },
         "ansi-regex": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/ansi-regex/download/ansi-regex-3.0.0.tgz",
           "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
           "dev": true,
           "optional": true
@@ -2025,7 +2025,7 @@
         },
         "cross-spawn": {
           "version": "5.1.0",
-          "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/cross-spawn/download/cross-spawn-5.1.0.tgz",
           "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk=",
           "dev": true,
           "optional": true,
@@ -2105,14 +2105,14 @@
         },
         "fast-deep-equal": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.1.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/fast-deep-equal/download/fast-deep-equal-1.1.0.tgz",
           "integrity": "sha1-wFNHeBfIa1HaqFPIHgWbcz0CNhQ=",
           "dev": true,
           "optional": true
         },
         "json-schema-traverse": {
           "version": "0.3.1",
-          "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.3.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/json-schema-traverse/download/json-schema-traverse-0.3.1.tgz",
           "integrity": "sha1-NJptRMU6Ud6JtAgFxdXlm0F9M0A=",
           "dev": true,
           "optional": true
@@ -2130,7 +2130,7 @@
         },
         "strip-ansi": {
           "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/strip-ansi/download/strip-ansi-4.0.0.tgz",
           "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
           "dev": true,
           "optional": true,
@@ -2150,7 +2150,7 @@
         },
         "yallist": {
           "version": "2.1.2",
-          "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
+          "resolved": "http://registry.npm.taobao.org/yallist/download/yallist-2.1.2.tgz",
           "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI=",
           "dev": true,
           "optional": true
@@ -2788,6 +2788,14 @@
       "integrity": "sha512-4diPfzWbLEIElVG4AnqP+00SULlPzNuyJFNnmMrLgyaxG6tZXJ1sn7mjBu4fHrJE+Yp/jgylOweJn2xsLMFggQ==",
       "dev": true
     },
+    "aes-decrypter": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/aes-decrypter/-/aes-decrypter-1.0.3.tgz",
+      "integrity": "sha1-nAa4pUNaWtCduTP4oBSvzxhMw04=",
+      "requires": {
+        "pkcs7": "^0.2.3"
+      }
+    },
     "ajv": {
       "version": "6.10.0",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.10.0.tgz",
@@ -2926,7 +2934,7 @@
       "dependencies": {
         "normalize-path": {
           "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/normalize-path/download/normalize-path-2.1.1.tgz",
           "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=",
           "dev": true,
           "requires": {
@@ -3094,13 +3102,13 @@
       "dependencies": {
         "inherits": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/inherits/download/inherits-2.0.1.tgz",
           "integrity": "sha1-sX0I0ya0Qj5Wjv9xn5GwscvfafE=",
           "dev": true
         },
         "util": {
           "version": "0.10.3",
-          "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
+          "resolved": "http://registry.npm.taobao.org/util/download/util-0.10.3.tgz",
           "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
           "dev": true,
           "requires": {
@@ -3276,7 +3284,7 @@
       "dependencies": {
         "eslint-scope": {
           "version": "3.7.1",
-          "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-3.7.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/eslint-scope/download/eslint-scope-3.7.1.tgz",
           "integrity": "sha1-PWPD7f2gLgbgGkUq2IyqzHzctug=",
           "dev": true,
           "requires": {
@@ -3843,7 +3851,7 @@
       "dependencies": {
         "define-property": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/define-property/download/define-property-1.0.0.tgz",
           "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
           "dev": true,
           "requires": {
@@ -4036,7 +4044,7 @@
       "dependencies": {
         "extend-shallow": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/extend-shallow/download/extend-shallow-2.0.1.tgz",
           "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
           "dev": true,
           "requires": {
@@ -4471,7 +4479,7 @@
       "dependencies": {
         "define-property": {
           "version": "0.2.5",
-          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "resolved": "http://registry.npm.taobao.org/define-property/download/define-property-0.2.5.tgz",
           "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
           "dev": true,
           "requires": {
@@ -6133,6 +6141,11 @@
         "entities": "^1.1.1"
       }
     },
+    "dom-walk": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/dom-walk/-/dom-walk-0.1.1.tgz",
+      "integrity": "sha1-ZyIm3HTI95mtNTB9+TaroRrNYBg="
+    },
     "domain-browser": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.2.0.tgz",
@@ -6390,6 +6403,11 @@
         "is-symbol": "^1.0.2"
       }
     },
+    "es5-shim": {
+      "version": "4.5.13",
+      "resolved": "https://registry.npmjs.org/es5-shim/-/es5-shim-4.5.13.tgz",
+      "integrity": "sha512-xi6hh6gsvDE0MaW4Vp1lgNEBpVcCXRWfPXj5egDvtgLz4L9MEvNwYEMdJH+JJinWkwa8c3c3o5HduV7dB/e1Hw=="
+    },
     "es6-object-assign": {
       "version": "1.1.0",
       "resolved": "http://registry.npm.taobao.org/es6-object-assign/download/es6-object-assign-1.1.0.tgz",
@@ -6661,7 +6679,7 @@
         },
         "strip-ansi": {
           "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/strip-ansi/download/strip-ansi-4.0.0.tgz",
           "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
           "dev": true,
           "requires": {
@@ -6670,7 +6688,7 @@
           "dependencies": {
             "ansi-regex": {
               "version": "3.0.0",
-              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+              "resolved": "http://registry.npm.taobao.org/ansi-regex/download/ansi-regex-3.0.0.tgz",
               "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
               "dev": true
             }
@@ -7392,7 +7410,7 @@
       "dependencies": {
         "define-property": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/define-property/download/define-property-1.0.0.tgz",
           "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
           "dev": true,
           "requires": {
@@ -7401,7 +7419,7 @@
         },
         "extend-shallow": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/extend-shallow/download/extend-shallow-2.0.1.tgz",
           "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
           "dev": true,
           "requires": {
@@ -8498,6 +8516,22 @@
       "integrity": "sha1-jFoUlNIGbFcMw7/kSWF1rMTVAqs=",
       "dev": true
     },
+    "global": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/global/-/global-4.3.2.tgz",
+      "integrity": "sha1-52mJJopsdMOJCLEwWxD8DjlOnQ8=",
+      "requires": {
+        "min-document": "^2.19.0",
+        "process": "~0.5.1"
+      },
+      "dependencies": {
+        "process": {
+          "version": "0.5.2",
+          "resolved": "https://registry.npmjs.org/process/-/process-0.5.2.tgz",
+          "integrity": "sha1-FjjYqONML0QKkduVq5rrZ3/Bhc8="
+        }
+      }
+    },
     "globals": {
       "version": "11.12.0",
       "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz",
@@ -9177,6 +9211,11 @@
       "integrity": "sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10=",
       "dev": true
     },
+    "individual": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/individual/-/individual-2.0.0.tgz",
+      "integrity": "sha1-gzsJfa0jKU52EXqY+zjg2a1hu5c="
+    },
     "inflight": {
       "version": "1.0.6",
       "resolved": "http://registry.npm.taobao.org/inflight/download/inflight-1.0.6.tgz",
@@ -9222,7 +9261,7 @@
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/ansi-regex/download/ansi-regex-3.0.0.tgz",
           "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
           "dev": true,
           "optional": true
@@ -9251,7 +9290,7 @@
         },
         "strip-ansi": {
           "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/strip-ansi/download/strip-ansi-4.0.0.tgz",
           "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
           "dev": true,
           "optional": true,
@@ -9463,6 +9502,11 @@
       "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
       "dev": true
     },
+    "is-function": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-function/-/is-function-1.0.1.tgz",
+      "integrity": "sha1-Es+5i2W1fdPRk6MSH19uL0N2ArU="
+    },
     "is-generator-fn": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/is-generator-fn/-/is-generator-fn-1.0.0.tgz",
@@ -11720,7 +11764,7 @@
       "dependencies": {
         "find-cache-dir": {
           "version": "0.1.1",
-          "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-0.1.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/find-cache-dir/download/find-cache-dir-0.1.1.tgz",
           "integrity": "sha1-yN765XyKUqinhPnjHFfHQumToLk=",
           "dev": true,
           "requires": {
@@ -11731,7 +11775,7 @@
         },
         "find-up": {
           "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+          "resolved": "http://registry.npm.taobao.org/find-up/download/find-up-1.1.2.tgz",
           "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
           "dev": true,
           "requires": {
@@ -11741,7 +11785,7 @@
         },
         "path-exists": {
           "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/path-exists/download/path-exists-2.1.0.tgz",
           "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
           "dev": true,
           "requires": {
@@ -11750,7 +11794,7 @@
         },
         "pkg-dir": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-1.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/pkg-dir/download/pkg-dir-1.0.0.tgz",
           "integrity": "sha1-ektQio1bstYp1EcFb/TpyTFM89Q=",
           "dev": true,
           "requires": {
@@ -11918,6 +11962,11 @@
         "yallist": "^3.0.2"
       }
     },
+    "m3u8-parser": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/m3u8-parser/-/m3u8-parser-2.1.0.tgz",
+      "integrity": "sha1-yBcDKewc1RXQ1Yu4t2LamJbLA2g="
+    },
     "make-dir": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
@@ -12139,6 +12188,14 @@
       "integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ==",
       "dev": true
     },
+    "min-document": {
+      "version": "2.19.0",
+      "resolved": "https://registry.npmjs.org/min-document/-/min-document-2.19.0.tgz",
+      "integrity": "sha1-e9KC4/WELtKVu3SM3Z8f+iyCRoU=",
+      "requires": {
+        "dom-walk": "^0.1.0"
+      }
+    },
     "mini-css-extract-plugin": {
       "version": "0.6.0",
       "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.6.0.tgz",
@@ -12307,6 +12364,11 @@
       "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=",
       "dev": true
     },
+    "mux.js": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/mux.js/-/mux.js-4.3.2.tgz",
+      "integrity": "sha512-g0q6DPdvb3yYcoK7ElBGobdSSrhY/RjPt19U7uUc733aqvc5bCS/aCvL9z+448y+IoCZnYDwyZfQBBXMSmGOaQ=="
+    },
     "mz": {
       "version": "2.7.0",
       "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz",
@@ -12459,7 +12521,7 @@
       "dependencies": {
         "punycode": {
           "version": "1.4.1",
-          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/punycode/download/punycode-1.4.1.tgz",
           "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
           "dev": true
         }
@@ -13081,6 +13143,15 @@
         }
       }
     },
+    "parse-headers": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/parse-headers/-/parse-headers-2.0.2.tgz",
+      "integrity": "sha512-/LypJhzFmyBIDYP9aDVgeyEb5sQfbfY5mnDq4hVhlQ69js87wXfmEI5V3xI6vvXasqebp0oCytYFLxsBVfCzSg==",
+      "requires": {
+        "for-each": "^0.3.3",
+        "string.prototype.trim": "^1.1.2"
+      }
+    },
     "parse-json": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
@@ -13165,7 +13236,7 @@
       "dependencies": {
         "pify": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/pify/download/pify-3.0.0.tgz",
           "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=",
           "dev": true
         }
@@ -13210,6 +13281,11 @@
         "pinkie": "^2.0.0"
       }
     },
+    "pkcs7": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/pkcs7/-/pkcs7-0.2.3.tgz",
+      "integrity": "sha1-ItYGZtAQZcXyRDkJjkpIMEUic74="
+    },
     "pkg-dir": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-3.0.0.tgz",
@@ -14533,7 +14609,7 @@
       "dependencies": {
         "jsesc": {
           "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/jsesc/download/jsesc-0.5.0.tgz",
           "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0=",
           "dev": true
         }
@@ -14837,6 +14913,14 @@
         "aproba": "^1.1.1"
       }
     },
+    "rust-result": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/rust-result/-/rust-result-1.0.0.tgz",
+      "integrity": "sha1-NMdbLm3Dn+WHXlveyFteD5FTb3I=",
+      "requires": {
+        "individual": "^2.0.0"
+      }
+    },
     "rw": {
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/rw/-/rw-1.3.3.tgz",
@@ -14874,6 +14958,14 @@
       "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
       "dev": true
     },
+    "safe-json-parse": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/safe-json-parse/-/safe-json-parse-4.0.0.tgz",
+      "integrity": "sha1-fA9XjPzNEtM6ccDgVBPi7KFx6qw=",
+      "requires": {
+        "rust-result": "^1.0.0"
+      }
+    },
     "safe-regex": {
       "version": "1.1.0",
       "resolved": "http://registry.npm.taobao.org/safe-regex/download/safe-regex-1.1.0.tgz",
@@ -15082,7 +15174,7 @@
       "dependencies": {
         "extend-shallow": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/extend-shallow/download/extend-shallow-2.0.1.tgz",
           "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
           "dev": true,
           "requires": {
@@ -15234,7 +15326,7 @@
         },
         "define-property": {
           "version": "0.2.5",
-          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "resolved": "http://registry.npm.taobao.org/define-property/download/define-property-0.2.5.tgz",
           "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
           "dev": true,
           "requires": {
@@ -15243,7 +15335,7 @@
         },
         "extend-shallow": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/extend-shallow/download/extend-shallow-2.0.1.tgz",
           "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
           "dev": true,
           "requires": {
@@ -15271,7 +15363,7 @@
       "dependencies": {
         "define-property": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/define-property/download/define-property-1.0.0.tgz",
           "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
           "dev": true,
           "requires": {
@@ -15709,13 +15801,13 @@
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/ansi-regex/download/ansi-regex-3.0.0.tgz",
           "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
           "dev": true
         },
         "strip-ansi": {
           "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/strip-ansi/download/strip-ansi-4.0.0.tgz",
           "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
           "dev": true,
           "requires": {
@@ -15911,7 +16003,7 @@
       "dependencies": {
         "ajv": {
           "version": "5.5.2",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.2.tgz",
+          "resolved": "http://registry.npm.taobao.org/ajv/download/ajv-5.5.2.tgz?cache=0&other_urls=http%3A%2F%2Fregistry.npm.taobao.org%2Fajv%2Fdownload%2Fajv-5.5.2.tgz",
           "integrity": "sha1-c7Xuyj+rZT49P5Qis0GtQiBdyWU=",
           "dev": true,
           "optional": true,
@@ -15924,7 +16016,7 @@
         },
         "ajv-keywords": {
           "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-2.1.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/ajv-keywords/download/ajv-keywords-2.1.1.tgz",
           "integrity": "sha1-YXmX/F9gV2iUxDX5QNgZ4TW4B2I=",
           "dev": true,
           "optional": true
@@ -15953,14 +16045,14 @@
         },
         "fast-deep-equal": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.1.0.tgz",
+          "resolved": "http://registry.npm.taobao.org/fast-deep-equal/download/fast-deep-equal-1.1.0.tgz",
           "integrity": "sha1-wFNHeBfIa1HaqFPIHgWbcz0CNhQ=",
           "dev": true,
           "optional": true
         },
         "json-schema-traverse": {
           "version": "0.3.1",
-          "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.3.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/json-schema-traverse/download/json-schema-traverse-0.3.1.tgz",
           "integrity": "sha1-NJptRMU6Ud6JtAgFxdXlm0F9M0A=",
           "dev": true,
           "optional": true
@@ -16342,7 +16434,7 @@
       "dependencies": {
         "punycode": {
           "version": "1.4.1",
-          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+          "resolved": "http://registry.npm.taobao.org/punycode/download/punycode-1.4.1.tgz",
           "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
           "dev": true
         }
@@ -16395,6 +16487,11 @@
       "integrity": "sha512-4krF8scpejhaOgqzBEcGM7yDIEfi0/8+8zDRZhNZZ2kjmHJ4hv3zCbQWxoJGz1iw5U0Jl0nma13xzHXcncMavQ==",
       "dev": true
     },
+    "tsml": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/tsml/-/tsml-1.0.1.tgz",
+      "integrity": "sha1-ifghi52eJX9H1/a1bQHFpNLGj8M="
+    },
     "tty-browserify": {
       "version": "0.0.0",
       "resolved": "http://registry.npm.taobao.org/tty-browserify/download/tty-browserify-0.0.0.tgz",
@@ -16700,6 +16797,11 @@
         "requires-port": "^1.0.0"
       }
     },
+    "url-toolkit": {
+      "version": "2.1.6",
+      "resolved": "https://registry.npmjs.org/url-toolkit/-/url-toolkit-2.1.6.tgz",
+      "integrity": "sha512-UaZ2+50am4HwrV2crR/JAf63Q4VvPYphe63WGeoJxeu8gmOm0qxPt+KsukfakPNrX9aymGNEkkaoICwn+OuvBw=="
+    },
     "use": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz",
@@ -16792,6 +16894,88 @@
         "extsprintf": "^1.2.0"
       }
     },
+    "video.js": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/video.js/-/video.js-6.13.0.tgz",
+      "integrity": "sha512-36/JR/GhPQSZj0o+GNbhcEYv/b0SkV9SQsjlodAnzMQYN0TA7VhmqrKPYMCi1NGRYu7S9W3OaFCFoUxkYfSVlg==",
+      "requires": {
+        "babel-runtime": "^6.9.2",
+        "global": "4.3.2",
+        "safe-json-parse": "4.0.0",
+        "tsml": "1.0.1",
+        "videojs-font": "2.1.0",
+        "videojs-ie8": "1.1.2",
+        "videojs-vtt.js": "0.12.6",
+        "xhr": "2.4.0"
+      }
+    },
+    "videojs-contrib-hls": {
+      "version": "5.15.0",
+      "resolved": "https://registry.npmjs.org/videojs-contrib-hls/-/videojs-contrib-hls-5.15.0.tgz",
+      "integrity": "sha512-18zbMYZ0XRBKTPEayA9bFTWWrqhT9b4G8+zf0czJLD7Epe5PcK1I/3dflTHQeQ5rwlWir+/XnFU3sMg/B2MMcw==",
+      "requires": {
+        "aes-decrypter": "1.0.3",
+        "global": "^4.3.0",
+        "m3u8-parser": "2.1.0",
+        "mux.js": "4.3.2",
+        "url-toolkit": "^2.1.3",
+        "video.js": "^5.19.1 || ^6.2.0",
+        "videojs-contrib-media-sources": "4.7.2",
+        "webwackify": "0.1.6"
+      }
+    },
+    "videojs-contrib-media-sources": {
+      "version": "4.7.2",
+      "resolved": "https://registry.npmjs.org/videojs-contrib-media-sources/-/videojs-contrib-media-sources-4.7.2.tgz",
+      "integrity": "sha512-e6iCHWBFuV05EGo7v+pS9iepObXnJ9joms467gzi8ZjpKVb3ifha9M0Ja24Rd8JfvYpzjltsgDVtGFDvIg4hQQ==",
+      "requires": {
+        "global": "^4.3.0",
+        "mux.js": "4.3.2",
+        "video.js": "^5.17.0 || ^6.2.0",
+        "webwackify": "0.1.6"
+      }
+    },
+    "videojs-flash": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/videojs-flash/-/videojs-flash-2.2.0.tgz",
+      "integrity": "sha512-V+7MOQGx6t6y260GvCyNL3AlMKRy7H/BEtEqgOjeAqguBgeb+GUOmnczOyzXmHF4VyaoRS4ZDT3Qz2gF596j5w==",
+      "requires": {
+        "global": "^4.3.2",
+        "video.js": "^6 || ^7",
+        "videojs-swf": "5.4.2"
+      }
+    },
+    "videojs-font": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/videojs-font/-/videojs-font-2.1.0.tgz",
+      "integrity": "sha1-olkwpn9snPvyu4jay4xrRR8JM3k="
+    },
+    "videojs-hotkeys": {
+      "version": "0.2.25",
+      "resolved": "https://registry.npmjs.org/videojs-hotkeys/-/videojs-hotkeys-0.2.25.tgz",
+      "integrity": "sha512-XgMjWiqGlmAjuHtpP529A2voVh++z46FSD0XeSy+65yeuTZOd+w2CJmfrL4jPpGm+MME5l9lOLfVpoEeDaBa1Q=="
+    },
+    "videojs-ie8": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/videojs-ie8/-/videojs-ie8-1.1.2.tgz",
+      "integrity": "sha1-oj09hgitcZK2nGB3/E64SJmNNdk=",
+      "requires": {
+        "es5-shim": "^4.5.1"
+      }
+    },
+    "videojs-swf": {
+      "version": "5.4.2",
+      "resolved": "https://registry.npmjs.org/videojs-swf/-/videojs-swf-5.4.2.tgz",
+      "integrity": "sha512-FGg+Csioa8/A/EacvFefBdb9Z0rSiMlheHDunZnN3xXfUF43jvjawcWFQnZvrv1Cs1nE1LBrHyUZjF7j2mKOLw=="
+    },
+    "videojs-vtt.js": {
+      "version": "0.12.6",
+      "resolved": "https://registry.npmjs.org/videojs-vtt.js/-/videojs-vtt.js-0.12.6.tgz",
+      "integrity": "sha512-XFXeGBQiljnElMhwCcZst0RDbZn2n8LU7ZScXryd3a00OaZsHAjdZu/7/RdSr7Z1jHphd45FnOvOQkGK4YrWCQ==",
+      "requires": {
+        "global": "^4.3.1"
+      }
+    },
     "viser": {
       "version": "2.4.6",
       "resolved": "https://registry.npmjs.org/viser/-/viser-2.4.6.tgz",
@@ -17056,6 +17240,18 @@
       "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
       "dev": true
     },
+    "vue-video-player": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/vue-video-player/-/vue-video-player-5.0.2.tgz",
+      "integrity": "sha512-IZXeRGGSX4YIp54G0Q5cB7iqh6Ok6Dpa2jRkjdyvMWw7MShJuh54/d5QNb1CZ+CvZUzX/TH7osnpir7mBNcFvQ==",
+      "requires": {
+        "object-assign": "^4.1.1",
+        "video.js": "^6.6.0",
+        "videojs-contrib-hls": "^5.12.2",
+        "videojs-flash": "^2.1.0",
+        "videojs-hotkeys": "^0.2.20"
+      }
+    },
     "vuejs-logger": {
       "version": "1.5.3",
       "resolved": "https://registry.npmjs.org/vuejs-logger/-/vuejs-logger-1.5.3.tgz",
@@ -17555,6 +17751,11 @@
       "integrity": "sha512-nqHUnMXmBzT0w570r2JpJxfiSD1IzoI+HGVdd3aZ0yNi3ngvQ4jv1dtHt5VGxfI2yj5yqImPhOK4vmIh2xMbGg==",
       "dev": true
     },
+    "webwackify": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/webwackify/-/webwackify-0.1.6.tgz",
+      "integrity": "sha512-pGcw1T3HpNnM/UTRQqqRkkkzythSLts05mB+7Gr00B+0VbL0m39dFL5g20rSIEUt9Wrpw+/8k+snxRlUFHhcqA=="
+    },
     "whatwg-encoding": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-1.0.5.tgz",
@@ -17687,6 +17888,17 @@
         "async-limiter": "~1.0.0"
       }
     },
+    "xhr": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/xhr/-/xhr-2.4.0.tgz",
+      "integrity": "sha1-4W5mpF+GmGHu76tBbV7/ci3ECZM=",
+      "requires": {
+        "global": "~4.3.0",
+        "is-function": "^1.0.1",
+        "parse-headers": "^2.0.0",
+        "xtend": "^4.0.0"
+      }
+    },
     "xml-name-validator": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-3.0.0.tgz",
@@ -17696,8 +17908,7 @@
     "xtend": {
       "version": "4.0.1",
       "resolved": "http://registry.npm.taobao.org/xtend/download/xtend-4.0.1.tgz",
-      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68=",
-      "dev": true
+      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68="
     },
     "y18n": {
       "version": "4.0.0",
diff --git a/src/core/bootstrap.js b/src/core/bootstrap.js
index 10e743f6..8922e305 100644
--- a/src/core/bootstrap.js
+++ b/src/core/bootstrap.js
@@ -10,7 +10,8 @@ import {
   DEFAULT_FIXED_HEADER_HIDDEN,
   DEFAULT_FIXED_SIDEMENU,
   DEFAULT_CONTENT_WIDTH_TYPE,
-  USER
+  USER,
+  API_URL
 } from '@/store/mutation-types'
 import config from '@/config/defaultSettings'
 
@@ -25,6 +26,7 @@ export default function Initializer() {
   store.commit('TOGGLE_COLOR', Vue.ls.get(DEFAULT_COLOR, config.primaryColor))
   store.commit('SET_TOKEN', Vue.ls.get(ACCESS_TOKEN))
   store.commit('SET_USER', Vue.ls.get(USER))
+  store.commit('SET_API_URL', Vue.ls.get(API_URL))
 
   // last step
 }
diff --git a/src/store/getters.js b/src/store/getters.js
index 5ba11085..a8e1309f 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -7,7 +7,13 @@ const getters = {
   avatar: state => state.user.avatar,
   nickname: state => state.user.name,
   roles: state => state.user.roles,
-  addRouters: state => state.permission.addRouters
+  addRouters: state => state.permission.addRouters,
+  apiUrl: state => {
+    if (state.app.apiUrl) {
+      return state.app.apiUrl
+    }
+    return `${window.location.protocol}\\\\${window.location.host}`
+  }
 }
 
 export default getters
diff --git a/src/store/modules/app.js b/src/store/modules/app.js
index 5aeb7f8a..5804e0a0 100644
--- a/src/store/modules/app.js
+++ b/src/store/modules/app.js
@@ -7,7 +7,8 @@ import {
   DEFAULT_FIXED_HEADER,
   DEFAULT_FIXED_SIDEMENU,
   DEFAULT_FIXED_HEADER_HIDDEN,
-  DEFAULT_CONTENT_WIDTH_TYPE
+  DEFAULT_CONTENT_WIDTH_TYPE,
+  API_URL
 } from '@/store/mutation-types'
 
 const app = {
@@ -20,14 +21,23 @@ const app = {
     fixedHeader: false,
     fixSiderbar: false,
     autoHideHeader: false,
-    color: null
+    color: null,
+    apiUrl: null
   },
   mutations: {
+    SET_API_URL: (state, apiUrl) => {
+      state.apiUrl = apiUrl
+      Vue.ls.set(API_URL, apiUrl)
+    },
+    RESTORE_API_URL: state => {
+      state.apiUrl = null
+      Vue.ls.set(API_URL, null)
+    },
     SET_SIDEBAR_TYPE: (state, type) => {
       state.sidebar = type
       Vue.ls.set(SIDEBAR_TYPE, type)
     },
-    CLOSE_SIDEBAR: (state) => {
+    CLOSE_SIDEBAR: state => {
       Vue.ls.set(SIDEBAR_TYPE, true)
       state.sidebar = false
     },
diff --git a/src/store/mutation-types.js b/src/store/mutation-types.js
index 9db404fb..75f5cc7c 100644
--- a/src/store/mutation-types.js
+++ b/src/store/mutation-types.js
@@ -8,6 +8,7 @@ export const DEFAULT_FIXED_SIDEMENU = 'DEFAULT_FIXED_SIDEMENU'
 export const DEFAULT_FIXED_HEADER_HIDDEN = 'DEFAULT_FIXED_HEADER_HIDDEN'
 export const DEFAULT_CONTENT_WIDTH_TYPE = 'DEFAULT_CONTENT_WIDTH_TYPE'
 export const USER = 'USER'
+export const API_URL = 'API_URL'
 
 export const CONTENT_WIDTH_TYPE = {
   Fluid: 'Fluid',
diff --git a/src/utils/service.js b/src/utils/service.js
index a9c69246..135e5e39 100644
--- a/src/utils/service.js
+++ b/src/utils/service.js
@@ -8,7 +8,6 @@ import router from '@/router'
 import { isObject } from './util'
 
 const service = axios.create({
-  baseURL: process.env.NODE_ENV === 'production' ? '' : 'http://localhost:8090',
   timeout: 5000,
   withCredentials: true
 })
@@ -63,6 +62,7 @@ function getFieldValidationError(data) {
 
 service.interceptors.request.use(
   config => {
+    config.baseURL = store.getters.apiUrl
     if (!config.mute) {
       NProgress.start()
     }
diff --git a/src/views/user/Login.vue b/src/views/user/Login.vue
index 9dd04683..84f5cd52 100644
--- a/src/views/user/Login.vue
+++ b/src/views/user/Login.vue
@@ -48,23 +48,61 @@
             :style="{'animation-delay': '0.3s'}"
           >登录</a-button>
         </a-row>
+
+        <a-row>
+          <a
+            class="tip"
+            @click="handleApiModifyModalOpen"
+          >
+            > 更改博客 API 地址
+          </a>
+        </a-row>
+
+        <a-modal
+          title="更改博客 API 地址"
+          :visible="apiModifyVisiable"
+          @ok="handleApiModifyOk"
+          @cancel="handleApiModifyCancel"
+        >
+          <a-form>
+            <a-form-item extra="如果 halo-admin 不是独立部署，请不要更改此 url">
+              <a-input v-model="apiUrl"></a-input>
+            </a-form-item>
+
+            <a-form-item>
+              <a-button @click="handleApiUrlRestore">
+                恢复默认
+              </a-button>
+            </a-form-item>
+          </a-form>
+        </a-modal>
       </a-form>
     </div>
   </div>
 </template>
 
 <script>
-import { mapActions } from 'vuex'
+import { mapActions, mapGetters, mapMutations } from 'vuex'
 
 export default {
   data() {
     return {
       username: null,
-      password: null
+      password: null,
+      apiModifyVisiable: false,
+      defaultApiBefore: window.location.protocol + '//',
+      apiUrl: window.location.host
     }
   },
+  computed: {
+    ...mapGetters({ defaultApiUrl: 'apiUrl' })
+  },
   methods: {
     ...mapActions(['login', 'loadUser']),
+    ...mapMutations({
+      setApiUrl: 'SET_API_URL',
+      restoreApiUrl: 'RESTORE_API_URL'
+    }),
     handleLogin() {
       if (!this.username) {
         this.$message.warn('用户名不能为空！')
@@ -89,11 +127,26 @@ export default {
       } else {
         this.$router.replace({ name: 'Dashboard' })
       }
+    },
+    handleApiModifyModalOpen() {
+      this.apiUrl = this.defaultApiUrl
+      this.apiModifyVisiable = true
+    },
+    handleApiModifyOk() {
+      this.setApiUrl(this.apiUrl)
+      this.apiModifyVisiable = false
+    },
+    handleApiModifyCancel() {
+      this.apiModifyVisiable = false
+    },
+    handleApiUrlRestore() {
+      this.restoreApiUrl()
+      this.apiUrl = this.defaultApiUrl
     }
   }
 }
 </script>
-<style>
+<style lang="less">
 body {
   height: 100%;
   background-color: #f5f5f5;
@@ -107,6 +160,12 @@ body {
   width: 320px;
   padding: 16px 32px 32px 32px;
   box-shadow: -4px 7px 46px 2px rgba(0, 0, 0, 0.1);
+  .tip {
+    font-size: 0.6rem;
+    cursor: pointer;
+    margin-top: 1rem;
+    float: right;
+  }
 }
 .loginLogo {
   margin-bottom: 20px;

From 7cbf49e9117477cc58fc7c0b93950bcb8ff36372 Mon Sep 17 00:00:00 2001
From: ruibaby <i@ryanc.cc>
Date: Sat, 29 Jun 2019 12:46:13 +0800
Subject: [PATCH 3/3] Perfect api settings.

---
 src/store/getters.js     |  2 +-
 src/views/user/Login.vue | 12 ++++++------
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/store/getters.js b/src/store/getters.js
index a8e1309f..a7ca8c63 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -12,7 +12,7 @@ const getters = {
     if (state.app.apiUrl) {
       return state.app.apiUrl
     }
-    return `${window.location.protocol}\\\\${window.location.host}`
+    return `${window.location.protocol}//${window.location.host}`
   }
 }
 
diff --git a/src/views/user/Login.vue b/src/views/user/Login.vue
index 84f5cd52..2e620fa7 100644
--- a/src/views/user/Login.vue
+++ b/src/views/user/Login.vue
@@ -51,21 +51,22 @@
 
         <a-row>
           <a
-            class="tip"
             @click="handleApiModifyModalOpen"
+            class="tip animated fadeInUp"
+            :style="{'animation-delay': '0.4s'}"
           >
-            > 更改博客 API 地址
+            API 设置
           </a>
         </a-row>
 
         <a-modal
-          title="更改博客 API 地址"
+          title="API 设置"
           :visible="apiModifyVisiable"
           @ok="handleApiModifyOk"
           @cancel="handleApiModifyCancel"
         >
           <a-form>
-            <a-form-item extra="如果 halo-admin 不是独立部署，请不要更改此 url">
+            <a-form-item extra="如果 halo admin 不是独立部署，请不要更改此 API">
               <a-input v-model="apiUrl"></a-input>
             </a-form-item>
 
@@ -161,9 +162,8 @@ body {
   padding: 16px 32px 32px 32px;
   box-shadow: -4px 7px 46px 2px rgba(0, 0, 0, 0.1);
   .tip {
-    font-size: 0.6rem;
     cursor: pointer;
-    margin-top: 1rem;
+    margin-top: .5rem;
     float: right;
   }
 }