|
@@ -0,0 +1,230 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-alert title="教材信息" :closable="false" class="alert" type="info" />
|
|
|
+ <el-form
|
|
|
+ :model="form"
|
|
|
+ label-width="120px"
|
|
|
+ class="form"
|
|
|
+ ref="form"
|
|
|
+ >
|
|
|
+ <el-form-item
|
|
|
+ label="教材名称"
|
|
|
+ prop="name"
|
|
|
+ :rules="[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请输入教材名称',
|
|
|
+ trigger: 'blur',
|
|
|
+ },
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ <el-input v-model="form.name" style="width: 100%"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ label="适用分部"
|
|
|
+ prop="organId"
|
|
|
+ :rules="[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请选择适用分部',
|
|
|
+ trigger: 'change',
|
|
|
+ },
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ <select-all
|
|
|
+ v-model.trim="form.organId"
|
|
|
+ style="width: 100%"
|
|
|
+ class="organSelect"
|
|
|
+ filterable
|
|
|
+ placeholder="请选择分部"
|
|
|
+ multiple
|
|
|
+ clearable
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in selects.branchs"
|
|
|
+ :key="index"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ ></el-option>
|
|
|
+ </select-all>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ label="音源设置"
|
|
|
+ prop="soundResource"
|
|
|
+ :rules="[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请选择音源设置',
|
|
|
+ trigger: 'change',
|
|
|
+ },
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ <el-select filterable placeholder="请选择音源设置" clearable v-model="form.soundResource" style="width: 100% !important">
|
|
|
+ <el-option label="NotePerformer音源" value="NOTEPERFORMER"></el-option>
|
|
|
+ <el-option label="标准音源" value="TANG"></el-option>
|
|
|
+ <el-option label="官方音源" value="OFFICIAL"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ label="教材封面图"
|
|
|
+ prop="coverImg"
|
|
|
+ :rules="[
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '请上传教材封面图',
|
|
|
+ trigger: 'blur',
|
|
|
+ },
|
|
|
+ ]"
|
|
|
+ label-width="120px"
|
|
|
+ >
|
|
|
+ <upload
|
|
|
+ class="uploadImg"
|
|
|
+ v-model="form.coverImg"
|
|
|
+ :imageWidthM="350"
|
|
|
+ :imageHeightM="140"
|
|
|
+ ref="uploadImg"
|
|
|
+ ></upload>
|
|
|
+ <p style="color: red">
|
|
|
+ 请上传350*140像素,大小2M以内,格式为jpg、png、gif图片
|
|
|
+ </p>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import Upload from "@/components/Upload/index";
|
|
|
+import {
|
|
|
+ addsysMusicScore,
|
|
|
+ getSysMusicScoreDetail,
|
|
|
+ resetsysMusicScore,
|
|
|
+} from "../api";
|
|
|
+export default {
|
|
|
+ props: ["activeRow"],
|
|
|
+ components: {
|
|
|
+ Upload,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ form: {
|
|
|
+ organId: [],
|
|
|
+ name: null,
|
|
|
+ coverImg: "",
|
|
|
+ soundResource: null,
|
|
|
+ sysMusicScoreCategoriesList: [],
|
|
|
+ delCategoriesIds: [],
|
|
|
+ },
|
|
|
+ index: 0,
|
|
|
+ treeProps: {
|
|
|
+ children: "sysMusicScoreCategoriesList",
|
|
|
+ label: "name",
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ async mounted() {
|
|
|
+ await this.$store.dispatch("setBranchs");
|
|
|
+ if (this.activeRow?.id) {
|
|
|
+ try {
|
|
|
+ const res = await getSysMusicScoreDetail({ id: this.activeRow.id });
|
|
|
+ this.form.name = res.data.name;
|
|
|
+ this.form.organId = res.data.organId.split(",").map((item) => {
|
|
|
+ return Number(item);
|
|
|
+ });
|
|
|
+ this.form.coverImg = res.data.coverImg;
|
|
|
+ this.form.soundResource = res.data.soundResource;
|
|
|
+ this.form.sysMusicScoreCategoriesList =
|
|
|
+ this.recursionDate(res.data.sysMusicScoreCategoriesList) || [];
|
|
|
+ } catch (e) {}
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 递归遍历数组
|
|
|
+ recursionDate(arr) {
|
|
|
+ // 这里来了
|
|
|
+ if (arr.length > 0) {
|
|
|
+ let newArr = [];
|
|
|
+ for (let i = 0; i < arr.length; i++) {
|
|
|
+ let obj = {
|
|
|
+ ...arr[i],
|
|
|
+ index: arr[i].id,
|
|
|
+ };
|
|
|
+
|
|
|
+ if (
|
|
|
+ arr[i].sysMusicScoreCategoriesList &&
|
|
|
+ arr[i].sysMusicScoreCategoriesList.length > 0
|
|
|
+ ) {
|
|
|
+ obj.sysMusicScoreCategoriesList = this.recursionDate(
|
|
|
+ arr[i].sysMusicScoreCategoriesList
|
|
|
+ );
|
|
|
+ }
|
|
|
+
|
|
|
+ newArr.push(obj);
|
|
|
+ }
|
|
|
+
|
|
|
+ return newArr;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ addSubmit() {
|
|
|
+ this.$refs.form.validate(async (flag) => {
|
|
|
+ if (flag) {
|
|
|
+ let { organId, delCategoriesIds, ...rest } = this.form;
|
|
|
+ let obj = {
|
|
|
+ ...rest,
|
|
|
+ organId: organId.join(","),
|
|
|
+ delCategoriesIds: delCategoriesIds.join(","),
|
|
|
+ };
|
|
|
+ try {
|
|
|
+ if (this.activeRow?.id) {
|
|
|
+ obj.id = this.activeRow.id;
|
|
|
+ await resetsysMusicScore(obj);
|
|
|
+ this.$message.success("修改成功");
|
|
|
+ this.$emit("getList");
|
|
|
+ this.$emit("close");
|
|
|
+ } else {
|
|
|
+ await addsysMusicScore(obj);
|
|
|
+ this.$message.success("添加成功");
|
|
|
+ this.$emit("getList");
|
|
|
+ this.$emit("close");
|
|
|
+ }
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ uploadImg() {
|
|
|
+ this.$refs.uploadImg.$refs.upload.submit();
|
|
|
+ },
|
|
|
+ },
|
|
|
+ computed: {},
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.alert {
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+.form {
|
|
|
+ /deep/.el-form-item {
|
|
|
+ margin-right: 0 !important;
|
|
|
+ }
|
|
|
+}
|
|
|
+.addCateBtn {
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.custom-tree-node {
|
|
|
+ .title {
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+ font-size: 14px;
|
|
|
+ i {
|
|
|
+ // font-size: 20px;
|
|
|
+ margin-left: 5px;
|
|
|
+ }
|
|
|
+}
|
|
|
+.uploadImg {
|
|
|
+ /deep/.avatar {
|
|
|
+ width: 350px;
|
|
|
+ height: 140px;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|