|
|
@@ -55,7 +55,7 @@
|
|
|
<span>未完成人数</span>
|
|
|
<span><span class="big">{{ pcount - iscount }}</span></span>
|
|
|
</div>
|
|
|
- <div class="btn_box">
|
|
|
+ <div class="btn_box" @click="dialogVisibleShare = true">
|
|
|
<span></span>
|
|
|
<span>提醒</span>
|
|
|
</div>
|
|
|
@@ -73,15 +73,81 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="title_content" v-if="stype == 1">
|
|
|
+ <div class="title_box" v-for="(item, index) in testArray" :key="index">
|
|
|
+ <div class="title">
|
|
|
+ <span class="test_icon"
|
|
|
+ :class="{ test_icon_check: item.type == 1 && item.atype == 2, test_icon_checkO: item.type == 1 && item.atype == 1, test_icon_gap: item.type == 3, test_icon_file: item.type == 5 }"></span><span>{{
|
|
|
+ item.title }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="detail" v-if="item.detail">{{ item.detail }}</div>
|
|
|
+ <div class="content1" v-if="item.type == 1">
|
|
|
+ <div class="left"></div>
|
|
|
+ <div class="right"></div>
|
|
|
+ </div>
|
|
|
+ <div class="content2" v-if="item.type == 3">
|
|
|
+ <div class="left">
|
|
|
+ <div class="title">
|
|
|
+ <span>序号</span>
|
|
|
+ <span>词频</span>
|
|
|
+ <span>答案文本</span>
|
|
|
+ </div>
|
|
|
+ <div class="data" v-for="(data, index2) in item.array" :key="index + '-' + index2">
|
|
|
+ <span>{{ index2 + 1 }}</span>
|
|
|
+ <span>{{ data.count }}次数</span>
|
|
|
+ <el-tooltip :content="data.name" placement="top" effect="dark">
|
|
|
+ <!-- content to trigger tooltip here -->
|
|
|
+ <span>{{ data.name }}</span>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="right"></div>
|
|
|
+ </div>
|
|
|
+ <div class="content3" v-if="item.type == 5">
|
|
|
+ <div class="file" v-for="(file, index2) in item.array" :key="index + '-' + index2"
|
|
|
+ @click.stop="checkFile(file)">
|
|
|
+ <img class="download" src="../../../../assets/icon/fileIcon/download.png"
|
|
|
+ @click.stop="downloadFile(file)" :style="{ right: checktype != 1 ? '10px' : '45px' }" />
|
|
|
+ <img class="img" :src="wordIcon" alt="" v-if="file.type == 1" />
|
|
|
+ <img class="img" :src="videoIcon" alt="" v-if="file.type == 2" />
|
|
|
+ <img class="img" :src="file.url" alt="" v-if="file.type == 3" />
|
|
|
+ <img class="img" :src="wordIcon" alt="" v-if="file.type == 4" />
|
|
|
+ <img class="img" :src="fileIcon" alt="" v-if="file.type == 5" />
|
|
|
+ <div class="name">
|
|
|
+ <el-tooltip :content="file.name" placement="top" effect="dark">
|
|
|
+ <span>{{ file.name }}</span>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <share-box :testJson="testJson" :dialogVisibleShare.sync="dialogVisibleShare"></share-box>
|
|
|
+ <wpdf :dialogVisiblePdf.sync="dialogVisiblePdf" :url="wurl"></wpdf>
|
|
|
+ <wVideo :dialogVisibleVideo.sync="dialogVisibleVideo" :url="wurl"></wVideo>
|
|
|
+ <wOffice :dialogVisibleOffice.sync="dialogVisibleOffice" :url="wurl"></wOffice>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import shareBox from '../shareBox/index.vue'
|
|
|
+import videoIcon from '../../../../assets/icon/fileIcon/isVideo.png'
|
|
|
+import wordIcon from '../../../../assets/icon/fileIcon/isWord.png'
|
|
|
+import fileIcon from '../../../../assets/icon/fileIcon/word2.png'
|
|
|
+
|
|
|
+import wVideo from "../file/wVideo.vue";
|
|
|
+import wpdf from "../file/wPdf2.vue";
|
|
|
+import wOffice from "../file/wOffice.vue";
|
|
|
export default {
|
|
|
- components: {},
|
|
|
+ components: {
|
|
|
+ shareBox,
|
|
|
+ wVideo,
|
|
|
+ wpdf,
|
|
|
+ wOffice,
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
userid: this.$route.query.userid,
|
|
|
@@ -107,6 +173,23 @@ export default {
|
|
|
pcount: 0,
|
|
|
stype: 1,
|
|
|
courseName: "",
|
|
|
+ dialogVisibleShare: false,
|
|
|
+ worksArray: [],
|
|
|
+ testArray: [],
|
|
|
+ options2: {
|
|
|
+ 1: "选择题",
|
|
|
+ // 2: "问答题",
|
|
|
+ 3: "问答题",
|
|
|
+ 4: "添加文档",
|
|
|
+ 5: "附件"
|
|
|
+ },
|
|
|
+ videoIcon: videoIcon,
|
|
|
+ wordIcon: wordIcon,
|
|
|
+ fileIcon: fileIcon,
|
|
|
+ dialogVisiblePdf: false,
|
|
|
+ dialogVisibleVideo: false,
|
|
|
+ dialogVisibleOffice: false,
|
|
|
+ wurl: "",
|
|
|
};
|
|
|
},
|
|
|
watch: {},
|
|
|
@@ -177,7 +260,7 @@ export default {
|
|
|
this.getData();
|
|
|
}
|
|
|
},
|
|
|
- searchCourse(){
|
|
|
+ searchCourse() {
|
|
|
this.getData()
|
|
|
},
|
|
|
getData() {
|
|
|
@@ -194,11 +277,236 @@ export default {
|
|
|
this.works = res.data[1]
|
|
|
this.iscount = res.data[2][0].count
|
|
|
this.pcount = res.data[3][0].count
|
|
|
+ let chapters = this.setJSON(this.setJson2(JSON.parse(JSON.stringify(JSON.parse(res.data[0][0].chapters)))))
|
|
|
+ this.JSONSetting(JSON.parse(JSON.stringify(JSON.parse(res.data[0][0].chapters))))
|
|
|
+ let testArray = []
|
|
|
+ let array = []
|
|
|
+ for (let i = 0; i < this.works.length; i++) {
|
|
|
+ let cJson = this.setJSON(JSON.parse(JSON.stringify(JSON.parse(this.works[i].courseJson))))
|
|
|
+ if (JSON.stringify(cJson) == JSON.stringify(chapters)) {
|
|
|
+ let _json = this.JSONSetting(JSON.parse(JSON.stringify(JSON.parse(this.works[i].courseJson))))
|
|
|
+ array.push({
|
|
|
+ name: this.works[i].username,
|
|
|
+ array: _json
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (var i = 0; i < chapters.length; i++) {
|
|
|
+ let el = chapters[i]
|
|
|
+ let topic = {
|
|
|
+ type: el.type,
|
|
|
+ title: el.json.title,
|
|
|
+ detail: el.json.detail,
|
|
|
+ atype: el.json.type,
|
|
|
+ choice: el.json.array,
|
|
|
+ array: [],
|
|
|
+ answer: el.json.answer,
|
|
|
+ count: 0
|
|
|
+ }
|
|
|
+ if (topic.type == 1) {
|
|
|
+ for (var t = 0; t < topic.choice.length; t++) {
|
|
|
+ topic.array.push({
|
|
|
+ name: topic.choice[t].option,
|
|
|
+ count: 0
|
|
|
+ })
|
|
|
+ }
|
|
|
+ } else if (topic.type == 3) {
|
|
|
+
|
|
|
+ } else if (topic.type == 5) {
|
|
|
+
|
|
|
+ }
|
|
|
+ for (var j = 0; j < array.length; j++) {
|
|
|
+ let el2 = array[j]
|
|
|
+ if (topic.type == 1) {
|
|
|
+ let _answer = el2.array[i].json.answer2
|
|
|
+ for (var k = 0; k < _answer.length; k++) {
|
|
|
+ topic.array[_answer[k]].count++
|
|
|
+ topic.count++
|
|
|
+ }
|
|
|
+ } else if (topic.type == 3) {
|
|
|
+ let type3 = 1
|
|
|
+ let _answer = el2.array[i].json.answer2
|
|
|
+ if (_answer) {
|
|
|
+ for (var k = 0; k < topic.array.length; k++) {
|
|
|
+ if (topic.array[k].name == _answer) {
|
|
|
+ topic.array[k].count++
|
|
|
+ type3 = 2
|
|
|
+ topic.count++
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (type3 == 1) {
|
|
|
+ topic.array.push({
|
|
|
+ name: _answer,
|
|
|
+ count: 1
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else if (topic.type == 5) {
|
|
|
+ let _answer = el2.array[i].json.file
|
|
|
+ for (var k = 0; k < _answer.length; k++) {
|
|
|
+ topic.array.push(_answer[k])
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ testArray.push(topic)
|
|
|
+ }
|
|
|
+ this.testArray = testArray
|
|
|
+ this.worksArray = array
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
console.error(err);
|
|
|
});
|
|
|
},
|
|
|
+ setJSON(json) {
|
|
|
+ return json.filter((item) => {
|
|
|
+ if (item.array) {
|
|
|
+ item.array = item.array.filter((item2) => {
|
|
|
+ if (item2.ttype == 1 && item2.json) {
|
|
|
+ delete item2.json.answer2
|
|
|
+ delete item2.json.score2
|
|
|
+ delete item2.json.file
|
|
|
+ }
|
|
|
+ if (item2.array) {
|
|
|
+ item2.array = item2.array.filter((item3) => {
|
|
|
+ if (item3.ttype == 1 && item3.json) {
|
|
|
+ delete item3.json.answer2
|
|
|
+ delete item3.json.score2
|
|
|
+ delete item3.json.file
|
|
|
+ }
|
|
|
+ return item3;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return item2;
|
|
|
+ });
|
|
|
+ } else if (item.ttype == 1 && item.json) {
|
|
|
+ delete item.json.answer2
|
|
|
+ delete item.json.score2
|
|
|
+ delete item.json.file
|
|
|
+ }
|
|
|
+ return item
|
|
|
+ console.log(item.array);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ setJson2(json) {
|
|
|
+ let _json = json;
|
|
|
+ // this.type = _json[0].ttype;
|
|
|
+ let checkArray = _json.filter((item) => {
|
|
|
+ if (item.array) {
|
|
|
+ item.array = item.array.filter((item2) => {
|
|
|
+ if (item2.ttype == 1 && item2.json && !item2.json.answer2) {
|
|
|
+ item2.json.answer2 = [];
|
|
|
+ }
|
|
|
+ if (item2.array) {
|
|
|
+ item2.array = item2.array.filter((item3) => {
|
|
|
+ if (item3.ttype == 1 && item3.json && !item3.json.answer2) {
|
|
|
+ item3.json.answer2 = [];
|
|
|
+ }
|
|
|
+ return item3;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return (
|
|
|
+ (item2.ttype != 1 && item2.array.length > 0) || item2.ttype == 1
|
|
|
+ );
|
|
|
+ });
|
|
|
+ }
|
|
|
+ if (item.ttype == 1 && item.json && !item.json.answer2) {
|
|
|
+ item.json.answer2 = [];
|
|
|
+ }
|
|
|
+ console.log(item.array);
|
|
|
+ return (item.ttype != 1 && item.array.length > 0) || item.ttype == 1;
|
|
|
+ });
|
|
|
+ console.log(checkArray);
|
|
|
+ return checkArray;
|
|
|
+
|
|
|
+ },
|
|
|
+ JSONSetting(json) {
|
|
|
+ let _json = json
|
|
|
+ let array = []
|
|
|
+ _json.filter((item) => {
|
|
|
+ if (item.array) {
|
|
|
+ item.array = item.array.filter((item2) => {
|
|
|
+ if (item2.ttype == 1 && item2.json) {
|
|
|
+ array.push(item2)
|
|
|
+ }
|
|
|
+ if (item2.array) {
|
|
|
+ item2.array = item2.array.filter((item3) => {
|
|
|
+ if (item3.ttype == 1 && item3.json) {
|
|
|
+ array.push(item3)
|
|
|
+ }
|
|
|
+ return item3;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return item2;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ if (item.ttype == 1 && item.json) {
|
|
|
+ array.push(item)
|
|
|
+ }
|
|
|
+ console.log(item.array);
|
|
|
+ return item;
|
|
|
+ });
|
|
|
+ console.log(array);
|
|
|
+ return array;
|
|
|
+ },
|
|
|
+ checkFile(item) {
|
|
|
+ if (item.type == 3) {
|
|
|
+ this.$hevueImgPreview(item.url);
|
|
|
+ } else if (item.type == 5) {
|
|
|
+ this.downloadFile(item);
|
|
|
+ } else if (item.type == 1) {
|
|
|
+ this.dialogVisibleOffice = true
|
|
|
+ this.wurl = item.url
|
|
|
+ } else if (item.type == 2) {
|
|
|
+ this.dialogVisibleVideo = true
|
|
|
+ this.wurl = item.url
|
|
|
+ } else if (item.type == 4) {
|
|
|
+ this.dialogVisiblePdf = true
|
|
|
+ this.wurl = item.url
|
|
|
+ }
|
|
|
+ },
|
|
|
+ downloadFile(f) {
|
|
|
+ var credentials = {
|
|
|
+ accessKeyId: "AKIATLPEDU37QV5CHLMH",
|
|
|
+ secretAccessKey: "Q2SQw37HfolS7yeaR1Ndpy9Jl4E2YZKUuuy2muZR",
|
|
|
+ }; //秘钥形式的登录上传
|
|
|
+ window.AWS.config.update(credentials);
|
|
|
+ window.AWS.config.region = "cn-northwest-1"; //设置区域
|
|
|
+ let url2 = f.url;
|
|
|
+ let _url2 = "";
|
|
|
+ if (
|
|
|
+ url2.indexOf("https://view.officeapps.live.com/op/view.aspx?src=") != -1
|
|
|
+ ) {
|
|
|
+ _url2 = url2.split(
|
|
|
+ "https://view.officeapps.live.com/op/view.aspx?src="
|
|
|
+ )[1];
|
|
|
+ } else {
|
|
|
+ _url2 = url2;
|
|
|
+ }
|
|
|
+ let _this = this;
|
|
|
+
|
|
|
+ _this.downLoading = _url2
|
|
|
+ var s3 = new window.AWS.S3({ params: { Bucket: "ccrb" } });
|
|
|
+ let name = decodeURIComponent(_url2.split("https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/")[1])
|
|
|
+ var params = {
|
|
|
+ Bucket: "ccrb",
|
|
|
+ Key: name
|
|
|
+ };
|
|
|
+ s3.getObject(params, function (err, data) {
|
|
|
+ _this.downLoading = ''
|
|
|
+ if (err) console.log(err, err.stack); // an error occurred
|
|
|
+ else {
|
|
|
+ let url = window.URL.createObjectURL(new Blob([data.Body]));
|
|
|
+ let a = document.createElement("a");
|
|
|
+ a.name = f.name;
|
|
|
+ a.href = url;
|
|
|
+ a.download = f.name;
|
|
|
+ a.click();
|
|
|
+ console.log(data);
|
|
|
+ } // sxuccessful response
|
|
|
+
|
|
|
+ });
|
|
|
+ },
|
|
|
},
|
|
|
mounted() {
|
|
|
this.$nextTick(function () {
|
|
|
@@ -434,4 +742,146 @@ export default {
|
|
|
background-size: 100% 100%;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
+
|
|
|
+
|
|
|
+.title_content {}
|
|
|
+
|
|
|
+.title_content>.title_box {
|
|
|
+ width: calc(100% - 48px);
|
|
|
+ margin: 20px auto 0;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.title {
|
|
|
+ font-size: 18px;
|
|
|
+ display: flex;
|
|
|
+ white-space: pre-line;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.title>.test_icon {
|
|
|
+ min-width: 20px;
|
|
|
+ height: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.detail {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #00000099;
|
|
|
+ margin-top: 8px;
|
|
|
+ white-space: pre-line;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content2 {
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content2>.left {
|
|
|
+ width: calc(100% - 620px);
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content2>.left>.title,
|
|
|
+.title_content>.title_box>.content2>.left>.data {
|
|
|
+ display: flex;
|
|
|
+ height: 40px;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ padding: 0 15px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content2>.left>.title>span,
|
|
|
+.title_content>.title_box>.content2>.left>.data>span {
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content2>.left>.title>span:nth-child(1),
|
|
|
+.title_content>.title_box>.content2>.left>.data>span:nth-child(1) {
|
|
|
+ width: 55px;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content2>.left>.title>span:nth-child(2),
|
|
|
+.title_content>.title_box>.content2>.left>.data>span:nth-child(2) {
|
|
|
+ width: 110px;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content2>.left>.title>span:nth-child(3),
|
|
|
+.title_content>.title_box>.content2>.left>.data>span:nth-child(3) {
|
|
|
+ max-width: calc(100% - 110px - 55px);
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content2>.left>.title {
|
|
|
+ font-weight: 700;
|
|
|
+ background: #F9FAFB;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content2>.right {
|
|
|
+ width: 600px;
|
|
|
+ margin-left: 20px;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content3 {
|
|
|
+ display: flex;
|
|
|
+ width: 100%;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content3>.file {
|
|
|
+ min-width: 200px;
|
|
|
+ width: 200px;
|
|
|
+ height: 140px;
|
|
|
+ margin: 10px 10px 10px 0px;
|
|
|
+ border-radius: 15px;
|
|
|
+ box-shadow: rgb(223, 218, 218) 0px 0px 6px 1px;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-right: 15px;
|
|
|
+ position: relative;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content3>.file>.img {
|
|
|
+ width: 100%;
|
|
|
+ height: calc(100% - 35px);
|
|
|
+ object-fit: cover;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content3>.file>.del {
|
|
|
+ position: absolute;
|
|
|
+ width: 25px;
|
|
|
+ top: 10px;
|
|
|
+ right: 10px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content3>.file>.download {
|
|
|
+ position: absolute;
|
|
|
+ width: 25px;
|
|
|
+ top: 10px;
|
|
|
+ right: 35px;
|
|
|
+ cursor: pointer;
|
|
|
+ opacity: .8;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+.title_content>.title_box>.content3>.file>.name {
|
|
|
+ height: 35px;
|
|
|
+ width: 100%;
|
|
|
+ background: #f9f9f9;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0 10px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.title_content>.title_box>.content3>.file>.name>span {
|
|
|
+ display: block;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ max-width: 100%;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
</style>
|
