From 6f64327b84792369ca68d70e3ed270ac6040bae3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?061900408=E9=BE=9A=E5=98=89=E6=80=A1?= <991052946@qq.com>
Date: Tue, 14 Jun 2022 22:41:23 +0800
Subject: [PATCH] =?UTF-8?q?Day5=20=E9=BE=9A=E5=98=89=E6=80=A1=20=E2=80=9C?=
 =?UTF-8?q?=E8=B4=A6=E5=8F=B7=E7=AE=A1=E7=90=86=E2=80=9D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/ManageView/ManageAccountTable.vue   | 613 ++++++++++++++++++
 1 file changed, 613 insertions(+)
 create mode 100644 vue/src/views/ManageView/ManageAccountTable.vue

diff --git a/vue/src/views/ManageView/ManageAccountTable.vue b/vue/src/views/ManageView/ManageAccountTable.vue
new file mode 100644
index 0000000..866b5ae
--- /dev/null
+++ b/vue/src/views/ManageView/ManageAccountTable.vue
@@ -0,0 +1,613 @@
+<template>
+  <div style="width: 100%" class="ManageCompititionTable">
+    <el-card style="margin-top: 15px">
+      <el-form
+        :inline="true"
+        :model="formInline"
+        ref="formInline"
+        :rules="rules"
+        style="margin-top: 15px"
+      >
+        <el-form-item style="float: left">
+          <el-button @click="release" type="primary" plain round size="medium"
+            >新增用户1</el-button
+          >
+        </el-form-item>
+
+        <el-form-item prop="param1">
+          <el-input
+            v-model="formInline.param1"
+            placeholder="请输入要查询的内容"
+            size="medium"
+          ></el-input>
+        </el-form-item>
+        <!-- <el-form-item label="地址：" prop="param2">
+          <el-select v-model="formInline.param2" placeholder="条件2">
+            <el-option label="选项1" value="item1"></el-option>
+            <el-option label="选项2" value="item2"></el-option>
+          </el-select>
+        </el-form-item> -->
+        <el-form-item>
+          <!-- <el-button type="primary" round @click="onSubmit('formInline')"
+            >查询</el-button -->
+          <el-button
+            style="position: relative; right: 25px"
+            type="primary"
+            icon="el-icon-search"
+            plain
+            round
+            size="medium"
+            @click="onSubmit('formInline')"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card style="margin-top: 20px">
+      <el-table
+        :data="competeList"
+        stripe
+        border
+        style="width: 100%"
+        @sort-change="onSortChange"
+      >
+        <!-- <el-table-column label="序号" width="50" align="center">
+          <template slot-scope="scope">
+            <span>{{
+              (this.currentPage - 1) * this.pageSize + scope.$index + 1
+            }}</span>
+          </template>
+        </el-table-column> -->
+        <el-table-column
+          label="序号"
+          width="100"
+          align="center"
+          type="index"
+          :index="indexMethod"
+          header-align="center"
+        >
+        </el-table-column>
+
+        <!-- <el-table-column prop="competitionId" label="竞赛id" width="80"> -->
+        <!-- <template slot-scope="scope"> -->
+        <!-- <span style="margin-left: 10px">{{ item.competitionId }}</span> -->
+        <!-- </template> -->
+
+        <!-- </el-table-column> -->
+        <el-table-column
+          prop="userNo"
+          label="账号id"
+          width="145"
+          align="center"
+          header-align="center"
+          sortable="custom"
+          :sort-orders="['1', '2']"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="realName"
+          label="真实姓名"
+          width="145"
+          align="center"
+          header-align="center"
+        >
+        </el-table-column>
+        <!-- <el-table-column
+          prop="authorities"
+          label="权限"
+          width="250"
+          align="center"
+          header-align="center"
+          sortable="custom"
+          :sort-orders="['1', '2']"
+        >
+        </el-table-column> -->
+        <el-table-column
+          prop="roles"
+          label="角色"
+          width="350"
+          align="center"
+          header-align="center"
+        >
+        </el-table-column>
+        <el-table-column
+          label="操作"
+          width="450"
+          align="center"
+          header-align="center"
+        >
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              @click="handleDetail(scope.row.competitionId)"
+              round
+              >详细信息
+            </el-button>
+            <el-button
+              size="mini"
+              @click="handleEdit(scope.row.competitionId)"
+              round
+              plain
+              >编辑信息
+            </el-button>
+            <el-button
+              type="danger"
+              size="mini"
+              @click="handleDelete(scope.row.competitionId)"
+              round
+              plain
+              >删除信息
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <br />
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        @prev-click="handlePrev"
+        @next-click="handleNext"
+        background
+        :current-page="currentPage"
+        :page-sizes="[10, 20, 30, 40]"
+        :page-size="pageSize"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="pageTotal"
+      >
+      </el-pagination>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "PageTable",
+  data() {
+    return {
+      formInline: {
+        param1: "",
+        param2: "选项1",
+      },
+      // tableData: [
+      //   {
+      //     // no: "1",
+      //     // title: "2022福州大学数学竞赛校赛",
+      //     // num: "135",
+      //     competitionId: "",
+      //     title: "",
+      //     teacherName: "",
+      //     count: "",
+      //   },
+      // ],
+
+      rules: {
+        param1: [
+          { required: false, message: "请输入", trigger: "blur" },
+          {
+            min: 0,
+            max: 10,
+            message: "长度在 0 到 10 个字符",
+            trigger: "blur",
+          },
+        ],
+      },
+      type: 0,
+      currentPage: 1,
+      pageSize: 10,
+      pageTotal: 8,
+      dialogFormVisible: false,
+      form: {
+        // no: "0",
+        // title: "2022福州大学数学竞赛校赛",
+        // num: "135",
+        // index: 0,
+      },
+
+      //   competitionId: ''
+      // title: '',
+      // teacherName: '',
+      // count: ''
+      competeList: [],
+    };
+  },
+
+  created() {
+    // this.getCompeteList();
+  },
+
+  mounted() {
+    this.getCompeteList();
+    console.log("this.competeList111");
+    console.log(this.competeList);
+    console.log("this.competeList111");
+  },
+
+  methods: {
+    //点击跳转
+    //序号
+    indexMethod(index) {
+      return (this.currentPage - 1) * this.pageSize + index + 1;
+    },
+    //发布竞赛功能
+    release() {
+      this.$router.replace("/PageFormsSignup");
+    },
+    //查询竞赛功能
+    onSubmit(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          if (this.formInline.param1 == "") {
+            this.getCompeteList();
+          } else {
+            this.$axios({
+              method: "get",
+              url: "http://124.220.174.249:8085/backend/admin/showAllCompetition",
+              headers: { token: localStorage.token },
+              params: {
+                // title: this.formInline.param1, //获取查询内容
+                // teacherNo: localStorage.getItem("userId"),
+                page: 1,
+                limit: 10,
+              },
+            })
+              .then((res) => {
+                console.log("5");
+                console.log(res);
+                if (res.data.code == "200") {
+                  this.competeList = res.data.data;
+                  this.pageTotal = Number(res.data.details.infoCount); //显示当前条数
+                  this.handleCurrentChange(1);
+                  console.log(res.data.data);
+                }
+              })
+              .catch((err) => {
+                console.log(err);
+              });
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    // //退出登录
+    // exit() {
+    //   // this.$router.replace("/");
+    //   this.$axios({
+    //     method: "post",
+    //     url: "http://124.220.174.249:8085/backend/logout",
+    //     headers: { token: localStorage.token },
+    //   })
+    //     .then((res) => {
+    //       console.log(res);
+    //       if (res.data.code == "200") {
+    //         console.log("返回登录界面");
+    //         this.$router.replace("/");
+    //       }
+    //     })
+    //     .catch((err) => {
+    //       return this.$message.error("退出失败");
+    //       console.log("退出失败");
+    //     });
+    // },
+    //查看竞赛详情
+    handleDetail(id) {
+      console.log("id");
+      console.log(id);
+      console.log("id");
+      this.$router.push({ path: "/PageFormsDetail", query: { id: id } });
+      // this.form.index = index + (this.currentPage - 1) * this.pageSize;
+      // this.form.no = row.no;
+      // this.form.title = row.title;
+      // this.form.num = row.num;
+      // this.dialogFormVisible = true;
+    },
+    //修改竞赛信息
+    handleEdit(id) {
+      this.$router.push({ path: "/PageFormsModify", query: { id: id } });
+      // this.form.index = index + (this.currentPage - 1) * this.pageSize;
+      // this.form.no = row.no;
+      // this.form.title = row.title;
+      // this.form.num = row.num;
+      // this.dialogFormVisible = true;
+    },
+    //删除竞赛信息
+    handleDelete(id) {
+      this.$router.push({ path: "/PageFormsDelete", query: { id: id } }); // 通过this.$route.query.id获得id
+      // this.tableData.splice(index + (this.currentPage - 1) * this.pageSize, 1);
+      // this.pageTotal = this.tableData.length;
+      // this.$message({
+      //   message: "删除" + row.name + "成功！",
+      //   type: "success",
+      // });
+      //确定删除
+    },
+    handleDelete(id) {
+      this.$confirm("此操作将永久删除该信息, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.$axios({
+            method: "post",
+            url: "http://124.220.174.249:8085/backend/teacher/deleteCompetition",
+            headers: { token: localStorage.token },
+            data: {
+              competitionId: id,
+            },
+          })
+            .then((res) => {
+              console.log("5");
+              console.log(res);
+              if (res.data.code == "200") {
+                console.log("删除成功");
+                this.getCompeteList();
+                // this.$router.replace("/PageTable");
+                // this.$notify({
+                //   title: "竞赛删除成功",
+                //   message: "返回大厅！",
+                //   type: "success",
+                // });
+              }
+            })
+            .catch((err) => {
+              console.log(err);
+              console.log("删除失败");
+            });
+          this.$message({
+            type: "success",
+            message: "删除成功!",
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+      // this.$axios
+      //   .post("http://47.113.195.148:8085/backend/teacher/deleteCompetition", {
+      //     competitionId: this.queryInfo.competeId,
+      //     //  competitionId: "11"
+      //   })
+    },
+
+    //每页条数改变
+    handleSizeChange(size) {
+      this.pageSize = size;
+      console.log("this.pageSize");
+      console.log(this.pageSize);
+      console.log("this.pagesize");
+      if (this.formInline.param1 == "") {
+        this.$axios({
+          method: "get",
+          url: "http://124.220.174.249:8085/backend/admin/showAllCompetition",
+          headers: { token: localStorage.token },
+          params: {
+            // teacherNo: localStorage.getItem("userId").replace(/\"/g, ""), //去掉双引号
+            page: this.currentPage,
+            limit: this.pageSize,
+            type: this.type,
+          },
+        })
+          .then((res) => {
+            console.log(res);
+            if (res.data.code == "200") {
+              this.competeList = res.data.data;
+              console.log("res.data.data");
+              console.log(this.competeList);
+              console.log("res.data.data");
+              this.pageTotal = Number(res.data.details.infoCount);
+            }
+          })
+          .catch((err) => {
+            return this.$message.error("获取竞赛列表信息失败！");
+          });
+      } else {
+        this.$axios({
+          method: "get",
+          url: "http://124.220.174.249:8085/backend/teacher/searchCompetition",
+          headers: { token: localStorage.token },
+          params: {
+            title: this.formInline.param1, //获取查询内容
+            teacherNo: localStorage.getItem("userId"),
+            page: this.currentPage,
+            limit: this.pageSize,
+          },
+        })
+          .then((res) => {
+            console.log("5");
+            console.log(res);
+            if (res.data.code == "200") {
+              this.competeList = res.data.data;
+              this.pageTotal = Number(res.data.details.infoCount); //显示当前条数
+              console.log(res.data.data);
+            }
+          })
+          .catch((err) => {
+            console.log(err);
+          });
+      }
+    },
+    //当前页改变会触发？
+    handleCurrentChange(currentPage) {
+      this.currentPage = currentPage;
+      if (this.formInline.param1 == "") {
+        this.$axios({
+          method: "get",
+          url: "http://124.220.174.249:8085/backend/admin/showAllCompetition",
+          headers: { token: localStorage.token },
+          params: {
+            // teacherNo: localStorage.getItem("userId").replace(/\"/g, ""), //去掉双引号
+            page: this.currentPage,
+            limit: this.pageSize,
+            type: this.type,
+          },
+        })
+          .then((res) => {
+            console.log(res);
+            if (res.data.code == "200") {
+              this.competeList = res.data.data;
+              console.log("res.data.data222");
+              console.log(this.competeList);
+              console.log("res.data.data222");
+              this.pageTotal = Number(res.data.details.infoCount);
+            }
+          })
+          .catch((err) => {
+            return this.$message.error("获取竞赛列表信息失败！");
+          });
+      } else {
+        this.$axios({
+          method: "get",
+          url: "http://124.220.174.249:8085/backend/teacher/searchCompetition",
+          headers: { token: localStorage.token },
+          params: {
+            title: this.formInline.param1, //获取查询内容
+            teacherNo: localStorage.getItem("userId"),
+            page: this.currentPage,
+            limit: this.pageSize,
+          },
+        })
+          .then((res) => {
+            console.log("5");
+            console.log(res);
+            if (res.data.code == "200") {
+              this.competeList = res.data.data;
+              this.pageTotal = Number(res.data.details.infoCount); //显示当前条数
+              console.log(res.data.data);
+            }
+          })
+          .catch((err) => {
+            console.log(err);
+          });
+      }
+    },
+
+    // //用户点击上一页按钮改变当前页后触发
+    // handlePrev() {},
+    // //用户点击下一页按钮改变当前页后触发
+    // handleNext() {},
+    //获取竞赛信息(竞赛大厅)
+    getCompeteList() {
+      console.log(localStorage.getItem("token"));
+      console.log(localStorage.getItem("userId"));
+      // this.$axios.defaults.headers.common["Authorization"] =  localStorage.getItem('token');
+      // this.$axios.interceptors.request.use(
+      //   function (config) {
+      //     // Do something before request is sent
+      //     let token = localStorage.getItem("token");
+      //     if (token) {
+      //       config.headers.token = token; //将token放到请求头发送给服务器
+      //       return config;
+      //       //这里经常搭配token使用，将token值配置到tokenkey中，将tokenkey放在请求头中
+      //       // config.headers['accessToken'] = Token;
+      //     }
+      //   },
+      //   function (error) {
+      //     // Do something with request error
+      //     return Promise.reject(error);
+      //   }
+      // );
+      // console.log("papa");
+      // console.log(this.pageSize);
+      // console.log("papa");
+      this.$axios({
+        method: "get",
+        url: "http://124.220.174.249:8085/backend/admin/showAllAccount",
+        // Headers: { token: localStorage.getItem("token") },
+        // headers: {
+        //   authorization: `Bearer ${localStorage.getItem("token")}`,
+        // },
+        headers: { token: localStorage.token },
+        params: {
+          // teacherNo: 101,
+          // teacherNo: localStorage.getItem("userId").replace(/\"/g, ""), //去掉双引号
+          page: this.currentPage,
+          limit: this.pageSize,
+          //   type: this.type,
+          // limit: 30,
+          // token:localStorage.token
+          // headers:{token:localStorage.token},
+        },
+      })
+        // this.$axios
+        //   .get("http://47.113.195.148:8085/backend/teacher/showAllCompetitions", {
+        //     //params参数必写 , 如果没有可传参数，传{}以
+        //     params: {
+        //       teacherNo: localStorage.getItem("userId"),
+        //     },
+        //   })
+        .then((res) => {
+          // console.log(username + password);
+          console.log(res);
+          if (res.data.code == "200") {
+            this.competeList = res.data.data;
+            console.log("res.data.data");
+            console.log(this.competeList);
+            console.log("res.data.details.infoCount");
+            console.log(res.data.details.infoCount);
+            console.log(res.data.data.length);
+            this.pageTotal = Number(res.data.details.infoCount);
+            console.log("res.data.data");
+          }
+        })
+        .catch((err) => {
+          return this.$message.error("获取竞赛列表信息失败！");
+        });
+    },
+    //分页升降序
+    onSortChange({ prop, order }) {
+      if (order == "ascending") this.type = 1;
+      else this.type = 2;
+      this.$axios({
+        method: "get",
+        url: "http://124.220.174.249:8085/backend/admin/showAllAccount",
+        headers: { token: localStorage.token },
+        params: {
+          // teacherNo: 101,
+          // teacherNo: localStorage.getItem("userId").replace(/\"/g, ""), //去掉双引号
+          page: this.currentPage,
+          limit: this.pageSize,
+          type: this.type,
+        },
+      })
+        .then((res) => {
+          console.log(res);
+          if (res.data.code == "200") {
+            this.competeList = res.data.data;
+            console.log("res.data.data");
+            console.log(this.competeList);
+            console.log("res.data.details.infoCount");
+            console.log(res.data.details.infoCount);
+            console.log(res.data.data.length);
+            this.pageTotal = Number(res.data.details.infoCount);
+            console.log("res.data.data");
+          }
+        })
+        .catch((err) => {
+          return this.$message.error("获取竞赛列表信息失败！");
+        });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.el-menu-demo {
+  float: right;
+}
+
+.icon_left {
+  float: left;
+  font-size: 30px;
+  color: cornflowerblue;
+  font-weight: 700;
+}
+
+.ManageCompititionTable {
+  position: absolute;
+  top: 80px;
+}
+</style>
-- 
GitLab