|
@@ -0,0 +1,208 @@
|
|
|
+<template>
|
|
|
+ <div class="m-container">
|
|
|
+ <h2>
|
|
|
+ <el-page-header @back="onCancel" content="直播详情"></el-page-header>
|
|
|
+ </h2>
|
|
|
+ <save-form
|
|
|
+ :inline="true"
|
|
|
+ :model="searchForm"
|
|
|
+ @submit="search"
|
|
|
+ @reset="onReSet"
|
|
|
+ >
|
|
|
+ <el-form-item>
|
|
|
+ <el-input
|
|
|
+ v-model.trim="searchForm.search"
|
|
|
+ clearable
|
|
|
+ @keyup.enter.native="search"
|
|
|
+ placeholder="商品编号/名称"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="status">
|
|
|
+ <el-select
|
|
|
+ v-model.trim="searchForm.status"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ placeholder="状态"
|
|
|
+ >
|
|
|
+ <el-option label="上架" :value="1"></el-option>
|
|
|
+ <el-option label="下架" :value="0"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button native-type="submit" type="primary">搜索</el-button>
|
|
|
+ <el-button native-type="reset" type="danger">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </save-form>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+<script>
|
|
|
+import { addLiveGoodsMapper, addGroupMessageList } from "../api";
|
|
|
+import { getLiveGoodsMapperList } from "@/views/liveShopManger/api";
|
|
|
+import pagination from "@/components/Pagination/index";
|
|
|
+export default {
|
|
|
+ name: "eidtPostMsg",
|
|
|
+ components: { pagination },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ searchForm: {
|
|
|
+ search: "",
|
|
|
+ },
|
|
|
+ tableList: [],
|
|
|
+ organList: [],
|
|
|
+ rules: {
|
|
|
+ // 分页规则
|
|
|
+ limit: 10, // 限制显示条数
|
|
|
+ page: 1, // 当前页
|
|
|
+ total: 0, // 总条数
|
|
|
+ page_size: [10, 20, 40, 50], // 选择限制显示条数
|
|
|
+ },
|
|
|
+ addMuiscVisible: false,
|
|
|
+ multipleSelection: [],
|
|
|
+ chioseIdList: [],
|
|
|
+ isNewPage: false,
|
|
|
+ lookVisible: false,
|
|
|
+ activeRow: { sendFlag: false },
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ async getList() {
|
|
|
+ try {
|
|
|
+ const res = await getLiveGoodsMapperList({
|
|
|
+ ...this.searchForm,
|
|
|
+ page: this.rules.page,
|
|
|
+ rows: this.rules.limit,
|
|
|
+ liveId: this.activeRow.roomUid,
|
|
|
+ });
|
|
|
+ this.tableList = res.data.rows;
|
|
|
+ this.rules.total = res.data.total;
|
|
|
+ let idList = this.chioseIdList.map((group) => {
|
|
|
+ return group.id;
|
|
|
+ });
|
|
|
+ this.isNewPage = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.tableList.forEach((course) => {
|
|
|
+ if (idList.indexOf(course.id) != -1) {
|
|
|
+ this.$refs.multipleSelection.toggleRowSelection(course, true);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.isNewPage = false;
|
|
|
+ });
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ search() {
|
|
|
+ this.rules.page = 1;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ onReSet() {
|
|
|
+ this.searchForm.search = "";
|
|
|
+ this.clearCom();
|
|
|
+ this.search();
|
|
|
+ },
|
|
|
+ async submit() {
|
|
|
+ if (!this.chioseIdList || this.chioseIdList.length <= 0) {
|
|
|
+ this.$message.error("请至少选择一件商品");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ try {
|
|
|
+ let idList = this.chioseIdList
|
|
|
+ .map((group) => {
|
|
|
+ return group.id;
|
|
|
+ })
|
|
|
+ .join(",");
|
|
|
+ const res = await addLiveGoodsMapper({
|
|
|
+ liveGoodsIds: idList,
|
|
|
+ liveId: this.activeRow.roomUid,
|
|
|
+ });
|
|
|
+ this.$message.success("添加成功");
|
|
|
+ this.$emit("getList");
|
|
|
+ this.onClose();
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 开始 addGroupMessageList
|
|
|
+ /**
|
|
|
+ *
|
|
|
+
|
|
|
+ */
|
|
|
+ console.log(this.chioseIdList);
|
|
|
+ },
|
|
|
+ handleSelectionChange(val) {
|
|
|
+ if (val.length > 0) {
|
|
|
+ this.chioseIdList = this.chioseIdList.concat(val);
|
|
|
+ this.chioseIdList = this.$helpers.lodash.uniqBy(
|
|
|
+ this.chioseIdList,
|
|
|
+ "id"
|
|
|
+ );
|
|
|
+ } else {
|
|
|
+ if (this.isNewPage) return;
|
|
|
+ let idList = this.chioseIdList.map((group) => {
|
|
|
+ return group.id;
|
|
|
+ });
|
|
|
+ this.$nextTick(() => {
|
|
|
+ let tableIdList = [];
|
|
|
+ this.tableList.forEach((group) => {
|
|
|
+ tableIdList.push(group.id);
|
|
|
+ if (idList.indexOf(group.id) != -1) {
|
|
|
+ this.$refs.multipleSelection.toggleRowSelection(group, false);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.chioseIdList = this.$helpers.lodash.remove(
|
|
|
+ this.chioseIdList,
|
|
|
+ function (item) {
|
|
|
+ return tableIdList.indexOf(item.id) == -1;
|
|
|
+ }
|
|
|
+ );
|
|
|
+ if (this.chioseIdList.length <= 0) {
|
|
|
+ this.clearCom();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ clearCom() {
|
|
|
+ this.chioseIdList = [];
|
|
|
+ this.$refs.multipleSelection.clearSelection();
|
|
|
+ },
|
|
|
+ onTableSelect(rows, row) {
|
|
|
+ let idList = this.chioseIdList.map((group) => {
|
|
|
+ return group.id;
|
|
|
+ });
|
|
|
+ if (idList.indexOf(row.id) != -1) {
|
|
|
+ this.chioseIdList.splice(idList.indexOf(row.id), 1);
|
|
|
+ if (this.chioseIdList.length <= 0) {
|
|
|
+ this.clearCom();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onClose() {
|
|
|
+ this.clearCom();
|
|
|
+ this.lookVisible = false;
|
|
|
+ },
|
|
|
+ openDioag(row) {
|
|
|
+ this.activeRow = row;
|
|
|
+ this.lookVisible = true;
|
|
|
+ console.log(row);
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ onCancel() {
|
|
|
+ this.$router.push("/liveClassManager");
|
|
|
+ this.$store.dispatch("delVisitedViews", this.$route);
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.w100 {
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.btnWrap {
|
|
|
+ justify-content: flex-start;
|
|
|
+}
|
|
|
+</style>
|