feat: support meta_keywords and meta_description. (#79)

2020-03-04 20:00:06 +08:00 · 2020-03-04 20:00:06 +08:00 · 0d6fb1e457
parent 43925d0b1a
commit 0d6fb1e457
4 changed files with 112 additions and 25 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -2474,9 +2474,9 @@
      }
    },
    "ant-design-vue": {
-      "version": "1.4.11",
-      "resolved": "https://registry.npmjs.org/ant-design-vue/-/ant-design-vue-1.4.11.tgz",
-      "integrity": "sha512-XwddZpasH8WuWSxvDHakSZSuKAMi1KVbLP49nWpYxCpAk/MiSTsMZvsmxA6BaSoRwSTJ57Y6WJJZ6fOJSR/nxg==",
+      "version": "1.4.12",
+      "resolved": "https://registry.npmjs.org/ant-design-vue/-/ant-design-vue-1.4.12.tgz",
+      "integrity": "sha512-m+hWKF208DN8XX4s4BHCnh+XlUhJy8FUs13a9+jtZCoiQB2zpZdafJeu1LEcFaFlK7fxXfp61fWJJJm0S6ek0g==",
      "requires": {
        "@ant-design/icons": "^2.1.1",
        "@ant-design/icons-vue": "^2.0.0",
@ -6670,9 +6670,9 @@
      "optional": true
    },
    "filepond": {
-      "version": "4.11.0",
-      "resolved": "https://registry.npmjs.org/filepond/-/filepond-4.11.0.tgz",
-      "integrity": "sha512-BCzpBBnv8DgBUeEZPNQyltdD1YIXemm8VjQJ9+vKKhVkGMRQcAzGBFZBtWJSI4dbZF8KVQn+jIvRGujcm5T+EA=="
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/filepond/-/filepond-4.12.0.tgz",
+      "integrity": "sha512-43+WI8R3RtSiPsKTcofnf9CW3i26sENIJFC1VERlu593mg/c5o74SU+gUfoocRWqDWQxjwE2qrobe+CUCPRASg=="
    },
    "filepond-plugin-image-preview": {
      "version": "4.6.1",
@ -14584,9 +14584,9 @@
      "integrity": "sha512-UzD8t1CG+aoWVOOpGd5KcaCNtCgUc0byaKhJMH+6N7H/p1ThVkYl/VCt7DmCrdhUlzZK+hT5JPTKAdrbWi0nNw=="
    },
    "vue-router": {
-      "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.1.5.tgz",
-      "integrity": "sha512-BszkPvhl7I9h334GjckCh7sVFyjTPMMJFJ4Bsrem/Ik+B/9gt5tgrk8k4gGLO4ZpdvciVdg7O41gW4DisQWurg=="
+      "version": "3.1.6",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.1.6.tgz",
+      "integrity": "sha512-GYhn2ynaZlysZMkFE5oCHRUTqE8BWs/a9YbKpNLi0i7xD6KG1EzDqpHQmv1F5gXjr8kL5iIVS8EOtRaVUEXTqA=="
    },
    "vue-style-loader": {
      "version": "4.1.2",
--- a/package.json
+++ b/package.json
@ -9,10 +9,10 @@
    "test:unit": "vue-cli-service test:unit"
  },
  "dependencies": {
-    "ant-design-vue": "^1.4.11",
+    "ant-design-vue": "^1.4.12",
    "axios": "^0.19.2",
    "enquire.js": "^2.1.6",
-    "filepond": "^4.11.0",
+    "filepond": "^4.12.0",
    "filepond-plugin-image-preview": "^4.6.1",
    "halo-editor": "^2.8.2",
    "marked": "^0.8.0",
@ -25,7 +25,7 @@
    "vue-dplayer": "0.0.10",
    "vue-filepond": "^6.0.2",
    "vue-ls": "^3.2.1",
-    "vue-router": "^3.1.5",
+    "vue-router": "^3.1.6",
    "vuejs-logger": "^1.5.3",
    "vuex": "^3.1.1"
  },
--- a/src/views/post/components/PostSettingDrawer.vue
+++ b/src/views/post/components/PostSettingDrawer.vue
@ -158,7 +158,7 @@
                  type="textarea"
                  :autosize="{ minRows: 5 }"
                  v-model="selectedPost.summary"
-                  placeholder="不填写则会自动生成"
+                  placeholder="如不填写，会从文章中自动截取"
                />
              </a-form-item>
            </a-form>
@ -193,6 +193,43 @@
            </div>
          </div>
        </div>
+        <a-divider class="divider-transparent" />
+      </div>
+    </a-skeleton>
+    <AttachmentSelectDrawer
+      v-model="thumbDrawerVisible"
+      @listenToSelect="handleSelectPostThumb"
+      :drawerWidth="460"
+    />
+
+    <a-drawer
+      title="高级设置"
+      :width="isMobile()?'100%':'480'"
+      placement="right"
+      closable
+      destroyOnClose
+      @close="onAdvancedClose"
+      :visible="advancedVisible"
+    >
+      <div class="post-setting-drawer-content">
+        <div :style="{ marginBottom: '16px' }">
+          <h3 class="post-setting-drawer-title">SEO 设置</h3>
+          <div class="post-setting-drawer-item">
+            <a-form layout="vertical">
+              <a-form-item label="关键词：">
+                <a-input v-model="selectedPost.metaKeywords" placeholder="以英文逗号隔开，如不填写，将使用标签作为关键词"/>
+              </a-form-item>
+              <a-form-item label="描述：">
+                <a-input
+                  type="textarea"
+                  :autosize="{ minRows: 5 }"
+                  v-model="selectedPost.metaDescription"
+                  placeholder="如不填写，会从文章中自动截取"
+                />
+              </a-form-item>
+            </a-form>
+          </div>
+        </div>
        <a-divider />
        <div :style="{ marginBottom: '16px' }">
          <h3 class="post-setting-drawer-title">元数据</h3>
@ -230,13 +267,14 @@
        </div>
        <a-divider class="divider-transparent" />
      </div>
-    </a-skeleton>
-    <AttachmentSelectDrawer
-      v-model="thumbDrawerVisible"
-      @listenToSelect="handleSelectPostThumb"
-      :drawerWidth="460"
-    />
+    </a-drawer>
+
    <div class="bottom-control">
+      <a-button
+        style="marginRight: 8px"
+        type="dashed"
+        @click="()=>this.advancedVisible = true"
+      >高级</a-button>
      <a-button
        style="marginRight: 8px"
        @click="handleDraftClick"
@ -282,6 +320,7 @@ export default {
    return {
      thumbDrawerVisible: false,
      categoryFormVisible: false,
+      advancedVisible: false,
      settingLoading: true,
      selectedPost: this.post,
      selectedTagIds: this.tagIds,
@ -503,6 +542,9 @@ export default {
    onClose() {
      this.$emit('close', false)
    },
+    onAdvancedClose() {
+      this.advancedVisible = false
+    },
    onPostDateChange(value, dateString) {
      this.selectedPost.createTime = value.valueOf()
    },
--- a/src/views/sheet/components/SheetSettingDrawer.vue
+++ b/src/views/sheet/components/SheetSettingDrawer.vue
@ -111,6 +111,46 @@
            </div>
          </div>
        </div>
+        <a-divider class="divider-transparent" />
+      </div>
+    </a-skeleton>
+    <AttachmentSelectDrawer
+      v-model="thumbDrawerVisible"
+      @listenToSelect="handleSelectSheetThumb"
+      :drawerWidth="460"
+    />
+
+    <a-drawer
+      title="高级设置"
+      :width="isMobile()?'100%':'480'"
+      placement="right"
+      closable
+      destroyOnClose
+      @close="onAdvancedClose"
+      :visible="advancedVisible"
+    >
+      <div class="post-setting-drawer-content">
+        <div :style="{ marginBottom: '16px' }">
+          <h3 class="post-setting-drawer-title">SEO 设置</h3>
+          <div class="post-setting-drawer-item">
+            <a-form layout="vertical">
+              <a-form-item label="关键词：">
+                <a-input
+                  v-model="selectedSheet.metaKeywords"
+                  placeholder="以英文逗号隔开，如不填写，将使用标签作为关键词"
+                />
+              </a-form-item>
+              <a-form-item label="描述：">
+                <a-input
+                  type="textarea"
+                  :autosize="{ minRows: 5 }"
+                  v-model="selectedSheet.metaDescription"
+                  placeholder="如不填写，会从页面中自动截取"
+                />
+              </a-form-item>
+            </a-form>
+          </div>
+        </div>
        <a-divider />
        <div :style="{ marginBottom: '16px' }">
          <h3 class="post-setting-drawer-title">元数据</h3>
@ -148,13 +188,14 @@
        </div>
        <a-divider class="divider-transparent" />
      </div>
-    </a-skeleton>
-    <AttachmentSelectDrawer
-      v-model="thumbDrawerVisible"
-      @listenToSelect="handleSelectSheetThumb"
-      :drawerWidth="460"
-    />
+    </a-drawer>
+
    <div class="bottom-control">
+      <a-button
+        style="marginRight: 8px"
+        type="dashed"
+        @click="()=>this.advancedVisible = true"
+      >高级</a-button>
      <a-button
        style="marginRight: 8px"
        @click="handleDraftClick"
@ -184,6 +225,7 @@ export default {
  data() {
    return {
      thumbDrawerVisible: false,
+      advancedVisible: false,
      settingLoading: true,
      selectedSheet: this.sheet,
      customTpls: [],
@ -337,6 +379,9 @@ export default {
    onClose() {
      this.$emit('close', false)
    },
+    onAdvancedClose() {
+      this.advancedVisible = false
+    },
    onSheetDateChange(value, dateString) {
      this.selectedSheet.createTime = value.valueOf()
    },