{"remainingRequest":"/Users/kang/Gitea/vue-element-admin/node_modules/vue-loader/lib/index.js??vue-loader-options!/Users/kang/Gitea/vue-element-admin/src/views/example/components/ArticleDetail.vue?vue&type=script&lang=js","dependencies":[{"path":"/Users/kang/Gitea/vue-element-admin/src/views/example/components/ArticleDetail.vue","mtime":1754409279871},{"path":"/Users/kang/Gitea/vue-element-admin/node_modules/cache-loader/dist/cjs.js","mtime":1754409278035},{"path":"/Users/kang/Gitea/vue-element-admin/node_modules/babel-loader/lib/index.js","mtime":1754409277911},{"path":"/Users/kang/Gitea/vue-element-admin/node_modules/cache-loader/dist/cjs.js","mtime":1754409278035},{"path":"/Users/kang/Gitea/vue-element-admin/node_modules/vue-loader/lib/index.js","mtime":1754409279720}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:Ly8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KCmltcG9ydCBUaW55bWNlIGZyb20gJ0AvY29tcG9uZW50cy9UaW55bWNlJwppbXBvcnQgVXBsb2FkIGZyb20gJ0AvY29tcG9uZW50cy9VcGxvYWQvU2luZ2xlSW1hZ2UzJwppbXBvcnQgTURpbnB1dCBmcm9tICdAL2NvbXBvbmVudHMvTURpbnB1dCcKaW1wb3J0IFN0aWNreSBmcm9tICdAL2NvbXBvbmVudHMvU3RpY2t5JyAvLyDnspjmgKdoZWFkZXLnu4Tku7YKaW1wb3J0IHsgdmFsaWRVUkwgfSBmcm9tICdAL3V0aWxzL3ZhbGlkYXRlJwppbXBvcnQgeyBmZXRjaEFydGljbGUgfSBmcm9tICdAL2FwaS9hcnRpY2xlJwppbXBvcnQgeyBzZWFyY2hVc2VyIH0gZnJvbSAnQC9hcGkvcmVtb3RlLXNlYXJjaCcKaW1wb3J0IFdhcm5pbmcgZnJvbSAnLi9XYXJuaW5nJwppbXBvcnQgeyBDb21tZW50RHJvcGRvd24sIFBsYXRmb3JtRHJvcGRvd24sIFNvdXJjZVVybERyb3Bkb3duIH0gZnJvbSAnLi9Ecm9wZG93bicKCmNvbnN0IGRlZmF1bHRGb3JtID0gewogIHN0YXR1czogJ2RyYWZ0JywKICB0aXRsZTogJycsIC8vIOaWh+eroOmimOebrgogIGNvbnRlbnQ6ICcnLCAvLyDmlofnq6DlhoXlrrkKICBjb250ZW50X3Nob3J0OiAnJywgLy8g5paH56ug5pGY6KaBCiAgc291cmNlX3VyaTogJycsIC8vIOaWh+eroOWklumTvgogIGltYWdlX3VyaTogJycsIC8vIOaWh+eroOWbvueJhwogIGRpc3BsYXlfdGltZTogdW5kZWZpbmVkLCAvLyDliY3lj7DlsZXnpLrml7bpl7QKICBpZDogdW5kZWZpbmVkLAogIHBsYXRmb3JtczogWydhLXBsYXRmb3JtJ10sCiAgY29tbWVudF9kaXNhYmxlZDogZmFsc2UsCiAgaW1wb3J0YW5jZTogMAp9CgpleHBvcnQgZGVmYXVsdCB7CiAgbmFtZTogJ0FydGljbGVEZXRhaWwnLAogIGNvbXBvbmVudHM6IHsgVGlueW1jZSwgTURpbnB1dCwgVXBsb2FkLCBTdGlja3ksIFdhcm5pbmcsIENvbW1lbnREcm9wZG93biwgUGxhdGZvcm1Ecm9wZG93biwgU291cmNlVXJsRHJvcGRvd24gfSwKICBwcm9wczogewogICAgaXNFZGl0OiB7CiAgICAgIHR5cGU6IEJvb2xlYW4sCiAgICAgIGRlZmF1bHQ6IGZhbHNlCiAgICB9CiAgfSwKICBkYXRhKCkgewogICAgY29uc3QgdmFsaWRhdGVSZXF1aXJlID0gKHJ1bGUsIHZhbHVlLCBjYWxsYmFjaykgPT4gewogICAgICBpZiAodmFsdWUgPT09ICcnKSB7CiAgICAgICAgdGhpcy4kbWVzc2FnZSh7CiAgICAgICAgICBtZXNzYWdlOiBydWxlLmZpZWxkICsgJ+S4uuW/heS8oOmhuScsCiAgICAgICAgICB0eXBlOiAnZXJyb3InCiAgICAgICAgfSkKICAgICAgICBjYWxsYmFjayhuZXcgRXJyb3IocnVsZS5maWVsZCArICfkuLrlv4XkvKDpobknKSkKICAgICAgfSBlbHNlIHsKICAgICAgICBjYWxsYmFjaygpCiAgICAgIH0KICAgIH0KICAgIGNvbnN0IHZhbGlkYXRlU291cmNlVXJpID0gKHJ1bGUsIHZhbHVlLCBjYWxsYmFjaykgPT4gewogICAgICBpZiAodmFsdWUpIHsKICAgICAgICBpZiAodmFsaWRVUkwodmFsdWUpKSB7CiAgICAgICAgICBjYWxsYmFjaygpCiAgICAgICAgfSBlbHNlIHsKICAgICAgICAgIHRoaXMuJG1lc3NhZ2UoewogICAgICAgICAgICBtZXNzYWdlOiAn5aSW6ZO+dXJs5aGr5YaZ5LiN5q2j56GuJywKICAgICAgICAgICAgdHlwZTogJ2Vycm9yJwogICAgICAgICAgfSkKICAgICAgICAgIGNhbGxiYWNrKG5ldyBFcnJvcign5aSW6ZO+dXJs5aGr5YaZ5LiN5q2j56GuJykpCiAgICAgICAgfQogICAgICB9IGVsc2UgewogICAgICAgIGNhbGxiYWNrKCkKICAgICAgfQogICAgfQogICAgcmV0dXJuIHsKICAgICAgcG9zdEZvcm06IE9iamVjdC5hc3NpZ24oe30sIGRlZmF1bHRGb3JtKSwKICAgICAgbG9hZGluZzogZmFsc2UsCiAgICAgIHVzZXJMaXN0T3B0aW9uczogW10sCiAgICAgIHJ1bGVzOiB7CiAgICAgICAgaW1hZ2VfdXJpOiBbeyB2YWxpZGF0b3I6IHZhbGlkYXRlUmVxdWlyZSB9XSwKICAgICAgICB0aXRsZTogW3sgdmFsaWRhdG9yOiB2YWxpZGF0ZVJlcXVpcmUgfV0sCiAgICAgICAgY29udGVudDogW3sgdmFsaWRhdG9yOiB2YWxpZGF0ZVJlcXVpcmUgfV0sCiAgICAgICAgc291cmNlX3VyaTogW3sgdmFsaWRhdG9yOiB2YWxpZGF0ZVNvdXJjZVVyaSwgdHJpZ2dlcjogJ2JsdXInIH1dCiAgICAgIH0sCiAgICAgIHRlbXBSb3V0ZToge30KICAgIH0KICB9LAogIGNvbXB1dGVkOiB7CiAgICBjb250ZW50U2hvcnRMZW5ndGgoKSB7CiAgICAgIHJldHVybiB0aGlzLnBvc3RGb3JtLmNvbnRlbnRfc2hvcnQubGVuZ3RoCiAgICB9LAogICAgbGFuZygpIHsKICAgICAgcmV0dXJuIHRoaXMuJHN0b3JlLmdldHRlcnMubGFuZ3VhZ2UKICAgIH0sCiAgICBkaXNwbGF5VGltZTogewogICAgICAvLyBzZXQgYW5kIGdldCBpcyB1c2VmdWwgd2hlbiB0aGUgZGF0YQogICAgICAvLyByZXR1cm5lZCBieSB0aGUgYmFjayBlbmQgYXBpIGlzIGRpZmZlcmVudCBmcm9tIHRoZSBmcm9udCBlbmQKICAgICAgLy8gYmFjayBlbmQgcmV0dXJuID0+ICIyMDEzLTA2LTI1IDA2OjU5OjI1IgogICAgICAvLyBmcm9udCBlbmQgbmVlZCB0aW1lc3RhbXAgPT4gMTM3MjExNDc2NTAwMAogICAgICBnZXQoKSB7CiAgICAgICAgcmV0dXJuICgrbmV3IERhdGUodGhpcy5wb3N0Rm9ybS5kaXNwbGF5X3RpbWUpKQogICAgICB9LAogICAgICBzZXQodmFsKSB7CiAgICAgICAgdGhpcy5wb3N0Rm9ybS5kaXNwbGF5X3RpbWUgPSBuZXcgRGF0ZSh2YWwpCiAgICAgIH0KICAgIH0KICB9LAogIGNyZWF0ZWQoKSB7CiAgICBpZiAodGhpcy5pc0VkaXQpIHsKICAgICAgY29uc3QgaWQgPSB0aGlzLiRyb3V0ZS5wYXJhbXMgJiYgdGhpcy4kcm91dGUucGFyYW1zLmlkCiAgICAgIHRoaXMuZmV0Y2hEYXRhKGlkKQogICAgfQoKICAgIC8vIFdoeSBuZWVkIHRvIG1ha2UgYSBjb3B5IG9mIHRoaXMuJHJvdXRlIGhlcmU/CiAgICAvLyBCZWNhdXNlIGlmIHlvdSBlbnRlciB0aGlzIHBhZ2UgYW5kIHF1aWNrbHkgc3dpdGNoIHRhZywgbWF5IGJlIGluIHRoZSBleGVjdXRpb24gb2YgdGhlIHNldFRhZ3NWaWV3VGl0bGUgZnVuY3Rpb24sIHRoaXMuJHJvdXRlIGlzIG5vIGxvbmdlciBwb2ludGluZyB0byB0aGUgY3VycmVudCBwYWdlCiAgICAvLyBodHRwczovL2dpdGh1Yi5jb20vUGFuSmlhQ2hlbi92dWUtZWxlbWVudC1hZG1pbi9pc3N1ZXMvMTIyMQogICAgdGhpcy50ZW1wUm91dGUgPSBPYmplY3QuYXNzaWduKHt9LCB0aGlzLiRyb3V0ZSkKICB9LAogIG1ldGhvZHM6IHsKICAgIGZldGNoRGF0YShpZCkgewogICAgICBmZXRjaEFydGljbGUoaWQpLnRoZW4ocmVzcG9uc2UgPT4gewogICAgICAgIHRoaXMucG9zdEZvcm0gPSByZXNwb25zZS5kYXRhCgogICAgICAgIC8vIGp1c3QgZm9yIHRlc3QKICAgICAgICB0aGlzLnBvc3RGb3JtLnRpdGxlICs9IGAgICBBcnRpY2xlIElkOiR7dGhpcy5wb3N0Rm9ybS5pZH1gCiAgICAgICAgdGhpcy5wb3N0Rm9ybS5jb250ZW50X3Nob3J0ICs9IGAgICBBcnRpY2xlIElkOiR7dGhpcy5wb3N0Rm9ybS5pZH1gCgogICAgICAgIC8vIHNldCB0YWdzdmlldyB0aXRsZQogICAgICAgIHRoaXMuc2V0VGFnc1ZpZXdUaXRsZSgpCgogICAgICAgIC8vIHNldCBwYWdlIHRpdGxlCiAgICAgICAgdGhpcy5zZXRQYWdlVGl0bGUoKQogICAgICB9KS5jYXRjaChlcnIgPT4gewogICAgICAgIGNvbnNvbGUubG9nKGVycikKICAgICAgfSkKICAgIH0sCiAgICBzZXRUYWdzVmlld1RpdGxlKCkgewogICAgICBjb25zdCB0aXRsZSA9IHRoaXMubGFuZyA9PT0gJ3poJyA/ICfnvJbovpHmlofnq6AnIDogJ0VkaXQgQXJ0aWNsZScKICAgICAgY29uc3Qgcm91dGUgPSBPYmplY3QuYXNzaWduKHt9LCB0aGlzLnRlbXBSb3V0ZSwgeyB0aXRsZTogYCR7dGl0bGV9LSR7dGhpcy5wb3N0Rm9ybS5pZH1gIH0pCiAgICAgIHRoaXMuJHN0b3JlLmRpc3BhdGNoKCd0YWdzVmlldy91cGRhdGVWaXNpdGVkVmlldycsIHJvdXRlKQogICAgfSwKICAgIHNldFBhZ2VUaXRsZSgpIHsKICAgICAgY29uc3QgdGl0bGUgPSAnRWRpdCBBcnRpY2xlJwogICAgICBkb2N1bWVudC50aXRsZSA9IGAke3RpdGxlfSAtICR7dGhpcy5wb3N0Rm9ybS5pZH1gCiAgICB9LAogICAgc3VibWl0Rm9ybSgpIHsKICAgICAgY29uc29sZS5sb2codGhpcy5wb3N0Rm9ybSkKICAgICAgdGhpcy4kcmVmcy5wb3N0Rm9ybS52YWxpZGF0ZSh2YWxpZCA9PiB7CiAgICAgICAgaWYgKHZhbGlkKSB7CiAgICAgICAgICB0aGlzLmxvYWRpbmcgPSB0cnVlCiAgICAgICAgICB0aGlzLiRub3RpZnkoewogICAgICAgICAgICB0aXRsZTogJ+aIkOWKnycsCiAgICAgICAgICAgIG1lc3NhZ2U6ICflj5HluIPmlofnq6DmiJDlip8nLAogICAgICAgICAgICB0eXBlOiAnc3VjY2VzcycsCiAgICAgICAgICAgIGR1cmF0aW9uOiAyMDAwCiAgICAgICAgICB9KQogICAgICAgICAgdGhpcy5wb3N0Rm9ybS5zdGF0dXMgPSAncHVibGlzaGVkJwogICAgICAgICAgdGhpcy5sb2FkaW5nID0gZmFsc2UKICAgICAgICB9IGVsc2UgewogICAgICAgICAgY29uc29sZS5sb2coJ2Vycm9yIHN1Ym1pdCEhJykKICAgICAgICAgIHJldHVybiBmYWxzZQogICAgICAgIH0KICAgICAgfSkKICAgIH0sCiAgICBkcmFmdEZvcm0oKSB7CiAgICAgIGlmICh0aGlzLnBvc3RGb3JtLmNvbnRlbnQubGVuZ3RoID09PSAwIHx8IHRoaXMucG9zdEZvcm0udGl0bGUubGVuZ3RoID09PSAwKSB7CiAgICAgICAgdGhpcy4kbWVzc2FnZSh7CiAgICAgICAgICBtZXNzYWdlOiAn6K+35aGr5YaZ5b+F6KaB55qE5qCH6aKY5ZKM5YaF5a65JywKICAgICAgICAgIHR5cGU6ICd3YXJuaW5nJwogICAgICAgIH0pCiAgICAgICAgcmV0dXJuCiAgICAgIH0KICAgICAgdGhpcy4kbWVzc2FnZSh7CiAgICAgICAgbWVzc2FnZTogJ+S/neWtmOaIkOWKnycsCiAgICAgICAgdHlwZTogJ3N1Y2Nlc3MnLAogICAgICAgIHNob3dDbG9zZTogdHJ1ZSwKICAgICAgICBkdXJhdGlvbjogMTAwMAogICAgICB9KQogICAgICB0aGlzLnBvc3RGb3JtLnN0YXR1cyA9ICdkcmFmdCcKICAgIH0sCiAgICBnZXRSZW1vdGVVc2VyTGlzdChxdWVyeSkgewogICAgICBzZWFyY2hVc2VyKHF1ZXJ5KS50aGVuKHJlc3BvbnNlID0+IHsKICAgICAgICBpZiAoIXJlc3BvbnNlLmRhdGEuaXRlbXMpIHJldHVybgogICAgICAgIHRoaXMudXNlckxpc3RPcHRpb25zID0gcmVzcG9uc2UuZGF0YS5pdGVtcy5tYXAodiA9PiB2Lm5hbWUpCiAgICAgIH0pCiAgICB9CiAgfQp9Cg=="},{"version":3,"sources":["ArticleDetail.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6EA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"ArticleDetail.vue","sourceRoot":"src/views/example/components","sourcesContent":["<template>\n  <div class=\"createPost-container\">\n    <el-form ref=\"postForm\" :model=\"postForm\" :rules=\"rules\" class=\"form-container\">\n      <sticky :z-index=\"10\" :class-name=\"'sub-navbar '+postForm.status\">\n        <CommentDropdown v-model=\"postForm.comment_disabled\" />\n        <PlatformDropdown v-model=\"postForm.platforms\" />\n        <SourceUrlDropdown v-model=\"postForm.source_uri\" />\n        <el-button v-loading=\"loading\" style=\"margin-left: 10px;\" type=\"success\" @click=\"submitForm\">\n          Publish\n        </el-button>\n        <el-button v-loading=\"loading\" type=\"warning\" @click=\"draftForm\">\n          Draft\n        </el-button>\n      </sticky>\n\n      <div class=\"createPost-main-container\">\n        <el-row>\n          <Warning />\n\n          <el-col :span=\"24\">\n            <el-form-item style=\"margin-bottom: 40px;\" prop=\"title\">\n              <MDinput v-model=\"postForm.title\" :maxlength=\"100\" name=\"name\" required>\n                Title\n              </MDinput>\n            </el-form-item>\n\n            <div class=\"postInfo-container\">\n              <el-row>\n                <el-col :span=\"8\">\n                  <el-form-item label-width=\"60px\" label=\"Author:\" class=\"postInfo-container-item\">\n                    <el-select v-model=\"postForm.author\" :remote-method=\"getRemoteUserList\" filterable default-first-option remote placeholder=\"Search user\">\n                      <el-option v-for=\"(item,index) in userListOptions\" :key=\"item+index\" :label=\"item\" :value=\"item\" />\n                    </el-select>\n                  </el-form-item>\n                </el-col>\n\n                <el-col :span=\"10\">\n                  <el-form-item label-width=\"120px\" label=\"Publish Time:\" class=\"postInfo-container-item\">\n                    <el-date-picker v-model=\"displayTime\" type=\"datetime\" format=\"yyyy-MM-dd HH:mm:ss\" placeholder=\"Select date and time\" />\n                  </el-form-item>\n                </el-col>\n\n                <el-col :span=\"6\">\n                  <el-form-item label-width=\"90px\" label=\"Importance:\" class=\"postInfo-container-item\">\n                    <el-rate\n                      v-model=\"postForm.importance\"\n                      :max=\"3\"\n                      :colors=\"['#99A9BF', '#F7BA2A', '#FF9900']\"\n                      :low-threshold=\"1\"\n                      :high-threshold=\"3\"\n                      style=\"display:inline-block\"\n                    />\n                  </el-form-item>\n                </el-col>\n              </el-row>\n            </div>\n          </el-col>\n        </el-row>\n\n        <el-form-item style=\"margin-bottom: 40px;\" label-width=\"70px\" label=\"Summary:\">\n          <el-input v-model=\"postForm.content_short\" :rows=\"1\" type=\"textarea\" class=\"article-textarea\" autosize placeholder=\"Please enter the content\" />\n          <span v-show=\"contentShortLength\" class=\"word-counter\">{{ contentShortLength }}words</span>\n        </el-form-item>\n\n        <el-form-item prop=\"content\" style=\"margin-bottom: 30px;\">\n          <Tinymce ref=\"editor\" v-model=\"postForm.content\" :height=\"400\" />\n        </el-form-item>\n\n        <el-form-item prop=\"image_uri\" style=\"margin-bottom: 30px;\">\n          <Upload v-model=\"postForm.image_uri\" />\n        </el-form-item>\n      </div>\n    </el-form>\n  </div>\n</template>\n\n<script>\nimport Tinymce from '@/components/Tinymce'\nimport Upload from '@/components/Upload/SingleImage3'\nimport MDinput from '@/components/MDinput'\nimport Sticky from '@/components/Sticky' // 粘性header组件\nimport { validURL } from '@/utils/validate'\nimport { fetchArticle } from '@/api/article'\nimport { searchUser } from '@/api/remote-search'\nimport Warning from './Warning'\nimport { CommentDropdown, PlatformDropdown, SourceUrlDropdown } from './Dropdown'\n\nconst defaultForm = {\n  status: 'draft',\n  title: '', // 文章题目\n  content: '', // 文章内容\n  content_short: '', // 文章摘要\n  source_uri: '', // 文章外链\n  image_uri: '', // 文章图片\n  display_time: undefined, // 前台展示时间\n  id: undefined,\n  platforms: ['a-platform'],\n  comment_disabled: false,\n  importance: 0\n}\n\nexport default {\n  name: 'ArticleDetail',\n  components: { Tinymce, MDinput, Upload, Sticky, Warning, CommentDropdown, PlatformDropdown, SourceUrlDropdown },\n  props: {\n    isEdit: {\n      type: Boolean,\n      default: false\n    }\n  },\n  data() {\n    const validateRequire = (rule, value, callback) => {\n      if (value === '') {\n        this.$message({\n          message: rule.field + '为必传项',\n          type: 'error'\n        })\n        callback(new Error(rule.field + '为必传项'))\n      } else {\n        callback()\n      }\n    }\n    const validateSourceUri = (rule, value, callback) => {\n      if (value) {\n        if (validURL(value)) {\n          callback()\n        } else {\n          this.$message({\n            message: '外链url填写不正确',\n            type: 'error'\n          })\n          callback(new Error('外链url填写不正确'))\n        }\n      } else {\n        callback()\n      }\n    }\n    return {\n      postForm: Object.assign({}, defaultForm),\n      loading: false,\n      userListOptions: [],\n      rules: {\n        image_uri: [{ validator: validateRequire }],\n        title: [{ validator: validateRequire }],\n        content: [{ validator: validateRequire }],\n        source_uri: [{ validator: validateSourceUri, trigger: 'blur' }]\n      },\n      tempRoute: {}\n    }\n  },\n  computed: {\n    contentShortLength() {\n      return this.postForm.content_short.length\n    },\n    lang() {\n      return this.$store.getters.language\n    },\n    displayTime: {\n      // set and get is useful when the data\n      // returned by the back end api is different from the front end\n      // back end return => \"2013-06-25 06:59:25\"\n      // front end need timestamp => 1372114765000\n      get() {\n        return (+new Date(this.postForm.display_time))\n      },\n      set(val) {\n        this.postForm.display_time = new Date(val)\n      }\n    }\n  },\n  created() {\n    if (this.isEdit) {\n      const id = this.$route.params && this.$route.params.id\n      this.fetchData(id)\n    }\n\n    // Why need to make a copy of this.$route here?\n    // Because if you enter this page and quickly switch tag, may be in the execution of the setTagsViewTitle function, this.$route is no longer pointing to the current page\n    // https://github.com/PanJiaChen/vue-element-admin/issues/1221\n    this.tempRoute = Object.assign({}, this.$route)\n  },\n  methods: {\n    fetchData(id) {\n      fetchArticle(id).then(response => {\n        this.postForm = response.data\n\n        // just for test\n        this.postForm.title += `   Article Id:${this.postForm.id}`\n        this.postForm.content_short += `   Article Id:${this.postForm.id}`\n\n        // set tagsview title\n        this.setTagsViewTitle()\n\n        // set page title\n        this.setPageTitle()\n      }).catch(err => {\n        console.log(err)\n      })\n    },\n    setTagsViewTitle() {\n      const title = this.lang === 'zh' ? '编辑文章' : 'Edit Article'\n      const route = Object.assign({}, this.tempRoute, { title: `${title}-${this.postForm.id}` })\n      this.$store.dispatch('tagsView/updateVisitedView', route)\n    },\n    setPageTitle() {\n      const title = 'Edit Article'\n      document.title = `${title} - ${this.postForm.id}`\n    },\n    submitForm() {\n      console.log(this.postForm)\n      this.$refs.postForm.validate(valid => {\n        if (valid) {\n          this.loading = true\n          this.$notify({\n            title: '成功',\n            message: '发布文章成功',\n            type: 'success',\n            duration: 2000\n          })\n          this.postForm.status = 'published'\n          this.loading = false\n        } else {\n          console.log('error submit!!')\n          return false\n        }\n      })\n    },\n    draftForm() {\n      if (this.postForm.content.length === 0 || this.postForm.title.length === 0) {\n        this.$message({\n          message: '请填写必要的标题和内容',\n          type: 'warning'\n        })\n        return\n      }\n      this.$message({\n        message: '保存成功',\n        type: 'success',\n        showClose: true,\n        duration: 1000\n      })\n      this.postForm.status = 'draft'\n    },\n    getRemoteUserList(query) {\n      searchUser(query).then(response => {\n        if (!response.data.items) return\n        this.userListOptions = response.data.items.map(v => v.name)\n      })\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n@import \"~@/styles/mixin.scss\";\n\n.createPost-container {\n  position: relative;\n\n  .createPost-main-container {\n    padding: 40px 45px 20px 50px;\n\n    .postInfo-container {\n      position: relative;\n      @include clearfix;\n      margin-bottom: 10px;\n\n      .postInfo-container-item {\n        float: left;\n      }\n    }\n  }\n\n  .word-counter {\n    width: 40px;\n    position: absolute;\n    right: 10px;\n    top: 0px;\n  }\n}\n\n.article-textarea ::v-deep {\n  textarea {\n    padding-right: 40px;\n    resize: none;\n    border: none;\n    border-radius: 0px;\n    border-bottom: 1px solid #bfcbd9;\n  }\n}\n</style>\n"]}]}