From 375513370cc01fcd976987d07797249600b0bb3e Mon Sep 17 00:00:00 2001 From: 杨磊 <505174330@qq.com> Date: 星期四, 07 八月 2025 17:15:09 +0800 Subject: [PATCH] 'first' --- src/components/detail/paperCopies.vue | 198 +++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 198 insertions(+), 0 deletions(-) diff --git a/src/components/detail/paperCopies.vue b/src/components/detail/paperCopies.vue new file mode 100644 index 0000000..0b0a9dc --- /dev/null +++ b/src/components/detail/paperCopies.vue @@ -0,0 +1,198 @@ +<template> + <div class="relatedBox"> + <div class="headBox"> + <div class="titleBox">绾歌川鏍蜂功</div> + <div class="inventory" @click="createList"> + <i class="iconfont icon-tongxunlu"></i> 鐢熸垚娓呭崟 + </div> + </div> + <div class="bookBox" v-if="$store.state.paperCopiesList.length > 0"> + <div + class="itemBox" + v-for="(item, index) in $store.state.paperCopiesList" + :key="index" + > + <div class="imgBox"> + <img class="autoImg" :src="item.icon" alt="" /> + </div> + <div class="rightBox"> + <div class="bookName"> + {{ item.name }} + </div> + <div class="authorBox1"> + 浣滆�咃細 + <div class="authorName">{{ item.caupress_author }}</div> + </div> + <div class="iconBox"> + <i + class="iconfont icon-shanchu" + @click="deleteItem(item, index)" + ></i> + </div> + </div> + </div> + </div> + <div class="emptyBox" v-else> + <el-empty :image-size="100" description="鏆傛棤涔︾睄"></el-empty> + </div> + </div> +</template> + +<script> +export default { + data() { + return { + dataList: [ + { + img: "@/assets/images/bookStore/testImg.png", + title: "鏌犳潯鐏屼笡鑽夊湴姘村垎 鍔ㄦ�佸強缇よ惤鐗瑰緛鐮旂┒", + author: "寰愯崳/鏉庣敓瀹� 浣欏嘲/钂嬮綈钁�", + }, + { + img: "@/assets/images/bookStore/testImg.png", + title: "鏌犳潯鐏屼笡鑽夊湴姘村垎 鍔ㄦ�佸強缇よ惤鐗瑰緛鐮旂┒", + author: "寰愯崳/鏉庣敓瀹� 浣欏嘲/钂嬮綈钁�", + }, + { + img: "@/assets/images/bookStore/testImg.png", + title: "鏌犳潯鐏屼笡鑽夊湴姘村垎 鍔ㄦ�佸強缇よ惤鐗瑰緛鐮旂┒", + author: "寰愯崳/鏉庣敓瀹� 浣欏嘲/钂嬮綈钁�", + }, + { + img: "@/assets/images/bookStore/testImg.png", + title: "鏌犳潯鐏屼笡鑽夊湴姘村垎 鍔ㄦ�佸強缇よ惤鐗瑰緛鐮旂┒", + author: "寰愯崳/鏉庣敓瀹� 浣欏嘲/钂嬮綈钁�", + }, + { + img: "@/assets/images/bookStore/testImg.png", + title: "鏌犳潯鐏屼笡鑽夊湴姘村垎 鍔ㄦ�佸強缇よ惤鐗瑰緛鐮旂┒", + author: "寰愯崳/鏉庣敓瀹� 浣欏嘲/钂嬮綈钁�", + }, + ], + }; + }, + created() { + }, + methods: { + deleteItem(item, index) { + this.$confirm("鏄惁鍒犻櫎褰撳墠鏍蜂功?", "鎻愮ず", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning", + }) + .then(() => { + this.$store.commit("deletePbookList", index); + this.$message({ + type: "success", + message: "鍒犻櫎鎴愬姛!", + }); + }) + .catch(() => {}); + }, + createList() { + if (this.$store.state.userInfo.role !== "Teacher") { + this.$message({ + showClose: true, + message: "璇峰厛杩涜鏁欏笀璁よ瘉", + type: "warning", + }); + return; + } + if (this.$store.state.paperCopiesList.length == 0) { + this.$message.error("璇锋坊鍔犵焊璐ㄦ牱涔﹀悗鐢熸垚娓呭崟锛�"); + return; + } else { + this.$router.push("applyBook-paper"); + } + // this.$store.commit("addPbookList", this.dataList[0]); + }, + }, +}; +</script> + +<style scoped> +.relatedBox { + width: 377px; + margin-top: 10px; + border-top: 1px solid #00873c; +} +.titleBox { + height: 60px; + background: #d8f7e6; + line-height: 60px; + padding: 0 40px; + font-weight: 700; + color: #00873c; + font-size: 18px; +} +.bookBox { + background-color: #fff; + padding: 10px; +} +.imgBox { + width: 100px; + height: 150px; + position: relative; + padding: 10px; + border: 1px solid #ccc; +} +.rightBox { + position: relative; + margin-left: 10px; + flex: 1; + overflow: hidden; +} +.itemBox { + display: flex; + border-bottom: 1px solid #eeeeee; + padding: 10px; +} +.bookName { + font-size: 16px !important; + line-height: 20px; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; /* 杩欓噷鏄秴鍑哄嚑琛岀渷鐣� */ + overflow: hidden; +} +.authorBox1 { + margin-top: 10px; + color: #666666; + position: relative; +} +.toDetail { + margin-top: 50px; + color: #00873c; +} +.authorName { + position: absolute; + line-height: 20px; + top: -4px; + left: 44px; +} +.headBox { + display: flex; + justify-content: space-between; + background: #d8f7e6; +} +.inventory { + cursor: pointer; + padding: 20px; + color: #999; +} +.iconBox { + position: absolute; + bottom: 20px; + right: 20px; + display: none; + cursor: pointer; + color: red; +} +.itemBox:hover .iconBox { + display: block; +} +.emptyBox { + background-color: #fff; +} +</style> -- Gitblit v1.9.1