|
|
@@ -0,0 +1,427 @@
|
|
|
+<template>
|
|
|
+ <el-dialog
|
|
|
+ title="提醒"
|
|
|
+ :visible.sync="remDig"
|
|
|
+ :append-to-body="true"
|
|
|
+ width="560px"
|
|
|
+ :before-close="handleClose"
|
|
|
+ class="dialog_diy"
|
|
|
+ >
|
|
|
+ <div class="share_box">
|
|
|
+ <div class="info_box" ref="info">
|
|
|
+ <!-- <div class="info">
|
|
|
+ <span>表单范围：</span>
|
|
|
+ <span>{{ reversedMessage }}</span>
|
|
|
+ </div> -->
|
|
|
+ <div class="info">
|
|
|
+ <span>填写范围：</span>
|
|
|
+ <el-select
|
|
|
+ v-model="teas"
|
|
|
+ @change="getData"
|
|
|
+ multiple
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in TeaList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <!-- <div class="info" v-if="testJson && testJson.overtime">
|
|
|
+ <span>截止时间：</span>
|
|
|
+ <span>{{ testJson.overtime }}</span>
|
|
|
+ </div> -->
|
|
|
+ <div class="info">
|
|
|
+ <span>需提交人数：</span>
|
|
|
+ <span>{{ remindNum }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="info">
|
|
|
+ <span>未完成人数：</span>
|
|
|
+ <span v-html="remindList.length"></span>
|
|
|
+ </div>
|
|
|
+ <div class="info">
|
|
|
+ <span>未完成名单：</span>
|
|
|
+ <span>{{
|
|
|
+ remindList.length > 20
|
|
|
+ ? isSuo
|
|
|
+ ? remindList.slice(0, 20).join(",") + "..."
|
|
|
+ : remindList.join(",")
|
|
|
+ : remindList.join(",")
|
|
|
+ }}</span>
|
|
|
+ <span
|
|
|
+ class="more"
|
|
|
+ v-if="remindList.length > 20"
|
|
|
+ @click="isSuo = !isSuo"
|
|
|
+ >{{ isSuo ? "查看更多" : "收起" }}</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="btn_box">
|
|
|
+ <button class="c_pub_button_confirm tag-read2" @click="getExcelTab">
|
|
|
+ 导出
|
|
|
+ </button>
|
|
|
+ <button
|
|
|
+ class="c_pub_button_confirm tag-read2"
|
|
|
+ @click="copy2"
|
|
|
+ :data-clipboard-text="copyText2"
|
|
|
+ >
|
|
|
+ 复制信息
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import Clipboard from "clipboard";
|
|
|
+export default {
|
|
|
+ props: {
|
|
|
+ remDig: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false
|
|
|
+ },
|
|
|
+ pType: {
|
|
|
+ type: Number
|
|
|
+ },
|
|
|
+ TeaList: {
|
|
|
+ type: Array
|
|
|
+ },
|
|
|
+ testJson: {
|
|
|
+ type: Object
|
|
|
+ },
|
|
|
+ TeachingValue: {
|
|
|
+ type: String
|
|
|
+ },
|
|
|
+ TeachName: {
|
|
|
+ type: Array
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ origin: "",
|
|
|
+ copyText: "",
|
|
|
+ copyText2: "",
|
|
|
+ noCount: 0,
|
|
|
+ pname: [],
|
|
|
+ isSuo: true,
|
|
|
+ excelData: [],
|
|
|
+ remindNum: 0,
|
|
|
+ remindList: [],
|
|
|
+ remindName: [],
|
|
|
+ oid: this.$route.query.oid, //学校id
|
|
|
+ org: this.$route.query.org, //组织id
|
|
|
+ teas: []
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ reversedMessage() {
|
|
|
+ if (this.TeachingValue == "") {
|
|
|
+ return this.testJson.juriP ? this.testJson.juriP : "所有人";
|
|
|
+ } else {
|
|
|
+ return this.TeachName ? this.TeachName[0].name : "所有人";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ handleClose(done) {
|
|
|
+ this.close();
|
|
|
+ done();
|
|
|
+ },
|
|
|
+ close() {
|
|
|
+ this.teas = [];
|
|
|
+ this.$emit("update:remDig", false);
|
|
|
+ },
|
|
|
+
|
|
|
+ copy2() {
|
|
|
+ this.copyText2 = `填写范围：${
|
|
|
+ this.teas ? this.remindName.join(",") : "所有人"
|
|
|
+ }\n${"需提交人数：" +
|
|
|
+ this.remindNum +
|
|
|
+ "\n"}${"未完成人数：" + this.remindList.length + "\n"}${
|
|
|
+ this.remindList.length
|
|
|
+ ? "未完成名单：" + this.remindList.join(",") + "\n"
|
|
|
+ : ""
|
|
|
+ }`;
|
|
|
+ var clipboard = new Clipboard(".tag-read2");
|
|
|
+ clipboard.on("success", e => {
|
|
|
+ this.$message.success("复制成功");
|
|
|
+ console.log("复制成功");
|
|
|
+ clipboard.destroy(); // 释放内存
|
|
|
+ });
|
|
|
+ clipboard.on("error", e => {
|
|
|
+ console.log("不支持复制,该浏览器不支持自动复制");
|
|
|
+ clipboard.destroy(); // 释放内存
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getData() {
|
|
|
+ this.remindList = [];
|
|
|
+ this.remindName = [];
|
|
|
+
|
|
|
+ this.remindNum = 0;
|
|
|
+ let params = {
|
|
|
+ oid: this.oid,
|
|
|
+ org: this.org,
|
|
|
+ tea: this.teas.join(","),
|
|
|
+ ptype: this.pType
|
|
|
+ };
|
|
|
+
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "selectExamineTeaRemind", params)
|
|
|
+ .then(res => {
|
|
|
+ let data = res.data[0];
|
|
|
+ this.excelData = JSON.parse(JSON.stringify(data));
|
|
|
+ this.remindNum = data.length > 0 ? data[0].num : 0;
|
|
|
+ data.forEach(e => {
|
|
|
+ this.remindList.push(e.username);
|
|
|
+ });
|
|
|
+ // this.digLoading = false;
|
|
|
+
|
|
|
+ if (this.teas.length > 0) {
|
|
|
+ this.teas.forEach(e => {
|
|
|
+ this.TeaList.forEach(k => {
|
|
|
+ if (e == k.id) {
|
|
|
+ this.remindName.push(k.name);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ console.log("selectExamineTeaRemind", this.remindName);
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+
|
|
|
+ // let params = {
|
|
|
+ // id: this.testJson.courseId,
|
|
|
+ // tea: this.TeachingValue
|
|
|
+ // };
|
|
|
+ // this.ajax
|
|
|
+ // .get(this.$store.state.api + "getTestWorkShareCopy", params)
|
|
|
+ // .then((res) => {
|
|
|
+ // console.log('res.datares.datares.datares.datares.datares.data',res.data);
|
|
|
+ // let parray = res.data[0]
|
|
|
+ // let is = res.data[1]
|
|
|
+ // this.noCount = parray.length - is.length
|
|
|
+ // let isA = []
|
|
|
+ // for(var i=0;i<is.length;i++){
|
|
|
+ // isA.push(is[i].userid)
|
|
|
+ // }
|
|
|
+ // let pname = []
|
|
|
+ // for(var i=0;i<parray.length;i++){
|
|
|
+ // if(isA.indexOf(parray[i].userid) == -1){
|
|
|
+ // pname.push(parray[i].username)
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // this.pname = pname
|
|
|
+ // })
|
|
|
+ // .catch((err) => {
|
|
|
+ // console.error(err);
|
|
|
+ // });
|
|
|
+ },
|
|
|
+ getExcelTab() {
|
|
|
+ var res = this.excelData;
|
|
|
+ // console.log('导出数据',res);
|
|
|
+ //如果value的json字段的key值和想要的headers值不一致时，可做如下更改
|
|
|
+ //将和下面的Object.fromEntries结合，将json字段的key值改变为要求的excel的header值
|
|
|
+ var array = [];
|
|
|
+ for (var i = 0; i < res.length; i++) {
|
|
|
+ var _json = {};
|
|
|
+ _json["教师姓名"] = res[i].username;
|
|
|
+ _json["教师账号"] = res[i].eName;
|
|
|
+ _json["所属教研室"] = res[i].tea;
|
|
|
+ array.push(_json);
|
|
|
+ }
|
|
|
+
|
|
|
+ var XLSX = require("xlsx");
|
|
|
+ const workbook = XLSX.utils.book_new(); //创建一个新的工作簿对象
|
|
|
+ let ws = XLSX.utils.json_to_sheet(array); //将json对象数组转化成工作表
|
|
|
+ ws["!cols"] = [
|
|
|
+ //设置每一列的宽度
|
|
|
+ { wch: 30 },
|
|
|
+ { wch: 30 },
|
|
|
+ { wch: 30 }
|
|
|
+ ];
|
|
|
+
|
|
|
+ XLSX.utils.book_append_sheet(workbook, ws, "sheet1"); //把sheet添加到workbook里，第三个参数是sheet名
|
|
|
+ XLSX.writeFile(workbook, "未完成名单.xlsx");
|
|
|
+ // const wopts = { bookType: "xlsx", bookSST: false, type: "array" };//写入的样式bookType:输出的文件类型，type：输出的数据类型，bookSST: 是否生成Shared String Table，官方解释是，如果开启生成速度会下降，但在低版本IOS设备上有更好的兼容性
|
|
|
+ // const wbout = XLSX.write(workbook, wopts);// 浏览器端和node共有的API,实际上node可以直接使用xlsx.writeFile来写入文件,但是浏览器没有该API
|
|
|
+ // FileSaver.saveAs(new Blob([wbout], { type: "application/octet-stream" }), `${title} demo.xlsx`);//保存文件
|
|
|
+ this.$message({
|
|
|
+ message: "导出成功",
|
|
|
+ type: "success"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ remDig(newValue, oldValue) {
|
|
|
+ if (newValue) {
|
|
|
+ this.isSuo = true;
|
|
|
+ this.getData();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // mounted(){
|
|
|
+ // console.log(top.origin);
|
|
|
+ // },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.dialog_diy >>> .el-dialog {
|
|
|
+ height: 70% !important;
|
|
|
+ min-width: 650px !important;
|
|
|
+ margin-top: 10% !important;
|
|
|
+ /* height: 100%; */
|
|
|
+ /* margin: 0 auto !important; */
|
|
|
+}
|
|
|
+
|
|
|
+/* .dialog_diy >>> .el-dialog__header {
|
|
|
+ background: #454545 !important;
|
|
|
+ padding: 25px 20px;
|
|
|
+} */
|
|
|
+.dialog_diy >>> .el-dialog__header {
|
|
|
+ background: #fff !important;
|
|
|
+ padding: 15px 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__body {
|
|
|
+ height: calc(100% - 124px);
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0px;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__title {
|
|
|
+ color: #000;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__headerbtn {
|
|
|
+ top: 19px;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__headerbtn .el-dialog__close {
|
|
|
+ color: #000;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__headerbtn .el-dialog__close:hover {
|
|
|
+ color: #000;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__body,
|
|
|
+.dialog_diy >>> .el-dialog__footer {
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.share_box {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ padding: 20px 15px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.info_box {
|
|
|
+ margin: 0 0 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.info_box > .info {
|
|
|
+ line-height: 18px;
|
|
|
+}
|
|
|
+
|
|
|
+.info_box > .info > span:nth-child(1) {
|
|
|
+ color: #00000099;
|
|
|
+}
|
|
|
+
|
|
|
+.info_box > .info > span:nth-child(2) {
|
|
|
+ color: #000000;
|
|
|
+}
|
|
|
+
|
|
|
+.info_box > .info + .info {
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.url_box {
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.qrcode_box {
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.url_box > .url {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ border: 1px solid #e7e7e7;
|
|
|
+ border-radius: 4px;
|
|
|
+ height: 35px;
|
|
|
+ padding: 0 7px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.url_box > .url > span {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #000000;
|
|
|
+}
|
|
|
+
|
|
|
+.url_box > .url > span:nth-child(1) {
|
|
|
+ width: 100%;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+}
|
|
|
+
|
|
|
+.url_box > .url > span:nth-child(2) {
|
|
|
+ margin-left: auto;
|
|
|
+ border-left: 1px solid #e7e7e7;
|
|
|
+ padding-left: 7px;
|
|
|
+ cursor: pointer;
|
|
|
+ min-width: fit-content;
|
|
|
+}
|
|
|
+
|
|
|
+.url_box > .title,
|
|
|
+.qrcode_box > .title {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 700;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.qrcode_box > .qrcode {
|
|
|
+ padding: 7px;
|
|
|
+ border: 1px solid #e7e7e7;
|
|
|
+ width: fit-content;
|
|
|
+ border-radius: 4px;
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-end;
|
|
|
+}
|
|
|
+
|
|
|
+.qrcode_box > .qrcode > span:nth-child(1) {
|
|
|
+ width: 100px;
|
|
|
+ display: block;
|
|
|
+ height: 100px;
|
|
|
+}
|
|
|
+
|
|
|
+.qrcode_box > .qrcode > span:nth-child(2) {
|
|
|
+ background: #f0f2f5;
|
|
|
+ padding: 7px 15px;
|
|
|
+ font-size: 16px;
|
|
|
+ border-radius: 4px;
|
|
|
+ cursor: pointer;
|
|
|
+ color: #000;
|
|
|
+ margin-left: 7px;
|
|
|
+}
|
|
|
+
|
|
|
+.btn_box {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+}
|
|
|
+
|
|
|
+.more {
|
|
|
+ cursor: pointer;
|
|
|
+ color: #0061ff;
|
|
|
+}
|
|
|
+</style>
|
11wqe1