✨ feat(期刊、曲库): 完善

.env.develop

@@ -0,0 +1 @@
+ENV = "ddddd"

src/api/article.js

@@ -13,6 +13,12 @@ export default {
       data: data
     });
   },
+  getDetail(id) {
+    return request({
+      url: `/luoo-music/cms/journal/${id}`,
+      method: "get"
+    });
+  },
   /**
    * 删除
    * @param {*} id
@@ -31,8 +37,12 @@ export default {
    */
   publish(id, type, time) {
     return request({
-      url: `/luoo-music/cms/journal/publish/${id}?isScheduled=${type}&state=${time}`,
-      method: "put"
+      url: `/luoo-music/cms/journal/publish/${id}`,
+      method: "put",
+      data: {
+        "isScheduled": type,
+        "pubTime": time
+      }
     });
   },
   /**
@@ -43,8 +53,9 @@ export default {
    */
   updateStatus(id, state) {
     return request({
-      url: `/luoo-music/cms/journal/publish/${id}?state=${state}`,
-      method: "put"
+      url: `/luoo-music/cms/journal/update/state/${id}`,
+      method: "put",
+      data: state
     });
   },
   /**

src/api/login.js

@@ -1,8 +1,14 @@
+/*
+ * @Description: 
+ * @version: v1
+ * @Author: zhangjiabao
+ * @Date: 2024-01-02 21:12:35
+ */
 import request from '@/utils/request'
 
 export function login(username, password) {
   return request({
-    url: '/user/admin/login',
+    url: '/user/cms/admin/login',
     method: 'post',
     data: {
       username,
@@ -13,7 +19,7 @@ export function login(username, password) {
 
 export function getInfo(token) {
   return request({
-    url: '/user/admin/info',
+    url: '/user/cms/admin/info',
     method: 'get',
     params: { token }
   })
@@ -21,7 +27,7 @@ export function getInfo(token) {
 
 export function logout() {
   return request({
-    url: '/user/admin/logout',
+    url: '/user/cms/admin/logout',
     method: 'post'
   })
 }

src/api/musicV2.js

@@ -15,24 +15,45 @@ export default {
   },
   getByKeyword(keyword) {
     return request({
-      url: `/luoo-music/cms/song/search/1/999`,
+      url: `/luoo-music/cms/song/search/1/99`,
       method: "post",
       data: { keyword: keyword }
     });
   },
-  updateLyric(id, lyric) {
+  getById(id) {
+    return request({
+      url: `/luoo-music/cms/song/${id}`,
+      method: "get"
+    })
+  },
+  updateInfo(id, data) {
     return request({
-      url: `/luoo-music/cms/song/update/lyric/${id}`,
+      url: `/luoo-music/cms/song/${id}`,
       method: "put",
-      params: {
-        lyric
-      }
+      data,
+    })
+  },
+  getLyric(id) {
+    return request({
+      url: `/luoo-music/cms/song/lyric/${id}`,
+      method: "get"
+    })
+  },
+  updateLyric(id, lyric) {
+    const url = `/luoo-music/cms/song/update/lyric/${id}`;
+
+    return request.put(url, lyric, {
+      headers: {
+        'Content-Type': 'application/json',
+        // 可以添加其他需要的请求头
+      },
     });
   },
   updateState(id, state) {
     return request({
-      url: `/luoo-music/cms/song/update/state/${id}?state=${state}`,
-      method: "put"
+      url: `/luoo-music/cms/song/update/state/${id}`,
+      method: "put",
+      data:state
     });
   },
   delete(id) {

src/components/Breadcrumb/index.vue

@@ -1,3 +1,9 @@
+<!--
+ * @Description: 
+ * @version: v1
+ * @Author: zhangjiabao
+ * @Date: 2024-01-02 21:12:35
+-->
 <template>
   <el-breadcrumb class="app-breadcrumb" separator="/">
     <transition-group name="breadcrumb">
@@ -29,7 +35,7 @@ export default {
       let matched = this.$route.matched.filter(item => item.name)
       const first = matched[0]
       if (first && first.name !== 'dashboard') {
-        matched = [{ path: '/dashboard', meta: { title: 'Dashboard' }}].concat(matched)
+        matched = [{ path: '/dashboard', meta: { title: '首页' }}].concat(matched)
       }
       this.levelList = matched
     }

src/router/index.js

@@ -1,8 +1,8 @@
 /*
  * @Author: zhangjiabao
  * @Date: 2024-01-25 11:05:17
- * @LastEditors: zhangjiabao
- * @LastEditTime: 2024-01-25 18:01:54
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-01-28 19:06:17
  * @FilePath: /luoo_manage_fe/src/router/index.js
  */
 import Vue from "vue";
@@ -50,38 +50,175 @@ export const constantRouterMap = [
     ]
   },
   {
-    path: "/tag",
+    path: "/mainPage",
     component: Layout,
+    redirect: "/mainPage/article",
+    name: "MainPage",
+    meta: { title: "首页", icon: "example" },
     children: [
       {
-        path: "index",
-        name: "Form",
-        component: () => import("@/views/tag/index"),
-        meta: { title: "标签管理", icon: "tag" }
+        path: "article",
+        name: "ArticlePublish",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "期刊发布" }
+      },
+      {
+        path: "user",
+        name: "UserList",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "用户列表" }
       }
     ]
   },
   {
-    path: "/song",
+    path: "/article",
     component: Layout,
+    meta: { title: "期刊管理", icon: "artical" },
+
     children: [
       {
         path: "index",
-        name: "Form",
+        name: "ArticleIndex",
+        component: () => import("@/views/article"),
+        meta: { title: "期刊列表" }
+      }
+    ]
+  },
+  {
+    path: "/userManage",
+    component: Layout,
+    redirect: "/userManage/list",
+    name: "UserManage",
+    meta: { title: "用户管理", icon: "user" },
+    children: [
+      {
+        path: "list",
+        name: "UserManageList",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "用户列表" }
+      },
+      {
+        path: "sign",
+        name: "UserSign",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "用户标识设置" }
+      }
+    ]
+  },
+  {
+    path: "/songLibrary",
+    component: Layout,
+    redirect: "/songLibrary/list",
+    name: "SongLibraryManage",
+    meta: { title: "曲库管理", icon: "music" },
+    children: [
+      {
+        path: "list",
+        name: "Song",
         component: () => import("@/views/song/index"),
-        meta: { title: "曲库管理", icon: "music" }
+        meta: { title: "歌曲管理" }
+      },
+      {
+        path: "tag",
+        name: "Tag",
+        component: () => import("@/views/tag/index"),
+        meta: { title: "标签管理" }
+      },
+      {
+        path: "style",
+        name: "Style",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "风格管理" }
       }
     ]
   },
   {
-    path: "/article",
+    path: "/contentManage",
     component: Layout,
+    redirect: "/contentManage/article",
+    name: "ContentManage",
+    meta: { title: "内容管理", icon: "form" },
     children: [
       {
-        path: "index",
-        name: "Form",
-        component: () => import("@/views/article"),
-        meta: { title: "期刊管理", icon: "artical" }
+        path: "article",
+        name: "ContentArticle",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "文章列表" }
+      },
+      {
+        path: "comment",
+        name: "Comment",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "评论管理" }
+      },
+      {
+        path: "commentCall",
+        name: "CommentCall",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "评论举报" }
+      },
+      {
+        path: "ad",
+        name: "Ad",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "广告管理" }
+      }
+    ]
+  },
+  {
+    path: "/backManage",
+    component: Layout,
+    redirect: "/backManage/user",
+    name: "BackManage",
+    meta: { title: "后台管理", icon: "tree" },
+    children: [
+      {
+        path: "user",
+        name: "BmUser",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "后台用户" }
+      },
+      {
+        path: "role",
+        name: "Role",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "角色管理" }
+      },
+      {
+        path: "fWord",
+        name: "FWord",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "屏蔽词设置" }
+      },
+      {
+        path: "message",
+        name: "message",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "消息设置" }
+      },
+      {
+        path: "advance",
+        name: "advance",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "意见反馈" }
+      },
+      {
+        path: "log",
+        name: "log",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "日志管理" }
+      },
+      {
+        path: "xy",
+        name: "xy",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "协议管理" }
+      },
+      {
+        path: "domain",
+        name: "domain",
+        component: () => import("@/views/common/unfinished"),
+        meta: { title: "域名管理" }
       }
     ]
   },

src/store/modules/user.js

@@ -1,3 +1,9 @@
+/*
+ * @Description: 
+ * @version: v1
+ * @Author: zhangjiabao
+ * @Date: 2024-01-02 21:12:35
+ */
 import { login, logout, getInfo } from '@/api/login'
 import { getToken, setToken, removeToken } from '@/utils/auth'
 
@@ -31,8 +37,8 @@ const user = {
       return new Promise((resolve, reject) => {
         login(username, userInfo.password).then(response => {
           const data = response.data
-          setToken(data.token)
-          commit('SET_TOKEN', data.token)
+          setToken("Bearer " + data.token)
+          commit('SET_TOKEN', "Bearer " + data.token)
           resolve()
         }).catch(error => {
           reject(error)

src/styles/variables.scss

@@ -1,4 +1,4 @@
 //sidebar
-$menuBg:#304156;
-$subMenuBg:#1f2d3d;
-$menuHover:#001528;
+$menuBg:#222325;
+$subMenuBg:#2c2d2f;
+$menuHover:#38393a;

src/utils/request.js

@@ -19,6 +19,7 @@ const service = axios.create({
 service.interceptors.request.use(config => {
   if (store.getters.token) {
     config.headers['X-Token'] = getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
+    config.headers['Admin-Token'] = getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
   }
   return config
 }, error => {

src/views/article/articleModify.vue

@@ -1,8 +1,8 @@
 <!--
  * @Author: zhangjiabao
  * @Date: 2024-01-24 10:09:33
- * @LastEditors: zhangjiabao
- * @LastEditTime: 2024-01-26 10:14:39
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-01-28 18:13:03
  * @FilePath: /luoo_manage_fe/src/views/article/articleModify.vue
 -->
 <!--
@@ -22,16 +22,16 @@
       label-suffix=":"
       label-width="100px"
     >
-      <el-form-item prop="number" label="期刊编号">
+      <el-form-item prop="journalNo" label="期刊编号">
         <el-input
-          v-model="data.number"
+          v-model="data.journalNo"
           size="small"
           placeholder="期刊编号"
         ></el-input>
       </el-form-item>
-      <el-form-item prop="name" label="期刊标题">
+      <el-form-item prop="title" label="期刊标题">
         <el-input
-          v-model="data.name"
+          v-model="data.title"
           size="small"
           placeholder="请输入期刊标题"
         ></el-input>
@@ -48,7 +48,7 @@
         ></el-cascader>
       </el-form-item>
       <el-form-item prop="userId" label="期刊作者">
-        <el-select placeholder="选择发布人" size="small" v-model="data.userId">
+        <el-select placeholder="输入发布人名称" size="small" v-model="data.userId">
           <el-option
             v-for="item in publisher"
             :label="item.name"
@@ -57,17 +57,14 @@
           ></el-option>
         </el-select>
       </el-form-item>
-      <el-form-item prop="coverPhoto" label="上传封面">
-        <img
-          style="width: 170px;height: 120px;"
-          v-if="data.coverPhoto"
-          :src="data.coverPhoto"
-        />
+      <el-form-item prop="image" label="上传封面">
+        <img style="width: 170px;height: 120px;" :src="data.image" />
         <el-upload
-          action="https://jsonplaceholder.typicode.com/posts/"
+          action="/luoo-music/cms/journal/upload/image"
           :on-preview="handlePreview"
           :on-remove="handleRemove"
           :before-remove="beforeRemove"
+          :on-change="handleUploadArticleImageSuccess"
           multiple
           :limit="1"
           :on-exceed="handleExceed"
@@ -86,11 +83,27 @@
       </el-form-item>
       <el-form-item label="期刊音乐" prop="songs">
         <el-row>
-          <el-col :span="4"
-            ><el-button plain size="small" type="primary" icon="el-icon-plus"
+          <el-col :span="4">
+            <el-upload
+              action="/luoo-music/cms/song/batch"
+              :on-preview="handlePreview"
+              :on-remove="handleRemove"
+              :before-remove="beforeRemove"
+              :on-change="handleUploadSongSuccess"
+              multiple
+              :limit="1"
+              :on-exceed="handleExceed"
+              :file-list="songUploadFileList"
+            >
+              <el-button
+                plain
+                size="small"
+                type="primary"
+                icon="el-icon-circle-plus-outline"
                 >上传歌曲</el-button
-            ></el-col
               >
+            </el-upload>
+          </el-col>
           <el-col :span="4"
             ><el-button
               plain
@@ -106,7 +119,7 @@
     </el-form>
     <el-table
       size="mini"
-      :data="data.songs"
+      :data="!data.songs ? [] : data.songs"
       style="width: calc(50% + 400px); margin: 0 0 auto auto;"
       stripe
       class="draggable-table"
@@ -121,12 +134,12 @@
           <i class="el-icon-sort"></i>
         </template>
       </el-table-column>
-      <el-table-column prop="picture" label="专辑封面" width="100px">
+      <el-table-column prop="image" label="专辑封面" width="100px">
         <template slot-scope="slot">
           <img
             style="width: 50;height: 50px;"
-            v-if="slot.row.picture"
-            :src="slot.row.picture"
+            v-if="slot.row.image"
+            :src="slot.row.image"
           />
         </template>
       </el-table-column>
@@ -173,7 +186,7 @@
       <el-form-item prop="volid" label="期刊文案">
         <quill-editor
           ref="text"
-          v-model="data.summary"
+          v-model="data.content"
           style="height: 500px;"
           class="myQuillEditor"
           :options="editorOption"
@@ -189,7 +202,9 @@
       append-to-body
       :before-close="handleLyricDialogBeforeClose"
     >
+      <div v-loading="lyricDialog.loading">
         <el-input type="textarea" v-model="lyricDialog.data"></el-input>
+      </div>
       <span slot="footer">
         <el-button size="small" type="primary" @click="handleLyricDialogSubmit"
           >保存</el-button
@@ -263,7 +278,7 @@
         <el-button size="small" type="primary" @click="handleMusicDialogSubmit"
           >保存</el-button
         >
-        <el-button size="small" @click="handleMusicDialogCancel"
+        <el-button size="small" @click="musicDialog.visible = false"
           >取消</el-button
         >
       </span>
@@ -281,8 +296,12 @@
         :data="musicModifyDialog.data"
       ></MusicModify>
       <span slot="footer">
-        <el-button size="small" type="primary">保存</el-button>
-        <el-button size="small">取消</el-button>
+        <el-button size="small" type="primary" @click="onSaveMusicInfo"
+          >保存</el-button
+        >
+        <el-button size="small" @click="musicModifyDialog.visible = false"
+          >取消</el-button
+        >
       </span></el-dialog
     >
   </div>
@@ -303,12 +322,15 @@ export default {
       type: Object,
       default: {
         id: null,
-        name: null,
+        title: null,
         tag: [],
-        number: null,
+        journalNo: null,
         userId: null,
-        coverPhoto: null,
-        songs: []
+        image: null,
+        songs: [],
+        size: 0,
+        content: "",
+        duration: 0
       }
     },
     remoteTagList: {
@@ -341,6 +363,7 @@ export default {
         data: {}
       },
       coverUploadFileList: [],
+      songUploadFileList: [],
       // editorOption里是放图片上传配置参数用的，例如：
       // action:  '/api/product/richtext_img_upload.do',  // 必填参数 图片上传地址
       // methods: 'post',  // 必填参数 图片上传方式
@@ -350,17 +373,15 @@ export default {
       // accept: 'multipart/form-data, image/png, image/gif, image/jpeg, image/bmp, image/x-icon,image/jpg'  // 可选 可上传的图片格式
       editorOption: {},
       rules: {
-        number: [
+        journalNo: [
           { required: true, message: "请输入期刊编号", trigger: "blur" }
         ],
-        name: [{ required: true, message: "请输入期刊标题", trigger: "blur" }],
+        title: [{ required: true, message: "请输入期刊标题", trigger: "blur" }],
         tag: [{ required: true, message: "请选择期刊标签", trigger: "change" }],
         userId: [
           { required: true, message: "请选择期刊作者", trigger: "blur" }
         ],
-        coverPhoto: [
-          { required: true, message: "请上传封面", trigger: "change" }
-        ],
+        image: [{ required: true, message: "请上传封面", trigger: "change" }],
         songs: [{ required: true, message: "请选择音乐", trigger: "change" }]
       }
     };
@@ -399,6 +420,9 @@ export default {
 
         for (let j in this.remoteTagList) {
           let jId = this.remoteTagList[j].value;
+          if(tag === jId){
+            this.selectTag.push([jId])
+          }
           for (let k in this.remoteTagList[j].children) {
             let kId = this.remoteTagList[j].children[k].value;
             if (tag === this.remoteTagList[j].children[k].value) {
@@ -420,52 +444,20 @@ export default {
       this.data.tag = newTag;
     },
     queryFromMusicLibrary(keyword) {
-      // musicApi.getByKeyword(keyword).then(res => {
-      //   if (res.code === 200) {
-      //     this.musicDialog.remoteResult = res.data;
-      //   } else {
-      //     this.musicDialog.remoteResult = [];
-      //   }
-      // });
+      if (!keyword || keyword === "") {
+        this.musicDialog.remoteResult = [];
+        this.musicDialog.selectLoading = false;
+      }
       this.musicDialog.selectLoading = true;
-      setTimeout(() => {
-        let musicList = [
-          {
-            album: "范特西",
-            artist: "周杰伦",
-            duration: "1h30min",
-            id: "1",
-            journal: [1, 2, 3],
-            lyric: "lllll llll lll",
-            name: "双节棍",
-            picture: "https://luoow.wxwenku.com/999/cover_min.jpg",
-            size: "1.3m",
-            state: "1",
-            tags: [3, 5, 11],
-            updateTime: "2023-01-01",
-            url: "https://luoow.wxwenku.com/999/03._Du_und_ich_Klee.mp3",
-            userId: "1"
-          },
-          {
-            album: "范特西1",
-            artist: "周杰伦1",
-            duration: "1h30min",
-            id: "2",
-            journal: [1, 2, 3],
-            lyric: "lllll llll lll",
-            name: "双节棍1",
-            picture: "https://luoow.wxwenku.com/999/cover_min.jpg",
-            size: "1.3m",
-            state: "1",
-            tags: [3, 5, 11],
-            updateTime: "2023-01-01",
-            url: "https://luoow.wxwenku.com/999/03._Du_und_ich_Klee.mp3",
-            userId: "1"
-          }
-        ];
-        this.musicDialog.remoteResult = musicList;
+      musicApi.getList({ keyword, state: 1 }, 1, 50).then(res => {
+        if (res.code === 200) {
+          this.musicDialog.remoteResult = res.data.rows;
+          this.musicDialog.selectLoading = false;
+        } else {
+          this.musicDialog.remoteResult = [];
           this.musicDialog.selectLoading = false;
-      }, 1000);
+        }
+      });
     },
     handleMusicLibrarySelectChange(val) {
       for (let i in this.musicDialog.tableData) {
@@ -503,6 +495,19 @@ export default {
     beforeRemove(file, fileList) {
       return this.$confirm(`确定移除 ${file.name}？`);
     },
+    handleUploadArticleImageSuccess(response, file, fileList) {
+      if (response.status === "success") {
+        this.$message.success("上传成功");
+        this.data.image = response.response.data["fullUrl"];
+        this.data.size = response.response.data["size"];
+        this.data.duration = response.response.data["duration"];
+      }
+    },
+    handleUploadSongSuccess(response, file, fileList) {
+      if (response.status === "success") {
+        this.$message.success("上传成功");
+      }
+    },
     // ************************* 按扭事件 *************************
     /**
      * 曲库添加按扭点击事件
@@ -547,23 +552,10 @@ export default {
      * 弹窗提交按扭点击事件
      */
     handleLyricDialogSubmit() {
-      // musicApi
-      //   .updateLyric(this.lyricDialog.songId, this.lyricDialog.data)
-      //   .then(res => {
-      //     if (res.code === 200) {
-      //       for (let sIndex in this.data.songs) {
-      //         if (this.data.songs[sIndex].id === this.lyricDialog.songId) {
-      //           this.data.songs[sIndex].lyric = this.lyricDialog.data;
-      //         }
-      //         break;
-      //       }
-      //       this.lyricDialog.data = "";
-      //       this.lyricDialog.songId = null;
-      //       this.lyricDialog.visible = false;
-      //     } else {
-      //       this.$message.error(res.message);
-      //     }
-      //   });
+      musicApi
+        .updateLyric(this.lyricDialog.songId, this.lyricDialog.data)
+        .then(res => {
+          if (res.code === 200) {
             for (let sIndex in this.data.songs) {
               if (this.data.songs[sIndex].id === this.lyricDialog.songId) {
                 this.data.songs[sIndex].lyric = this.lyricDialog.data;
@@ -573,6 +565,10 @@ export default {
             this.lyricDialog.data = "";
             this.lyricDialog.songId = null;
             this.lyricDialog.visible = false;
+          } else {
+            this.$message.error(res.message);
+          }
+        });
     },
     /**
      * 弹窗取消按扭点击事件
@@ -587,8 +583,12 @@ export default {
      */
     handleLyricClick(row) {
       this.lyricDialog.songId = row.id;
-      this.lyricDialog.data = row.lyric;
       this.lyricDialog.visible = true;
+      this.lyricDialog.loading = true;
+      musicApi.getLyric(row.id).then(res => {
+        this.lyricDialog.data = res.data.lyric;
+        this.lyricDialog.loading = false;
+      })
     },
     /**
      * 弹窗关闭按扭点击事件
@@ -619,12 +619,38 @@ export default {
       }
       this.musicDialog.visible = false;
     },
-    /**
-     * 弹窗取消按扭点击事件
-     */
-    handleMusicDialogCancel() {
-      this.$message.success("music cancel");
-      this.musicDialog.visible = false;
+    onSaveMusicInfo() {
+      let oldInfo = this.musicModifyDialog.data;
+      let newInfo = {
+        album: oldInfo["album"],
+        artist: oldInfo["artist"],
+        image: oldInfo["image"],
+        name: oldInfo["name"],
+        tags: oldInfo["tags"],
+        url: oldInfo["url"],
+        size: oldInfo["size"],
+        duration: oldInfo["duration"]
+      };
+      musicApi.updateInfo(oldInfo["id"], newInfo).then(res => {
+        if (res.code === 200) {
+          this.$message.success("保存成功");
+          musicApi.getById(oldInfo.id).then(newQueryRes => {
+            if (newQueryRes.data === 200) {
+              for (let songIndex in this.data.songs) {
+                if (this.data.songs[songIndex].id === newQueryRes.data.id) {
+                  this.data.songs[songIndex] = newQueryRes.data;
+                }
+              }
+              console.log("更新表格数据完成")
+            } else {
+              this.message.$error(newQueryRes.message);
+            }
+          });
+          this.musicModifyDialog.visible = false;
+        } else {
+          this.$message.error(res.message);
+        }
+      });
     },
     /**
      * 弹窗关闭按扭点击事件

src/views/article/index.vue

@@ -49,8 +49,13 @@
           ></el-input>
         </el-form-item>
         <el-form-item>
-          <el-select
-            placeholder="选择发布人"
+          <el-input
+            placeholder="输入发布人名称"
+            size="medium"
+            v-model="queryForm.data.creatorId"
+          ></el-input>
+          <!-- <el-select
+            placeholder="输入发布人名称"
             size="medium"
             v-model="queryForm.data.creatorId"
           >
@@ -60,7 +65,7 @@
               :value="item.id"
               :key="item.id"
             ></el-option>
-          </el-select>
+          </el-select> -->
         </el-form-item>
         <el-form-item>
           <el-date-picker
@@ -122,13 +127,8 @@
             {{ scope.$index + 1 }}
           </template>
         </el-table-column>
-        <el-table-column label="期刊编号">
-          <template slot-scope="scope">
-            <span>VOL.</span>
-            <span>{{ scope.row.number }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column label="期刊标题" prop="name"></el-table-column>
+        <el-table-column label="期刊编号" prop="journalNo"></el-table-column>
+        <el-table-column label="期刊标题" prop="title"></el-table-column>
         <el-table-column label="风格标签">
           <template slot-scope="scope">
             <span>{{ getTagNameById(scope.row.tag) }}</span>
@@ -137,19 +137,15 @@
         <el-table-column label="歌曲数" prop="songCount"></el-table-column>
         <el-table-column
           label="播放次数"
-          prop="playCount"
+          prop="visits"
           v-if="activateTab === 1"
         ></el-table-column>
         <el-table-column
           label="评论数"
-          prop="commentCount"
+          prop="comment"
           v-if="activateTab === 1"
         ></el-table-column>
-        <el-table-column label="期刊作者">
-          <template slot-scope="scope">
-            <span>{{ getAuthorNameById(scope.row.userId) }}</span>
-          </template>
-        </el-table-column>
+        <el-table-column label="期刊作者" prop="userName"></el-table-column>
         <el-table-column label="创建时间" prop="createTime"></el-table-column>
         <el-table-column
           label="待发布时间"
@@ -219,13 +215,14 @@
     <el-dialog
       :title="['新建期刊', '编辑期刊', '详情'][modifyDialog.type]"
       class="popup-dialog"
-      :visible="modifyDialog.visible"
+      :visible="true"
       v-if="modifyDialog.visible"
       width="80%"
       top="60px"
       :before-close="handleModifyDialogBeforeClose"
     >
       <div
+        v-loading="modifyDialog.loading"
         style="height: 70vh;overflow: auto;padding-left:20px;padding-right:20px"
       >
         <ArticleModify
@@ -363,6 +360,7 @@ export default {
       // 新增修改弹窗
       modifyDialog: {
         visible: false,
+        loading: true,
         type: 0, // 0for新增 1for编辑 2for详情
         data: {} // 弹窗内数据
       },
@@ -402,8 +400,8 @@ export default {
         end: "",
         keyword: param.name,
         start: "",
-        tab: this.activateTab,
-        tags: [],
+        tab: this.activateTab + "",
+        tags: param.tags,
         userId: param.creatorId
       };
 
@@ -418,65 +416,17 @@ export default {
       }
       this.table.loading = true;
       this.table.data = [];
-      // articleApi
-      //   .getList(queryParam, this.table.page.current, this.table.page.size)
-      //   .then(res => {
-      //     if(res.code === 200){
-      //       this.table.data = res.data.rows;
-      //       this.table.page.total = res.data.total;
-      //     }else{
-      //       this.$message.error(res.message)
-      //     }
-      //     this.table.loading = false;
-      //   });
-      let res = {
-        code: 200,
-        data: {
-          rows: [
-            {
-              commentCount: 0,
-              coverPhoto: "https://luoow.wxwenku.com/999/cover_min.jpg",
-              createTime: "2023-01-01",
-              id: "1",
-              name: "期刊名称",
-              number: "742",
-              playCount: 1,
-              pubTime: "2023-01-01",
-              songCount: 1,
-              songs: [
-                {
-                  album: "范特西",
-                  artist: "周杰伦",
-                  duration: "1h30min",
-                  id: "1",
-                  journal: [1, 2, 3],
-                  lyric: "lllll llll lll",
-                  name: "双节棍",
-                  picture: "https://luoow.wxwenku.com/999/cover_min.jpg",
-                  size: "1.3m",
-                  state: "1",
-                  tags: [3, 5, 11],
-                  updateTime: "2023-01-01",
-                  url: "https://luoow.wxwenku.com/999/03._Du_und_ich_Klee.mp3",
-                  userId: "1627863701048659968"
-                }
-              ],
-              state: "1",
-              status: "1",
-              summary: "领军 \n 灵精了",
-              tag: [1, 3, 5, 11],
-              userId: "1627863701048659968"
-            }
-          ],
-          total: 0
-        },
-        message: ""
-      };
-      setTimeout(() => {
+      articleApi
+        .getList(queryParam, this.table.page.current, this.table.page.size)
+        .then(res => {
+          if (res.code === 200) {
             this.table.data = res.data.rows;
             this.table.page.total = res.data.total;
+          } else {
+            this.$message.error(res.message);
+          }
           this.table.loading = false;
-      }, 1000);
+        });
     },
     /**
      * 创建人下拉框
@@ -494,31 +444,10 @@ export default {
      * 高级筛选tag
      */
     fetchSuperFilterTags() {
-      // tagApi.queryHierarchical().then(res => {
-      //   console.log(res)
-      // })
-      let res = [
-        {
-          id: 1,
-          nameCh: "语言类型",
-          children: [
-            { id: 3, nameCh: "中文" },
-            { id: 4, nameCh: "日文" },
-            { id: 5, nameCh: "英文" }
-          ]
-        },
-        {
-          id: 10,
-          nameCh: "期刊标签",
-          children: [
-            { id: 11, nameCh: "民谣" },
-            { id: 12, nameCh: "摇滚" }
-          ]
-        }
-      ];
+      tagApi.queryHierarchical().then(res => {
         let newList = [];
-      for (let index in res) {
-        let item = res[index];
+        for (let index in res.data) {
+          let item = res.data[index];
           let newItem = { value: item.id, label: item.nameCh, children: [] };
           for (let childrenIndex in item.children) {
             let childrenItem = item.children[childrenIndex];
@@ -530,6 +459,7 @@ export default {
           newList.push(newItem);
         }
         this.queryForm.remoteData.superFilterTags = newList;
+      });
     },
     // ************************* 数据处理 *************************
     getAuthorNameById(userId) {
@@ -542,6 +472,9 @@ export default {
       }
     },
     getTagNameById(tagIdList) {
+      if (!tagIdList || typeof exp == "undefined") {
+        return "";
+      }
       let tagList = [];
       for (let tagIdIndex in tagIdList) {
         let tagId = tagIdList[tagIdIndex];
@@ -604,9 +537,7 @@ export default {
         tags.push(val[i].value);
       }
       let queryParam = {
-        name: null,
-        creatorId: null,
-        timeRange: [],
+        tab: this.activateTab,
         tags: tags
       };
       this.fetchData(queryParam);
@@ -619,24 +550,35 @@ export default {
     handleAddClick() {
       let newData = {
         id: null,
-        name: null,
+        title: null,
         tag: [],
-        number: null,
+        journalNo: null,
         userId: null,
-        coverPhoto: null,
+        image: null,
         songs: []
       };
       this.modifyDialog.data = newData;
       this.modifyDialog.type = 0;
       this.modifyDialog.visible = true;
+      this.modifyDialog.loading = false;
     },
     /**
      * 编辑标签点击事件
      */
     handleModifyClick(row) {
-      this.modifyDialog.data = JSON.parse(JSON.stringify(row));
-      this.modifyDialog.type = 1;
       this.modifyDialog.visible = true;
+      this.modifyDialog.loading = true;
+      articleApi.getDetail(row.id).then(res => {
+        if (res.code === 200) {
+          this.modifyDialog.data = JSON.parse(JSON.stringify(res.data));
+          this.modifyDialog.type = 1;
+          this.modifyDialog.loading = false;
+        } else {
+          this.modifyDialog.visible = false;
+          this.modifyDialog.loading = false;
+          this.$message.error(res.message);
+        }
+      });
     },
     /**
      * 发布点击事件
@@ -685,13 +627,31 @@ export default {
      * 弹窗确定按扭点击事件
      */
     handleDialogSubmit() {
-      debugger;
       this.$refs.modifyDialog.$refs.modifyDialogForm.validate(valid => {
         if (valid) {
+          let orgData = this.$refs.modifyDialog.data;
+          let param = {
+            id: orgData["id"],
+            content: orgData["content"],
+            image: orgData["image"],
+            journalNo: orgData["journalNo"],
+            songs: [],
+            tag: orgData["tag"],
+            title: orgData["title"],
+            userId: orgData["userId"]
+          };
+          let newMusicIdList = [];
+          if (orgData.songs) {
+            for (let i in orgData.songs) {
+              newMusicIdList.push(orgData.songs[i].id);
+            }
+          }
+          param.songs = newMusicIdList;
+          console.log(param);
+
           // 新增
           if (this.modifyDialog.type === 0) {
-            console.log(this.$refs.modifyDialog.data);
-            articleApi.add(this.$refs.modifyDialog.data).then(res => {
+            articleApi.add(param).then(res => {
               if (res.code === 200) {
                 this.$message.success(res.message);
                 this.modifyDialog.visible = false;
@@ -703,19 +663,12 @@ export default {
                 this.$message.error(res.message);
               }
             });
-            console.log("编辑");
+            console.log("新增");
             return;
           }
-
           // 编辑
           if (this.modifyDialog.type === 1) {
-            console.log(this.$refs.modifyDialog.data);
-            articleApi
-              .update(
-                this.$refs.modifyDialog.data.id,
-                this.$refs.modifyDialog.data
-              )
-              .then(res => {
+            articleApi.update(param.id, param).then(res => {
               if (res.code === 200) {
                 this.$message.success(res.message);
                 this.modifyDialog.visible = false;

src/views/common/unfinished.vue

@@ -0,0 +1,30 @@
+<!--
+ * @Description: 
+ * @version: v1
+ * @Author: zhangjiabao
+ * @Date: 2024-01-28 19:04:19
+-->
+<template>
+    <div class="under-construction">
+      <h1>页面正在建设中</h1>
+      <p>抱歉，这个页面还没有完成开发。</p>
+      <p>请稍后再回来查看，感谢您的理解。</p>
+    </div>
+  </template>
+  
+  <style>
+  .under-construction {
+    text-align: center;
+    margin: 50px;
+  }
+  
+  .under-construction h1 {
+    font-size: 24px;
+    color: #333;
+  }
+  
+  .under-construction p {
+    font-size: 16px;
+    color: #666;
+  }
+  </style>

src/views/layout/components/Sidebar/SidebarItem.vue

@@ -8,7 +8,7 @@
   <div class="menu-wrapper">
     <template v-for="item in routes" v-if="!item.hidden&&item.children">
 
-      <router-link v-if="item.children.length===1 && !item.children[0].children && !item.alwaysShow" :to="item.path+'/'+item.children[0].path" :key="item.children[0].name">
+      <router-link v-if="item.children.length===0 && !item.children[0].children && !item.alwaysShow" :to="item.path+'/'+item.children[0].path" :key="item.children[0].name">
         <el-menu-item :index="item.path+'/'+item.children[0].path" :class="{'submenu-title-noDropdown':!isNest}">
           <svg-icon v-if="item.children[0].meta&&item.children[0].meta.icon" :icon-class="item.children[0].meta.icon"></svg-icon>
           <span v-if="item.children[0].meta&&item.children[0].meta.title">{{item.children[0].meta.title}}</span>

src/views/song/index.vue

@@ -21,8 +21,9 @@
           ></el-input>
         </el-form-item>
         <el-form-item>
-          <el-select
-            placeholder="选择发布人"
+          <el-input v-model="queryForm.data.creatorId" placeholder="输入发布人名称" size="medium"></el-input>
+          <!-- <el-select
+            placeholder="输入发布人名称"
             size="medium"
             v-model="queryForm.data.creatorId"
           >
@@ -32,7 +33,7 @@
               :value="item.id"
               :key="item.id"
             ></el-option>
-          </el-select>
+          </el-select> -->
         </el-form-item>
         <el-form-item>
           <el-date-picker
@@ -71,19 +72,14 @@
       </el-form>
       <el-form :inline="true" class="in-card-form">
         <el-form-item>
-          <el-button icon="el-icon-upload" type="primary" size="small"
+          <el-button
+            icon="el-icon-upload"
+            type="primary"
+            size="small"
+            @click="uploadDialog.visible = true"
             >上传</el-button
           >
         </el-form-item>
-        <el-form-item>
-          <el-button icon="el-icon-upload2" size="small">批量上传</el-button>
-        </el-form-item>
-        <el-form-item>
-          <el-button icon="el-icon-download" size="small">下载</el-button>
-        </el-form-item>
-        <el-form-item>
-          <el-button icon="el-icon-delete" size="small">删除</el-button>
-        </el-form-item>
       </el-form>
       <!-- 表格 -->
       <el-table
@@ -105,13 +101,6 @@
             <span>{{ scope.row.name }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="">
-          <template slot-scope="scope">
-            <el-button style="padding: 0px;" type="text" icon="el-icon-download"
-              >下载</el-button
-            >
-          </template>
-        </el-table-column>
         <el-table-column prop="artist" label="歌手/乐队"></el-table-column>
         <el-table-column prop="album" label="所属专辑"></el-table-column>
         <el-table-column label="歌曲风格">
@@ -119,12 +108,12 @@
             <span>{{ getTagNameById(scope.row.tags) }}</span>
           </template>
         </el-table-column>
-        <el-table-column prop="picture" label="专辑封面" width="100px">
+        <el-table-column prop="image" label="专辑封面" width="100px">
           <template slot-scope="slot">
             <img
               style="width: 50;height: 50px;"
-              v-if="slot.row.picture"
-              :src="slot.row.picture"
+              v-if="slot.row.image"
+              :src="slot.row.image"
             />
           </template>
         </el-table-column>
@@ -146,8 +135,8 @@
               v-model="scope.row.state"
               active-color="#13ce66"
               @change="handleTableRowStatusChange($event, scope.row)"
-              :active-value="1"
-              :inactive-value="0"
+              :active-value="'1'"
+              :inactive-value="'0'"
               size="mini"
             ></el-switch>
           </template>
@@ -167,7 +156,12 @@
               size="mini"
               >编辑</el-button
             >
-            <el-button plain icon="el-icon-success" type="success" size="mini"
+            <el-button
+              plain
+              icon="el-icon-success"
+              type="success"
+              size="mini"
+              @click="handleLyricClick(scope.row)"
               >歌词</el-button
             >
             <el-popconfirm
@@ -234,10 +228,68 @@
         :data="musicModifyDialog.data"
       ></MusicModify>
       <span slot="footer">
-        <el-button size="small" type="primary">保存</el-button>
-        <el-button size="small">取消</el-button>
+        <el-button @click="handleMusicModifySave" size="small" type="primary"
+          >保存</el-button
+        >
+        <el-button @click="handleMusicModifyClose" size="small">取消</el-button>
       </span></el-dialog
     >
+    <el-dialog
+      title="歌词"
+      :visible="true"
+      v-if="lyricDialog.visible"
+      width="40%"
+      top="60px"
+      append-to-body
+      :before-close="handleLyricDialogBeforeClose"
+    >
+      <div v-loading="lyricDialog.loading">
+        <el-input type="textarea" v-model="lyricDialog.data"></el-input>
+      </div>
+      <span slot="footer">
+        <el-button size="small" type="primary" @click="handleLyricDialogSubmit"
+          >保存</el-button
+        >
+        <el-button size="small" @click="handleLyricDialogCancel"
+          >取消</el-button
+        >
+      </span>
+    </el-dialog>
+    <el-dialog
+      title="上传"
+      :visible="true"
+      v-if="uploadDialog.visible"
+      width="40%"
+      top="60px"
+      append-to-body
+      :before-close="handleUploadDialogBeforeClose"
+    >
+      <el-upload
+        action="/luoo-music/cms/song/batch"
+        :on-preview="handlePreview"
+        :on-remove="handleRemove"
+        :before-remove="beforeRemove"
+        :on-change="handleUploadSongSuccess"
+        multiple
+        :limit="10"
+        :on-exceed="handleExceed"
+        name="files"
+        :file-list="songUploadFileList"
+      >
+        <el-button icon="el-icon-receiving" plain>上传歌曲</el-button>
+        <div
+          slot="tip"
+          style="font-family: '微软雅黑', sans-serif; font-weight: 400; font-style: normal; color: #999999;"
+        >
+          支持格式：.mp3 .wav .flac ，单个文件不能超过20MB，支持批量上传
+        </div>
+      </el-upload>
+      <span slot="footer">
+        <el-button size="small" @click="uploadDialog.visible = false"
+          >取消</el-button
+        >
+      </span>
+    </el-dialog>
   </div>
 </template>
 
@@ -263,10 +315,19 @@ export default {
           timeRange: []
         }
       },
+      songUploadFileList: [],
       musicModifyDialog: {
         visible: false,
         data: {}
       },
+      lyricDialog: {
+        visible: false,
+        songId: null,
+        data: ""
+      },
+      uploadDialog: {
+        visible: false
+      },
       // 表格
       table: {
         show: true,
@@ -308,54 +369,21 @@ export default {
       };
       if (param.timeRange) {
         if (param.timeRange[0]) {
-          queryParam.start = param.timeRange[0] + " 00:00:00";
+          queryParam.start = param.timeRange[0];
         }
 
         if (param.timeRange[1]) {
-          queryParam.end = param.timeRange[1] + " 23:59:59";
+          queryParam.end = param.timeRange[1];
         }
       }
       this.table.loading = true;
-
-      setTimeout(() => {
-        let musicList = [
-          {
-            album: "范特西",
-            artist: "周杰伦",
-            duration: "1h30min",
-            id: "1",
-            journal: [1, 2, 3],
-            lyric: "lllll llll lll",
-            name: "双节棍",
-            picture: "https://luoow.wxwenku.com/999/cover_min.jpg",
-            size: "1.3m",
-            state: "1",
-            tags: [3, 5, 11],
-            updateTime: "2023-01-01",
-            url: "https://luoow.wxwenku.com/999/03._Du_und_ich_Klee.mp3",
-            userId: "1627863701048659968"
-          },
-          {
-            album: "范特西1",
-            artist: "周杰伦1",
-            duration: "1h30min",
-            id: "2",
-            journal: [1, 2, 3],
-            lyric: "lllll llll lll",
-            name: "双节棍1",
-            picture: "https://luoow.wxwenku.com/999/cover_min.jpg",
-            size: "1.3m",
-            state: "1",
-            tags: [3, 5, 11],
-            updateTime: "2023-01-01",
-            url: "https://luoow.wxwenku.com/999/03._Du_und_ich_Klee.mp3",
-            userId: "1627863701048659968"
-          }
-        ];
-        this.table.data = musicList;
-        this.table.page.total = 10;
+      musicApi
+        .getList(queryParam, this.table.page.current, this.table.page.size)
+        .then(res => {
+          this.table.data = res.data.rows;
+          this.table.page.total = res.data.total;
           this.table.loading = false;
-      }, 1000);
+        });
     },
     /**
      * 创建人下拉框
@@ -373,31 +401,10 @@ export default {
      * 高级筛选tag
      */
     fetchTags() {
-      // tagApi.queryHierarchical().then(res => {
-      //   console.log(res)
-      // })
-      let res = [
-        {
-          id: 1,
-          nameCh: "语言类型",
-          children: [
-            { id: 3, nameCh: "中文" },
-            { id: 4, nameCh: "日文" },
-            { id: 5, nameCh: "英文" }
-          ]
-        },
-        {
-          id: 10,
-          nameCh: "期刊标签",
-          children: [
-            { id: 11, nameCh: "民谣" },
-            { id: 12, nameCh: "摇滚" }
-          ]
-        }
-      ];
+      tagApi.queryHierarchical().then(res => {
         let newList = [];
-      for (let index in res) {
-        let item = res[index];
+        for (let index in res.data) {
+          let item = res.data[index];
           let newItem = { value: item.id, label: item.nameCh, children: [] };
           for (let childrenIndex in item.children) {
             let childrenItem = item.children[childrenIndex];
@@ -409,6 +416,7 @@ export default {
           newList.push(newItem);
         }
         this.queryForm.remoteData.tags = newList;
+      });
     },
     // ************************* 数据处理 *************************
     getAuthorNameById(userId) {
@@ -470,7 +478,8 @@ export default {
      * 编辑标签点击事件
      */
     handleModifyClick(row) {
-      this.musicModifyDialog.data = row;
+      let newRow = JSON.parse(JSON.stringify(row));
+      this.musicModifyDialog.data = newRow;
       this.musicModifyDialog.visible = true;
     },
     /**
@@ -491,8 +500,7 @@ export default {
      * 表格内状态滑块切换事件
      */
     handleTableRowStatusChange($event, row) {
-      this.$message("状态切换" + $event);
-      musicApi.updateStatus(row.id, $event).then(res => {
+      musicApi.updateState(row.id, $event).then(res => {
         if (res.code === 200) {
           this.$message.success(res.message);
         } else {
@@ -543,6 +551,53 @@ export default {
         this.$refs.songTable.toggleRowSelection(rows[rowIndex]);
       }
     },
+    /**
+     * 打开弹窗按扭点击事件
+     */
+    handleLyricClick(row) {
+      this.lyricDialog.songId = row.id;
+      this.lyricDialog.visible = true;
+      this.lyricDialog.loading = true;
+      musicApi.getLyric(row.id).then(res => {
+        this.lyricDialog.data = res.data.lyric;
+        this.lyricDialog.loading = false;
+      });
+    },
+    handleLyricDialogBeforeClose(done) {
+      this.lyricDialog.data = "";
+      this.lyricDialog.songId = null;
+      this.lyricDialog.visible = false;
+      done();
+    },
+    handleUploadDialogBeforeClose(done) {
+      this.uploadDialog.visible = false;
+      this.songUploadFileList = [];
+      done();
+    },
+    /**
+     * 弹窗提交按扭点击事件
+     */
+    handleLyricDialogSubmit() {
+      musicApi
+        .updateLyric(this.lyricDialog.songId, this.lyricDialog.data)
+        .then(res => {
+          if (res.code === 200) {
+            this.lyricDialog.data = "";
+            this.lyricDialog.songId = null;
+            this.lyricDialog.visible = false;
+          } else {
+            this.$message.error(res.message);
+          }
+        });
+    },
+    /**
+     * 弹窗取消按扭点击事件
+     */
+    handleLyricDialogCancel() {
+      this.lyricDialog.data = "";
+      this.lyricDialog.songId = null;
+      this.lyricDialog.visible = false;
+    },
     /**
      * 分页组件页数变化事件
      */
@@ -563,6 +618,54 @@ export default {
     handleMusicModifyDialogBeforeClose(done) {
       this.musicModifyDialog.visible = false;
       done();
+    },
+    handleMusicModifySave() {
+      let oldInfo = this.musicModifyDialog.data;
+      let newInfo = {
+        album: oldInfo["album"],
+        artist: oldInfo["artist"],
+        image: oldInfo["image"],
+        name: oldInfo["name"],
+        tags: oldInfo["tags"],
+        url: oldInfo["url"]
+      };
+      musicApi.updateInfo(oldInfo["id"], newInfo).then(res => {
+        if (res.code === 200) {
+          this.musicModifyDialog.data = {};
+          this.$message.success("保存成功");
+
+          this.musicModifyDialog.visible = false;
+          this.fetchData(this.queryForm.lastQuery);
+        } else {
+          this.$message.error(res.message);
+        }
+      });
+    },
+    handleMusicModifyClose() {
+      this.musicModifyDialog.data = {};
+      this.musicModifyDialog.visible = false;
+    },
+    // ************************* 上传事件 *************************
+    handleRemove(file, fileList) {
+      console.log(file, fileList);
+    },
+    handlePreview(file) {
+      console.log(file);
+    },
+    handleExceed(files, fileList) {
+      this.$message.warning(
+        `当前限制选择 10 个文件，本次选择了 ${
+          files.length
+        } 个文件，共选择了 ${files.length + fileList.length} 个文件`
+      );
+    },
+    beforeRemove(file, fileList) {
+      return this.$confirm(`确定移除 ${file.name}？`);
+    },
+    handleUploadSongSuccess(response, file, fileList) {
+      if (response.status === "success") {
+        this.$message.success("上传成功");
+      }
     }
   }
 };

src/views/song/musicModify.vue

@@ -38,20 +38,21 @@
           filterable
         ></el-cascader>
       </el-form-item>
-      <el-form-item prop="picture" label="上传封面">
+      <el-form-item prop="image" label="上传封面">
         <img
           style="width: 170px;height: 120px;"
-          v-if="data.picture"
-          :src="data.picture"
+          v-if="data.image"
+          :src="data.image"
         />
         <el-upload
-          action="https://jsonplaceholder.typicode.com/posts/"
+          action="/luoo-music/cms/journal/upload/image"
           :on-preview="handlePreview"
           :on-remove="handleRemove"
           :before-remove="beforeRemove"
           multiple
           :limit="1"
           :on-exceed="handleExceed"
+          :on-change="handleUploadImgSuccess"
           :file-list="coverUploadFileList"
         >
           <el-button size="small" type="primary" icon="el-icon-receiving"
@@ -86,7 +87,7 @@ export default {
         journal: [],
         lyric: null,
         name: null,
-        picture: null,
+        image: null,
         size: null,
         state: "1",
         tags: [],
@@ -104,10 +105,35 @@ export default {
     };
   },
   filters: {},
-  created() {},
+  created() {
+    this.syncTagDataToComponent();
+  },
   components: {},
   mounted() {},
   methods: {
+    syncTagDataToComponent() {
+      // selectTag
+      for (let i in this.data.tags) {
+        let tag = this.data.tags[i];
+
+        for (let j in this.remoteTagList) {
+          let jId = this.remoteTagList[j].value;
+          if(tag === jId){
+            this.selectTag.push([jId])
+          }
+          for (let k in this.remoteTagList[j].children) {
+            let kId = this.remoteTagList[j].children[k].value;
+            if (tag === this.remoteTagList[j].children[k].value) {
+              this.selectTag.push([jId, kId]);
+            }else{
+              console.log(tag)
+              console.log(this.remoteTagList[j].children[k].value)
+              console.log("-----")
+            }
+          }
+        }
+      }
+    },
     handleTagSelectChange(val) {
       let newTag = [];
       for (let i in val) {
@@ -135,7 +161,13 @@ export default {
     },
     beforeRemove(file, fileList) {
       return this.$confirm(`确定移除 ${file.name}？`);
+    },
+    handleUploadImgSuccess(response, file, fileList){
+      if(response.status === 'success'){
+        this.$message.success("上传成功")
+        this.data.image = response.response.data['fullUrl']
       }
+    },
   }
 };
 </script>

src/views/tag/index.vue

@@ -45,7 +45,7 @@
         </el-form-item>
         <el-form-item>
           <el-select
-            placeholder="选择发布人"
+            placeholder="输入发布人名称"
             size="medium"
             v-model="queryForm.data.creatorId"
           >
@@ -355,6 +355,7 @@ export default {
       let queryParam = {
         ...param
       };
+      queryParam.level = this.tagType
       if (param.timeRange) {
         if (param.timeRange[0]) {
           queryParam.createTimeStart = param.timeRange[0] + " 00:00:00";