index.vue 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271
  1. <template>
  2. <div class="teacher_edu">
  3. <!-- 头部导航及搜索 -->
  4. <Header />
  5. <div class="nav_title">
  6. <div class="inner">
  7. <el-menu
  8. :default-active="activeIndex"
  9. class="el-menu-demo"
  10. mode="horizontal"
  11. @select="handleSelect"
  12. text-color="#000"
  13. active-text-color="#FF9900"
  14. >
  15. <el-menu-item index="TEXTBOOK">
  16. <!-- 教辅资料 -->{{ $t("Key554") }}
  17. </el-menu-item>
  18. <el-menu-item index="TEACHING">
  19. <!-- 教研资料 -->{{ $t("Key214") }}
  20. </el-menu-item>
  21. <el-menu-item index="TOOLBOOK">
  22. <!-- 工具书 -->{{ $t("Key555") }}
  23. </el-menu-item>
  24. </el-menu>
  25. <div class="seek" @keyup="keyDownSeekData">
  26. <!-- 搜索课程 -->
  27. <input
  28. type="text"
  29. name=""
  30. id=""
  31. :placeholder="$t('Key43')"
  32. v-model="SeekName"
  33. @change="SeekName = SeekName.trim()"
  34. />
  35. <img
  36. @click="gotoSeekResult"
  37. src="../../assets/teacherdev/Group2149.png"
  38. alt=""
  39. />
  40. </div>
  41. </div>
  42. </div>
  43. <!-- 主要信息列表 -->
  44. <div class="main" v-loading="loading">
  45. <div id="TEXTBOOK" v-if="teachingList">
  46. <Teaching v-if="teachingList.data" :classList="teachingList.data" />
  47. </div>
  48. <div id="TEACHING" v-if="textBookList">
  49. <Textbook v-if="textBookList.data" :classList="textBookList.data" />
  50. </div>
  51. <div id="TOOLBOOK" v-if="toolBookList">
  52. <ToolBook v-if="toolBookList.data" :classList="toolBookList.data" />
  53. </div>
  54. </div>
  55. </div>
  56. </template>
  57. <script>
  58. import Header from "@/components/Header";
  59. import Word from "@/components/teacher-dev/Word";
  60. import Ppt from "@/components/teacher-dev/Ppt";
  61. import Pdf from "@/components/teacher-dev/Pdf";
  62. import Excel from "@/components/teacher-dev/Excel";
  63. import Textbook from "@/components/teacher-dev/Textbook";
  64. import Teaching from "@/components/teacher-dev/Teaching";
  65. import ToolBook from "@/components/teacher-dev/ToolBook";
  66. import { materiallist } from "@/api/api";
  67. import { updateWordPack } from "@/utils/i18n";
  68. export default {
  69. name: "teacher_edu",
  70. components: {
  71. Header,
  72. Word,
  73. Ppt,
  74. Pdf,
  75. Excel,
  76. Teaching,
  77. Textbook,
  78. ToolBook,
  79. },
  80. data() {
  81. return {
  82. activeIndex: "TEXTBOOK",
  83. navName: "CLASSICAL COURSE",
  84. SeekName: "",
  85. loading: false,
  86. dataList: null,
  87. textBookList: null, //book数据
  88. teachingList: null, // tea数据
  89. toolBookList: null, //工具书
  90. };
  91. },
  92. computed: {},
  93. methods: {
  94. // 切换导航
  95. handleSelect(key, keyPath) {
  96. console.log(key, keyPath);
  97. this.navName = key;
  98. this.changeNav(key);
  99. },
  100. // 锚点定位
  101. changeNav(index) {
  102. let id = index;
  103. let dom = document.getElementById(id);
  104. if (dom) {
  105. document.getElementById(id).scrollIntoView();
  106. }
  107. },
  108. // 前往搜索结果
  109. gotoSeekResult() {
  110. if (this.SeekName != "") {
  111. this.SeekName = this.SeekName.trim();
  112. this.$router.push({
  113. path: "/Viewmore",
  114. query: { keyWord: this.SeekName },
  115. });
  116. } else {
  117. this.$message.warning("请输入内容");
  118. }
  119. },
  120. keyDownSeekData(e) {
  121. if (e.keyCode == 13) {
  122. this.gotoSeekResult();
  123. }
  124. },
  125. // 获取数据
  126. getData() {
  127. this.loading = true;
  128. materiallist({
  129. pageNum: 1,
  130. pageSize: 10,
  131. tagList: ["TEXTBOOK"],
  132. keyWord: this.keyWord,
  133. })
  134. .then((res) => {
  135. this.textBookList = res.data;
  136. })
  137. .catch((res) => {
  138. this.loading = false;
  139. });
  140. materiallist({
  141. pageNum: 1,
  142. pageSize: 10,
  143. tagList: ["TEACHING"],
  144. keyWord: this.keyWord,
  145. })
  146. .then((res) => {
  147. this.teachingList = res.data;
  148. this.loading = false;
  149. })
  150. .catch((res) => {
  151. this.loading = false;
  152. });
  153. materiallist({
  154. pageNum: 1,
  155. pageSize: 10,
  156. tagList: ["TOOLBOOK"],
  157. keyWord: this.keyWord,
  158. })
  159. .then((res) => {
  160. this.toolBookList = res.data;
  161. this.loading = false;
  162. })
  163. .catch((res) => {
  164. this.loading = false;
  165. });
  166. },
  167. },
  168. async created() {
  169. await updateWordPack({
  170. word_key_list: [
  171. "Key5",
  172. "Key8",
  173. "Key9",
  174. "Key39",
  175. "Key43",
  176. "Key47",
  177. "Key214",
  178. "Key214",
  179. "Key554",
  180. "Key555",
  181. ],
  182. });
  183. this.isData = true;
  184. // 需要根据身份信息来判断是进入首页还是录入
  185. // if (token) {
  186. // if (JSON.parse(token).popedom_code_list.indexOf(2000006) != -1) {
  187. // this.$router.push("/teacherdevEntering");
  188. // } else {
  189. // this.$router.push({ path: "/" });
  190. // }
  191. // }
  192. // this.loading = true;
  193. // // 验证登录拿到JSESSIONID放到cookies中后面的接口用来验证用户身份
  194. // VerifyLogin()
  195. // .then((res) => {
  196. // if (res.data?.JSESSSIONID) {
  197. // Cookies.set("JSESSIONID", res.data.JSESSSIONID);
  198. //
  199. // }
  200. // })
  201. // .catch((res) => {
  202. // this.loading = false;
  203. // });
  204. },
  205. mounted() {
  206. this.getData();
  207. },
  208. };
  209. </script>
  210. <style lang="scss" scoped>
  211. .teacher_edu {
  212. min-height: 100vh;
  213. background: #f6f6f6;
  214. .seek {
  215. width: 300px;
  216. height: 40px;
  217. background: #ffffff;
  218. border: 1px solid #d9d9d9;
  219. box-sizing: border-box;
  220. border-radius: 8px;
  221. display: flex;
  222. align-items: center;
  223. justify-content: space-between;
  224. padding: 0 16px;
  225. input {
  226. width: 90%;
  227. border: none;
  228. outline: none;
  229. margin-left: 5px;
  230. }
  231. img {
  232. width: 18px;
  233. height: 18px;
  234. }
  235. }
  236. .nav_title {
  237. background: #fff;
  238. .inner {
  239. width: 1200px;
  240. margin: 0 auto;
  241. display: flex;
  242. justify-content: space-between;
  243. align-items: center;
  244. font-weight: 600;
  245. }
  246. .el-menu-item {
  247. font-size: 16px;
  248. }
  249. // 取消组件默认的样式
  250. .el-menu.el-menu--horizontal {
  251. border-bottom: none;
  252. }
  253. }
  254. .main {
  255. min-height: 80vh;
  256. background: #f6f6f6;
  257. padding-bottom: 50px;
  258. }
  259. }
  260. </style>
  261. <style lang="scss">
  262. .seek {
  263. .el-input__prefix {
  264. color: black;
  265. }
  266. }
  267. </style>