GCLS_Page_TC/src/views/teacher-devEntering/index.vue

<template>
  <!-- 教研中心录入 -->
  <div class="teacher-devEntering">
    <div class="nav">
      <Header />
    </div>
    <Nav />
    <div class="top">
      <div class="seek" @keydown="downSeekdata">
        <el-input
          v-model="keyWord"
          @change="keyWord = keyWord.trim()"
          style="width: 400px"
          placeholder="请输入内容"
        ></el-input>
        <img
          @click="seekData"
          src="../../assets/teacherdev/Group2149.png"
          alt=""
        />
      </div>
      <div class="btn">
        <!-- <el-button type="primary">批量上传</el-button> -->
        <div style="margin-right: 23px">
          <!-- 
            :fileList="fileList"
           -->
          <Upload
            type="批量上传"
            :changeFillId="changeFillId"
            :filleNumber="20"
            :accept="'.doc,.docx,.xls,.xlsx,.pdf,.ppt,.pptx'"
          />
        </div>
        <el-button type="primary" @click="newDocument">新建文档</el-button>
      </div>
    </div>
    <div class="table" v-loading="loading">
      <el-table :data="tableData.data" stripe style="width: 100%">
        <el-table-column
          label="文档名称"
          prop="name"
          width="300"
        ></el-table-column>
        <el-table-column
          label="文档类型"
          prop="type"
          width="150"
          :formatter="handlefileType"
        ></el-table-column>
        <el-table-column
          label="发布时间"
          prop="updateTime"
          width="200"
        ></el-table-column>
        <el-table-column
          :formatter="handledownload"
          label="下载"
          prop="download"
          width="150"
        ></el-table-column>
        <el-table-column
          label="状态"
          prop="status"
          width="150"
          :formatter="handleStatus"
        ></el-table-column>
        <el-table-column label="操作" prop>
          <template slot-scope="scope">
            <el-button @click="handleEdit(scope.row, scope.$index)" type="text"
              >编辑</el-button
            >
            <el-button @click="handleDel(scope.row)" type="text"
              >删除</el-button
            >
            <el-button
              v-if="scope.row.status != 4"
              @click="up(scope.row)"
              type="text"
              >上架</el-button
            >
            <el-button
              v-if="scope.row.status != 3"
              @click="down(scope.row)"
              type="text"
              >下架</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        @current-change="handleCurrentChange"
        layout="prev, pager, next"
        :page-size="pageSize"
        :total="tableData.total"
        :current-page="pageNum"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
import Header from "@/components/Header";
import Nav from "@/components/teacher-devEntering/Nav";
import Upload from "@/components/Upload";
import { getToken } from "@/utils/auth";

import {
  VerifyLogin,
  materiallist,
  materialdelete,
  materialinsert,
  attachmentinsert,
  materialoutOfStockAction,
  materialinStockAction,
} from "@/api/api";
import Cookies from "js-cookie";

export default {
  name: "teacher-devEntering",
  components: {
    Header,
    Nav,
    Upload,
  },
  data() {
    return {
      tableData: [
        {
          name: "教师培训公开课1",
          type: "ppt",
          creadTime: "2021-10-10 15:30",
          download: 1,
        },
        {
          name: "教师培训公开课2",
          type: "pdf",
          creadTime: "2021-10-10 15:30",
          download: 0,
        },
      ],
      fileList: null,
      loading: false,
      keyWord: "",
      pageNum: 1,
      pageSize: 10,
    };
  },
  methods: {
    // 批量上传
    changeFillId(file, fileList) {
      this.loading = true;
      let name = file.file_name.split(".")[0];
      let type = file.file_name.split(".")[1];
      let tag = ["downloadable", "TEXTBOOK", type];
      let attachmentList = [];
      attachmentList.push({
        name: file.file_name,
        fileId: file.file_id,
        fileType: type,
      });
      attachmentinsert({
        attachmentList: attachmentList,
        type: "3",
        tenantId: "2021052017-HFTZIRVKWOWPAUU",
      })
        .then((res) => {
          materialinsert({
            name: name,
            price: "-1",
            teacherList: [""],
            tenantId: "2021052017-HFTZIRVKWOWPAUU",
            tagList: tag,
            attachmentIdList: res.data.attachmentIdList,
          })
            .then((ress) => {
              this.loading = false;
              this.getdata();
            })
            .catch((res) => {
              this.loading = false;
            });
        })
        .catch((res) => {
          this.loading = false;
        });
      //       let fileList1 = JSON.parse(JSON.stringify(fileList));
      // this.fileList = fileList1;
    },
    // 搜索
    seekData() {
      this.pageNum = 1;
      this.getdata();
    },
    downSeekdata(e) {
      if (e.keyCode == 13) {
        this.pageNum = 1;
        this.getdata();
      }
    },
    // 换页
    async handleCurrentChange(pagesize) {
      this.pageNum = pagesize;
      this.getdata();
    },
    // 编辑
    handleEdit(item) {
      if (item.status == 4) {
        this.$message.warning("上架状态下不可以进行编辑操作");
        return;
      }
      this.$router.push({
        path: "/creadDocument",
        query: {
          materialId: item.id,
        },
      });
    },
    // 删除
    handleDel(item) {
      if (item.status == 4) {
        this.$message.warning("上架状态下不可以进行删除操作");
        return;
      }
      this.$confirm("确定要删除此学习资料吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.loading = true;
          materialdelete({
            id: `${item.id}`,
          })
            .then((res) => {
              this.getdata();
              this.$message({
                type: "success",
                message: "删除成功",
              });
            })
            .catch((res) => {
              this.loading = false;
            });
        })
        .catch(() => {
          this.loading = false;
        });
    },
    // 上架
    up(item) {
      if (item.status == 4) {
        this.$message.warning("该课程已经上架了");
        return;
      }
      if (!item.price || !item.teacher[0]) {
        this.$message.warning("请先去完善信息再上架");
        return;
      }
      this.loading = true;

      materialinStockAction({
        id: `${item.id}`,
      })
        .then((res) => {
          this.getdata();
          this.$message({
            type: "success",
            message: "上架成功",
          });
        })
        .catch(() => {
          this.loading = false;
        });
    },
    // 下架
    down(item) {
      if (item.status == 3) {
        this.$message.warning("该课程已经下架了");
        return;
      }
      this.loading = true;

      materialoutOfStockAction({
        id: `${item.id}`,
      })
        .then((res) => {
          this.getdata();
          this.$message({
            type: "success",
            message: "下架成功",
          });
        })
        .catch(() => {
          this.loading = false;
        });
    },
    // 处理下载
    handledownload(row) {
      let index = row.tag.indexOf("downloadable");
      if (index != -1) {
        return "开启";
      } else {
        return "关闭";
      }
    },
    // 处理文档类型
    handlefileType(row) {
      let index = row.tag.indexOf("downloadable");
      if (index != -1) {
        return row.tag[2];
      } else {
        return row.tag[1];
      }
    },
    // 处理发布状态
    handleStatus(row) {
      if (row.status == 4) {
        return "已上架";
      } else if (row.status == 3) {
        return "已下架";
      }
    },
    // 新建文档
    newDocument() {
      this.$router.push({ path: "/creadDocument" });
    },
    getdata() {
      this.loading = true;
      materiallist({
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        keyWord: this.keyWord,
        isSelectForUpdate: true,
        orderType: "DESC",
        orderColumn: "2",
      })
        .then((res) => {
          this.tableData = res.data;
          this.loading = false;
        })
        .catch(() => {
          this.loading = false;
        });
    },
  },
  mounted() {
    this.loading = true;
    let userInfor = JSON.parse(getToken());
    let userCode = "",
      userType = "",
      sessionId = "";
    if (userInfor) {
      userCode = userInfor.user_code;
      userType = userInfor.user_type;
      sessionId = userInfor.session_id;
    }
    // 验证登录拿到JSESSIONID放到cookies中后面的接口用来验证用户身份
    VerifyLogin({
      userCode,
      userType,
      sessionId,
    })
      .then((res) => {
        if (res.code != -1) {
          Cookies.set("JSESSIONID", res.data.JSESSSIONID);
          this.getdata();
        }
      })
      .catch(() => {
        this.loading = false;
      });
  },
};
</script>

<style lang="scss" scoped>
.teacher-devEntering {
  .nav {
    height: 64px;
    background: #424141;
  }
  .top {
    width: 1200px;
    margin: 0 auto;
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    padding: 0 90px;
    .seek {
      position: relative;
      img {
        cursor: pointer;
        width: 19px;
        position: absolute;
        right: 10px;
        top: 10px;
      }
    }
    .btn {
      display: flex;
      text-align: right;
    }
  }
  .table {
    width: 1200px;
    margin: 0 auto;
    margin-top: 50px;
  }
}
</style>