refactor: theme setting page

Signed-off-by: Ryan Wang <[email protected]>

.env.jsdelivr

@@ -1,3 +1,3 @@
 NODE_ENV=production
-PUBLIC_PATH=https://cdn.jsdelivr.net/npm/[email protected].15/dist/
+PUBLIC_PATH=https://cdn.jsdelivr.net/npm/[email protected].13/dist/
 VUE_APP_API_URL=/

.github/auto_assign.yml

@@ -2,7 +2,7 @@
 addReviewers: true
 
 # Set to true to add assignees to pull requests
-addAssignees: false
+addAssignees: true
 
 # A list of reviewers to be added to pull requests (GitHub user name)
 reviewers:
@@ -17,4 +17,4 @@ skipKeywords:
 
 # A number of reviewers added to the pull request
 # Set 0 to add all the reviewers (default: 0)
-numberOfReviewers: 0
+numberOfReviewers: 0

README.md

@@ -1,10 +1,6 @@
-<p align="center">
-    <a href="https://halo.run" target="_blank" rel="noopener noreferrer">
-        <img width="100" src="https://halo.run/logo" alt="Halo logo" />
-    </a>
-</p>
+<h1 align="center"><a href="https://github.com/halo-dev" target="_blank">halo-admin</a></h1>
 
-> halo-admin 是 [Halo](https://github.com/halo-dev/halo) 的管理端项目。目前 Halo 的运行包内已经包含了构建好的页面，所以如果你不需要额外部署 admin，你无需做任何操作。
+> halo-admin 是 [Halo](https://github.com/halo-dev/halo) 的管理端项目。
 
 <p align="center">
 <a href="https://www.npmjs.com/package/halo-admin"><img alt="npm release" src="https://img.shields.io/npm/v/halo-admin?style=flat-square"/></a>
@@ -16,26 +12,40 @@
 
 ------------------------------
 
-## 开发环境运行
+## 部署方案
 
-```bash
-npm install -g pnpm
-```
+目前 Halo 的运行包内已经包含了构建好的页面，所以如果你不需要额外部署 admin，你无需做任何操作。
+
+### 独立部署
+
+#### 方式一
+
+直接下载最新构建好的版本，然后部署即可。
+
+https://github.com/halo-dev/halo-admin/releases
+
+#### 方式二
+
+1、克隆项目：
 
 ```bash
-pnpm install 
+git clone https://github.com/halo-dev/halo-admin
 ```
 
+2、检出最新版本：
+
 ```bash
-pnpm serve
+git checkout v1.4.13
 ```
 
-## 生产构建
+3、打包构建：
 
 ```bash
+npm install -g pnpm
+
+pnpm install
+
 pnpm build
 ```
 
-## 状态
-
-![Repobeats analytics](https://repobeats.axiom.co/api/embed/9ae12e8e0b9ed7df1b5364169186544d89c1c6bc.svg "Repobeats analytics image")
+最后，得到 dist 文件夹之后就可以单独部署了。

package.json

@@ -1,6 +1,6 @@
 {
   "name": "halo-admin",
-  "version": "1.4.15",
+  "version": "1.4.13",
   "author": "halo-dev",
   "description": "Halo admin client.",
   "repository": {

src/components/Editor/MarkdownEditor.vue

@@ -43,15 +43,14 @@ export default {
     }
   },
   methods: {
-    async handleAttachmentUpload(pos, $file) {
-      try {
-        const response = await apiClient.attachment.upload($file)
+    handleAttachmentUpload(pos, $file) {
+      const formdata = new FormData()
+      formdata.append('file', $file)
+      apiClient.attachment.upload(formdata).then(response => {
         const responseObject = response.data
         const HaloEditor = this.$refs.md
         HaloEditor.$img2Url(pos, encodeURI(responseObject.path))
-      } catch (e) {
-        this.$log.error('update image error: ', e)
-      }
+      })
     },
     handleSaveDraft() {
       this.$emit('onSaveDraft')

src/components/Input/AttachmentInput.vue

@@ -0,0 +1,47 @@
+<template>
+  <div>
+    <a-input :defaultValue="defaultValue" :placeholder="placeholder" :value="value" @change="onInputChange">
+      <a slot="addonAfter" href="javascript:void(0);" @click="attachmentDrawerVisible = true">
+        <a-icon type="picture" />
+      </a>
+    </a-input>
+    <AttachmentSelectDrawer
+      v-model="attachmentDrawerVisible"
+      title="选择附件"
+      @listenToSelect="handleSelectAttachment"
+    />
+  </div>
+</template>
+<script>
+export default {
+  name: 'AttachmentInput',
+  props: {
+    value: {
+      type: String,
+      default: ''
+    },
+    defaultValue: {
+      type: String,
+      default: ''
+    },
+    placeholder: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      attachmentDrawerVisible: false
+    }
+  },
+  methods: {
+    onInputChange(e) {
+      this.$emit('input', e.target.value)
+    },
+    handleSelectAttachment(data) {
+      this.$emit('input', encodeURI(data.path))
+      this.attachmentDrawerVisible = false
+    }
+  }
+}
+</script>

src/components/index.js

@@ -6,7 +6,7 @@ import FilePondUpload from '@/components/Upload/FilePondUpload'
 import AttachmentSelectDrawer from './Attachment/AttachmentSelectDrawer'
 import AttachmentUploadModal from './Attachment/AttachmentUploadModal'
 import ReactiveButton from './Button/ReactiveButton'
-import PostTag from './Post/PostTag'
+import AttachmentInput from './Input/AttachmentInput'
 
 const _components = {
   Ellipsis,
@@ -15,7 +15,7 @@ const _components = {
   AttachmentSelectDrawer,
   AttachmentUploadModal,
   ReactiveButton,
-  PostTag
+  AttachmentInput
 }
 
 const components = {}

src/config/router.config.js

@@ -141,16 +141,22 @@ export const asyncRouterMap = [
             meta: { title: '主题', hiddenHeaderContent: false }
           },
           {
-            path: '/interface/menus',
-            name: 'MenuList',
-            component: () => import('@/views/interface/MenuList'),
-            meta: { title: '菜单', hiddenHeaderContent: false }
+            path: '/interface/themes/setting',
+            name: 'ThemeSetting',
+            component: () => import('@/views/interface/ThemeSetting'),
+            meta: { title: '主题设置', hiddenHeaderContent: false }
           },
           {
             path: '/interface/themes/edit',
             name: 'ThemeEdit',
             component: () => import('@/views/interface/ThemeEdit'),
             meta: { title: '主题编辑', hiddenHeaderContent: false }
+          },
+          {
+            path: '/interface/menus',
+            name: 'MenuList',
+            component: () => import('@/views/interface/MenuList'),
+            meta: { title: '菜单设置', hiddenHeaderContent: false }
           }
         ]
       },

src/layouts/PageView.vue

@@ -6,6 +6,7 @@
           <a-page-header :breadcrumb="{ props: { routes: breadList } }" :sub-title="subTitle" :title="title">
             <slot slot="extra" name="extra"></slot>
             <slot slot="footer" name="footer"></slot>
+            <slot name="content" />
           </a-page-header>
         </div>
       </div>
@@ -15,6 +16,7 @@
         <a-page-header :breadcrumb="{ props: { routes: breadList } }" :sub-title="subTitle" :title="title">
           <slot slot="extra" name="extra"></slot>
           <slot slot="footer" name="footer"></slot>
+          <slot name="content" />
         </a-page-header>
       </div>
     </div>

src/styles/global.less

@@ -824,7 +824,7 @@ body {
       display: block;
       height: 100%;
       background-repeat: no-repeat;
-      background-size: cover;
+      background-size: 100%;
       background-position: center;
     }
 

src/utils/api-client.js

@@ -3,9 +3,7 @@ import store from '@/store'
 import { message, notification } from 'ant-design-vue'
 import { isObject } from './util'
 
-const storedApiUrl = localStorage.getItem('apiUrl')
-
-const apiUrl = storedApiUrl ? storedApiUrl : process.env.VUE_APP_API_URL
+const apiUrl = process.env.VUE_APP_API_URL ? process.env.VUE_APP_API_URL : 'http://localhost:8080'
 
 const haloRestApiClient = new HaloRestAPIClient({
   baseUrl: apiUrl