1

src/components/education/addSchoolAndCompany.vue

+<template>
+  <div v-loading="loading" class="addLecturer">
+    <div class="head-title">
+      <span @click="CommonJump('schoolAndCompanyList')" class="blue point"
+        >校企合作列表</span
+      >
+      / 校企合作详情
+    </div>
+    <div class="content">
+      <el-form
+        :model="addMsg"
+        :rules="rules"
+        ref="addMsg"
+        label-width="150px"
+        style="width: 600px"
+      >
+        <el-form-item label="学校名称" prop="ShoolName" size="small">
+          <el-input v-model="addMsg.ShoolName"></el-input>
+        </el-form-item>
+        <el-form-item label="关联分销商" prop="AgentIds" size="small">
+          <el-input
+            v-model="DistributorMsg.NickName"
+            style="margin-bottom: 10px"
+            placeholder="输入会员昵称"
+          >
+            <el-button
+              slot="append"
+              icon="el-icon-search"
+              @click="GetDistributorInfoList"
+            ></el-button>
+          </el-input>
+          <el-select v-model="addMsg.AgentIds" multiple placeholder="请选择">
+            <el-option
+              v-for="item in DLoptions"
+              :key="item.UserId"
+              :label="item.NickName"
+              :value="item.UserId"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item class="tooltiplabel" label="LOGO" prop="CoverPhoto">
+          <el-upload
+            class="logo-uploader"
+            :show-file-list="false"
+            action=""
+            :http-request="UploadImage"
+          >
+            <el-image
+              v-if="addMsg.CoverPhoto"
+              :src="addMsg.CoverPhoto"
+              class="logo"
+              fit="cover"
+            />
+            <i v-else class="el-icon-plus logo-uploader-icon"></i>
+          </el-upload>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div style="margin-top: 20px">
+      <el-button size="small" type="primary" @click="submitForm('addMsg')"
+        >保存</el-button
+      >
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      addMsg: {
+        Id: 0,
+        ShoolName: "",
+        CoverPhoto: "",
+        AgentIds: [],
+      },
+
+      rules: {
+        ShoolName: [
+          { required: true, message: "请输入学校名称", trigger: "blur" },
+        ],
+      },
+      DistributorMsg: {
+        AuditStatus: 0,
+        GradeId: -1,
+        Mobile: "",
+        Name: "",
+        NickName: "",
+        Source: 0,
+        UserId: 0,
+        pageIndex: 1,
+        pageSize: 30,
+      },
+      DLoptions: [],
+      loading: false,
+    };
+  },
+  created() {
+    if (this.$route.query.Id) {
+      this.addMsg.Id = this.$route.query.Id;
+      this.getData(this.$route.query.Id);
+      this.GetDistributorInfoList();
+    } else {
+      this.addMsg = {
+        Id: 0,
+        ShoolName: "",
+        CoverPhoto: "",
+        AgentIds: [],
+      };
+    }
+  },
+  methods: {
+    getData(ID) {
+      this.loading = true;
+      this.apipost(
+        "/api/Education/GetEducationSchoolDetails ",
+        {
+          Id: ID,
+        },
+        (res) => {
+          this.loading = false;
+          if (res.data.resultCode == 1) {
+            this.addMsg.ShoolName = res.data.data[0].ShoolName;
+            this.addMsg.CoverPhoto = res.data.data[0].CoverPhoto;
+            let arr = res.data.data[0].AgentIds.split(",");
+            this.addMsg.AgentIds = arr.map((e) => {
+              e = parseInt(e);
+              return e;
+            });
+            // res.data.data[0].AgentList.forEach((e) => {
+            //   e.UserId = e.Id;
+            //   e.NickName = e.UserName;
+            //   let _res = this.DLoptions.filter((_e) => {
+            //     return _e.UserId == e.Id;
+            //   });
+            //   if (_res.length == 0) {
+            //     // this.DLoptions.push(e);
+            //   }
+            //   console.log("134", _res);
+            //   console.log("tag", this.DLoptions, e);
+            // });
+          }
+        }
+      );
+    },
+    //选择图片
+    UploadImage(file) {
+      this.UploadFileToTencent(this.FileType().UserImg, file.file, (res) => {
+        if (res.resultCode == 1) {
+          this.addMsg.CoverPhoto = res.FileUrl;
+        }
+      });
+    },
+    // 获取分销商
+    GetDistributorInfoList() {
+      this.apipost(
+        "/api/user/GetDistributorInfoPageList",
+        this.DistributorMsg,
+        (res) => {
+          if (res.data.resultCode == 1) {
+            this.DLoptions = [...this.DLoptions, ...res.data.data.pageData];
+            this.DLoptions = [...new Set(this.DLoptions)];
+          } else {
+            this.Info(res.data.message);
+          }
+        }
+      );
+    },
+    submitForm(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          this.addMsg.AgentIds = this.addMsg.AgentIds.toString();
+          this.apipost(
+            "/api/Education/AddOrUpdateEduSchool",
+            this.addMsg,
+            (res) => {
+              if (res.data.resultCode == 1) {
+                this.Success(res.data.message);
+                this.$router.push("/schoolAndCompanyList");
+              }
+            }
+          );
+        } else {
+          console.log("error submit!!");
+          return;
+        }
+      });
+    },
+  },
+};
+</script>
+<style scoped>
+.addLecturer .content {
+  background: #fff;
+  margin-top: 10px;
+  padding: 20px;
+  box-sizing: border-box;
+}
+.logo-uploader .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+.logo-uploader .el-upload:hover {
+  border-color: #409eff;
+}
+.logo-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 178px;
+  height: 178px;
+  line-height: 178px;
+  text-align: center;
+  border: 1px dashed #111;
+}
+.logo {
+  width: 178px;
+  height: 178px;
+  display: block;
+}
+</style>

src/components/education/schoolAndCompanyList.vue

+<template>
+  <div class="lecturermanage">
+    <div class="el-card__header">
+      <span>校企合作列表</span>
+      <div style="display: flex; flex-direction: row; align-items: center">
+        <el-button type="primary" class="el-button--small" @click="addSchool"
+          >新增</el-button
+        >
+        <el-button
+          type="primary"
+          class="el-button--small"
+          :disabled="this.sels.length == 0"
+          @click="delete_beach"
+          >批量删除</el-button
+        >
+      </div>
+    </div>
+    <div class="content">
+      <div style="display: flex; flex-direction: row; align-items: center">
+        <div class="block">
+          <div class="searchInput" style="width: 200px">
+            <el-input
+              style="display: inline-block; width: 170px; height: 30px"
+              placeholder="请输入学校名称搜索"
+              v-model="msg.ShoolName"
+              size="small"
+              @clear="getList"
+              @keyup.enter.native="getList"
+              clearable
+            >
+            </el-input>
+            <span
+              @click="getList"
+              class="el-icon-search"
+              style="
+                color: #979dad;
+                font-size: 14px;
+                position: relative;
+                top: 1px;
+              "
+            ></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div style="padding: 20px; background: #fff">
+      <el-table
+        :data="tableData"
+        header-cell-class-name="headClass"
+        style="width: 100%"
+        border
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column
+          type="selection"
+          width="55"
+          style="text-align: center"
+        ></el-table-column>
+
+        <el-table-column prop="Id" label="ID" width="100"> </el-table-column>
+        <el-table-column prop="ShoolName" label="学校名称"> </el-table-column>
+        <el-table-column prop="" label="LOGO">
+          <template slot-scope="scope">
+            <div
+              class="app-image"
+              :style="{
+                backgroundImage: 'url(' + scope.row.CoverPhoto + ')',
+                backgroundSize: 'cover',
+              }"
+            ></div>
+            <!-- <div flex="dir:left cross:center">
+              {{ scope.row.Name }}
+            </div> -->
+          </template>
+        </el-table-column>
+        <el-table-column prop="UserCount" label="下级用户(数量)">
+          <template slot-scope="scope">
+            <div class="point" @click="showdig(scope.row.Id)">
+              {{ scope.row.UserCount }}
+            </div>
+          </template>
+        </el-table-column>
+
+        <el-table-column fixed="right" label="操作" width="180">
+          <template slot-scope="scope">
+            <el-tooltip
+              class="item"
+              effect="dark"
+              content="编辑"
+              placement="top"
+            >
+              <img
+                src="../../assets/img/setup/edit.png"
+                alt=""
+                class="imgstyle"
+                @click="Edit(scope.row)"
+              />
+            </el-tooltip>
+            <el-tooltip
+              class="item"
+              effect="dark"
+              content="删除"
+              placement="top"
+            >
+              <img
+                src="../../assets/img/setup/del.png"
+                alt=""
+                class="imgstyle"
+                @click="delete_b(scope.row)"
+              />
+            </el-tooltip>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        style="text-align: right"
+        background
+        @current-change="handleCurrentChange"
+        :page-size="msg.pageSize"
+        layout="prev, pager, next"
+        :current-page.sync="msg.pageIndex"
+        :total="count"
+      >
+      </el-pagination>
+    </div>
+    <el-dialog title="下级用户" :visible.sync="showDialog" width="800px">
+      <div style="padding: 20px; background: #fff">
+        <el-table :data="digtable" header-cell-class-name="headClass" border>
+          <el-table-column prop="Id" label="ID" width="100"> </el-table-column>
+          <el-table-column prop="Name" width="240px" label="名称">
+            <template slot-scope="scope">
+              <div
+                class="app-image"
+                :style="{
+                  backgroundImage: 'url(' + scope.row.Photo + ')',
+                  backgroundSize: 'cover',
+                }"
+              ></div>
+              <div>
+                {{ scope.row.Name }}
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column prop="MemberGradeName" label="会员类型">
+          </el-table-column>
+          <el-table-column prop="CreateDate" label="加入时间" width="200px">
+          </el-table-column>
+        </el-table>
+        <el-pagination
+          style="text-align: right"
+          background
+          @current-change="dighandleCurrentChange"
+          :page-size="digMsg.pageSize"
+          layout="prev, pager, next"
+          :current-page.sync="digMsg.pageIndex"
+          :total="digcount"
+          v-if="digcount > 0"
+        >
+        </el-pagination>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="showDialog = false" type="primary">关闭</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "schoolAndCompanyList",
+  data() {
+    return {
+      msg: {
+        pageIndex: 1,
+        pageSize: 20,
+        ShoolName: "",
+      },
+      tableData: [],
+      count: 0,
+      loading: false,
+      sels: [], //多选框
+      showDialog: false,
+      digMsg: {
+        EndTime: "",
+        Id: 0,
+        MemberGrade: 0,
+        Moblie: "",
+        Name: "",
+        Source: 0,
+        StartTime: "",
+        pageIndex: 1,
+        pageSize: 10,
+        EduSchoolId: 0,
+      },
+      digtable: [],
+      digcount: 0,
+    };
+  },
+  created() {
+    this.getDateList(); //获取分页
+  },
+  methods: {
+    handleSelectionChange(val) {
+      this.sels = val;
+      console.log(138, val);
+    },
+    getDateList() {
+      let msg = JSON.parse(JSON.stringify(this.msg));
+      if (msg.ID == "") {
+        msg.ID = 0;
+      }
+      this.loading = true;
+      this.apipost("/api/Education/GetEducationSchoolPageList", msg, (res) => {
+        this.loading = false;
+        if (res.data.resultCode == 1) {
+          this.tableData = res.data.data.pageData;
+          this.count = res.data.data.count;
+        } else {
+          this.Info(res.data.message);
+        }
+      });
+    },
+
+    addSchool() {
+      this.$router.push("/addSchoolAndCompany");
+    },
+    Edit(row) {
+      this.$router.push({
+        path: "addSchoolAndCompany",
+        query: {
+          Id: row.Id,
+        },
+      });
+    },
+    delete_b(row) {
+      let that = this;
+      that.Confirm("是否删除?", function () {
+        that.apipost("/api/Education/DelSchoolInfo", { Ids: row.Id }, (res) => {
+          if (res.data.resultCode == 1) {
+            that.Success(res.data.message);
+            that.getDateList();
+          } else {
+            that.Error(res.data.message);
+          }
+        });
+      });
+    },
+    //批量删除
+    delete_beach() {
+      let ids = this.sels
+        .map((e) => {
+          return e.Id;
+        })
+        .toString();
+      let that = this;
+      that.Confirm("是否删除?", function () {
+        that.apipost("/api/Education/DelSchoolInfo", { Ids: ids }, (res) => {
+          if (res.data.resultCode == 1) {
+            that.Success(res.data.message);
+            that.getDateList();
+          } else {
+            that.Error(res.data.message);
+          }
+        });
+      });
+    },
+    getList() {
+      this.msg.pageIndex = 1;
+      this.getDateList();
+    },
+
+    handleCurrentChange(val) {
+      this.msg.pageIndex = val;
+      this.getDateList();
+    },
+    getMemberUserPageList() {
+      this.apipost(
+        "/api/Education/GetMemberUserPageList",
+        this.digMsg,
+        (res) => {
+          if (res.data.resultCode == 1) {
+            this.digtable = res.data.data.pageData;
+            this.count = res.data.data.count;
+          } else {
+            this.Info(res.data.message);
+          }
+        }
+      );
+    },
+    showdig(id) {
+      this.showDialog = true;
+      this.digMsg.EduSchoolId = id;
+      this.getMemberUserPageList();
+    },
+    dighandleCurrentChange(val) {
+      this.digMsg.pageIndex = val;
+      this.getMemberUserPageList();
+    },
+  },
+};
+</script>
+
+<style scoped>
+.lecturermanage .el-card__header {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  background: #fff;
+}
+.lecturermanage .el-button--small {
+  padding: 9px 15px;
+}
+.lecturermanage .content .searchInput {
+  border: 1px solid #dcdfe6;
+  border-radius: 4px;
+  /*margin-left: 10px;*/
+}
+.lecturermanage .content .searchInput .el-input__inner {
+  border: none;
+  outline: none;
+  height: 30px;
+  line-height: 30px;
+}
+.lecturermanage .content .searchInput {
+  line-height: normal;
+  display: inline-table;
+  border-collapse: separate;
+  border-spacing: 0;
+  width: 250px;
+}
+.lecturermanage .content {
+  background: #fff;
+  margin-top: 10px;
+  padding: 15px;
+  box-sizing: border-box;
+}
+.lecturermanage .el-tag {
+  margin-right: 5px;
+}
+.lecturermanage .app-image {
+  background-position: center center;
+  width: 50px;
+  height: 50px;
+  border-radius: 0%;
+  float: left;
+  margin-right: 8px;
+}
+.point {
+  color: #409eff;
+  cursor: pointer;
+}
+</style>