|
|
@@ -0,0 +1,681 @@
|
|
|
+<!-- -->
|
|
|
+<template>
|
|
|
+ <div class="wordIntp" v-if="word">
|
|
|
+ <el-menu
|
|
|
+ :default-active="activeIndex"
|
|
|
+ class="el-menu-demo"
|
|
|
+ mode="horizontal"
|
|
|
+ @select="handleSelect"
|
|
|
+ >
|
|
|
+ <el-menu-item index="1">释义</el-menu-item>
|
|
|
+ <el-menu-item index="2">近/反义词</el-menu-item>
|
|
|
+ <el-menu-item index="3">组词</el-menu-item>
|
|
|
+ </el-menu>
|
|
|
+ <template v-if="activeIndex == '1'">
|
|
|
+ <div class="bwc-intp">
|
|
|
+ <!-- 基本释义 -->
|
|
|
+ <h1>基本释义</h1>
|
|
|
+ <span v-if="word.pinyin" class="pinyin">{{ word.pinyin }}</span>
|
|
|
+ <p
|
|
|
+ v-for="(itemss, indexss) in paraphrase"
|
|
|
+ :key="indexss"
|
|
|
+ class="paraphrase"
|
|
|
+ >
|
|
|
+ {{ itemss["@value"] }}
|
|
|
+ </p>
|
|
|
+ <hr />
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-if="activeIndex == '2'">
|
|
|
+ <div class="bwc-intp">
|
|
|
+ <h1 v-if="synonymList.length > 0">近义词</h1>
|
|
|
+ <ul class="synonym">
|
|
|
+ <li
|
|
|
+ v-for="(itemss, indexss) in synonymList"
|
|
|
+ :key="indexss"
|
|
|
+ class="paraphrase"
|
|
|
+ >
|
|
|
+ {{ itemss["@value"] }}
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <h1 v-if="antonymList.length > 0">反义词</h1>
|
|
|
+ <ul class="synonym">
|
|
|
+ <li
|
|
|
+ v-for="(itemss, indexss) in antonymList"
|
|
|
+ :key="indexss"
|
|
|
+ class="paraphrase"
|
|
|
+ >
|
|
|
+ {{ itemss["@value"] }}
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-if="activeIndex == '3'">
|
|
|
+ <div class="bwc-intp">
|
|
|
+ <ul class="synonym">
|
|
|
+ <li
|
|
|
+ v-for="(itemss, indexss) in termsList"
|
|
|
+ :key="indexss"
|
|
|
+ class="paraphrase"
|
|
|
+ >
|
|
|
+ {{ itemss["@value"] }}
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import Audio from "./AudioRed.vue";
|
|
|
+import Strockplayredline from "./Strockplayredline.vue";
|
|
|
+import { getHZChineseInfo } from "@/api/ajax";
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "WordIntp",
|
|
|
+ components: {
|
|
|
+ Strockplayredline,
|
|
|
+ Audio,
|
|
|
+ },
|
|
|
+ props: ["word", "changeIntpShow", "themeColor", "show"],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ isPraShow: false,
|
|
|
+ curData: null,
|
|
|
+ activeIndex: "1",
|
|
|
+ mp3Url: "", // 音频
|
|
|
+ paraphrase: [], // 释义
|
|
|
+ synonymList: [], // 近义词
|
|
|
+ antonymList: [], // 反义词
|
|
|
+ termsList: [], // 组词
|
|
|
+ dataDetail: [
|
|
|
+ {
|
|
|
+ request: {
|
|
|
+ query: "生",
|
|
|
+ queryType: "entity",
|
|
|
+ },
|
|
|
+ response: {
|
|
|
+ voice:
|
|
|
+ "这个字读: shēng，一(yi1)声，诗(shi1)鞥(eng1)，生(sheng1)，意思是：1、生育；出生。 2、生长。 ",
|
|
|
+ sourceUrl:
|
|
|
+ "https://hanyu.baidu.com/zici/s?wd=%E7%94%9F&query=%E7%94%9F&srcid=28532&from=kg2",
|
|
|
+ answer: ["生"],
|
|
|
+ sourceName: "百度汉语",
|
|
|
+ title: "生",
|
|
|
+ entity: [
|
|
|
+ {
|
|
|
+ "@type": ["word"],
|
|
|
+ name: "生",
|
|
|
+ attrs: [
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value":
|
|
|
+ "http://t10.baidu.com/it/u=1615089267,1656681114&fm=58&s=6BAC3062C6E167A91D9015D70300A0A0",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "图片",
|
|
|
+ type: "simple",
|
|
|
+ key: "image",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value":
|
|
|
+ "https://hanyu.baidu.com/zici/s?wd=%E7%94%9F&query=%E7%94%9F&srcid=28532&from=kg2",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "详情页",
|
|
|
+ type: "simple",
|
|
|
+ key: "url",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value": "熟",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "死",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "师",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "卒",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "反义词",
|
|
|
+ type: "simple",
|
|
|
+ key: "antonym",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value":
|
|
|
+ "1.生育；出生。 2.生长。 3.生存；活（跟“死”相对）。 4.生计。 5.生命。 6.生平。 7.具有生命力的；活的。 8.产生；发生。 9.使柴、煤等燃烧。 10.姓。11.果实没有成熟（跟“熟”相对，下12.—13.同）。 14.（食物）没有煮过或煮得不够的。 15.没有进一步加工或炼过的。 16.生疏。 17.生硬；勉强。 18.很（用在少数表示感情、感觉的词的前面）。 19.某些指人的名词后缀。 20.某些副词的后缀，如“好生、怎生”等。",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "释义",
|
|
|
+ type: "simple",
|
|
|
+ key: "definition",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value":
|
|
|
+ "https://hanyu-word-pinyin-short.cdn.bcebos.com/sheng1.mp3",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "读音",
|
|
|
+ type: "simple",
|
|
|
+ key: "pronunciation",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value": "生",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "部首",
|
|
|
+ type: "simple",
|
|
|
+ key: "radicals",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value": "[shēng]",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "拼音",
|
|
|
+ type: "simple",
|
|
|
+ key: "spell",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value": "5",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "笔画",
|
|
|
+ type: "simple",
|
|
|
+ key: "stroke_count",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value": "撇、横、横、竖、横",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "笔顺",
|
|
|
+ type: "simple",
|
|
|
+ key: "stroke_order",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value":
|
|
|
+ "http://appcdn.fanyi.baidu.com/zhdict/gif/b78128322d51c43cbaf2701d467822446.gif",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "笔顺动画",
|
|
|
+ type: "simple",
|
|
|
+ key: "stroke_order_gif",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value": "单一结构",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "字形结构",
|
|
|
+ type: "simple",
|
|
|
+ key: "struct_type",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value": "生命",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "五行相生",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "生活",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "大学生",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "诞生",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "生肖",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "油然而生",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "舍生取义",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "栩栩如生",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "芸芸众生",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "生意",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "生机盎然",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "生气",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "妙笔生花",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "浮生",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "陌生",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "衍生",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "生机勃勃",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "生意盎然",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "@value": "终生",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "组词",
|
|
|
+ type: "simple",
|
|
|
+ key: "terms",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ objects: [
|
|
|
+ {
|
|
|
+ "@value": "TGD",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label: "五笔",
|
|
|
+ type: "simple",
|
|
|
+ key: "wubi",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {},
|
|
|
+ watch: {
|
|
|
+ word: {
|
|
|
+ handler: function (val, oldVal) {
|
|
|
+ let _this = this;
|
|
|
+ },
|
|
|
+ // 深度观察监听
|
|
|
+ deep: true,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ //方法集合
|
|
|
+ methods: {
|
|
|
+ writeWord() {
|
|
|
+ this.isPraShow = true;
|
|
|
+ },
|
|
|
+ changePraShow() {
|
|
|
+ this.isPraShow = false;
|
|
|
+ },
|
|
|
+ handleSelect(val) {
|
|
|
+ this.activeIndex = val;
|
|
|
+ },
|
|
|
+ getChineseInfo() {
|
|
|
+ let _this = this;
|
|
|
+ let data = {
|
|
|
+ query: this.word.new_word,
|
|
|
+ // query: "开心",
|
|
|
+ };
|
|
|
+ getHZChineseInfo(data).then((res) => {
|
|
|
+ _this.dataDetail = res.data.result;
|
|
|
+ _this.handleChineseDetail();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 处理数据
|
|
|
+ handleChineseDetail() {
|
|
|
+ let _this = this;
|
|
|
+ _this.dataDetail.forEach((item) => {
|
|
|
+ if (item.request.queryType == "entity") {
|
|
|
+ // 读音
|
|
|
+ item.response.entity.forEach((items) => {
|
|
|
+ items.attrs.forEach((itemss) => {
|
|
|
+ if (itemss.key == "pronunciation") {
|
|
|
+ // 音频
|
|
|
+ _this.mp3Url = itemss.objects[0]["@value"]
|
|
|
+ ? itemss.objects[0]["@value"]
|
|
|
+ : "";
|
|
|
+ } else if (itemss.key == "definition") {
|
|
|
+ // 释义
|
|
|
+ _this.paraphrase = itemss.objects;
|
|
|
+ } else if (itemss.key == "synonym") {
|
|
|
+ // 近义词
|
|
|
+ _this.synonymList = itemss.objects;
|
|
|
+ } else if (itemss.key == "antonym") {
|
|
|
+ // 反义词
|
|
|
+ _this.antonymList = itemss.objects;
|
|
|
+ } else if (itemss.key == "terms") {
|
|
|
+ // 反义词
|
|
|
+ _this.termsList = itemss.objects;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ //生命周期 - 创建完成（可以访问当前this实例）
|
|
|
+ created() {},
|
|
|
+ //生命周期 - 挂载完成（可以访问DOM元素）
|
|
|
+ mounted() {
|
|
|
+ let _this = this;
|
|
|
+ // this.getChineseInfo();
|
|
|
+ _this.handleChineseDetail();
|
|
|
+ },
|
|
|
+ beforeCreate() {}, //生命周期 - 创建之前
|
|
|
+ beforeMount() {}, //生命周期 - 挂载之前
|
|
|
+ beforeUpdate() {}, //生命周期 - 更新之前
|
|
|
+ updated() {}, //生命周期 - 更新之后
|
|
|
+ beforeDestroy() {}, //生命周期 - 销毁之前
|
|
|
+ destroyed() {}, //生命周期 - 销毁完成
|
|
|
+ activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang='scss' scoped>
|
|
|
+//@import url(); 引入公共css类
|
|
|
+.wordIntp {
|
|
|
+ width: 100%;
|
|
|
+ // height: 100vh;
|
|
|
+ overflow: hidden;
|
|
|
+ overflow-y: auto;
|
|
|
+ margin: 0 auto;
|
|
|
+ position: relative;
|
|
|
+ .bwc-intp {
|
|
|
+ padding: 16px 0;
|
|
|
+ h1 {
|
|
|
+ color: #000000;
|
|
|
+ font-size: 20px;
|
|
|
+ line-height: 150%;
|
|
|
+ font-weight: normal;
|
|
|
+ margin: 8px 0 8px 0;
|
|
|
+ }
|
|
|
+ .pinyin {
|
|
|
+ color: #de4444;
|
|
|
+ font-size: 24px;
|
|
|
+ line-height: 36px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ font-family: "GB-PINYINOK-B";
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ .paraphrase {
|
|
|
+ margin-bottom: 8px;
|
|
|
+ margin-top: 0;
|
|
|
+ color: #000000;
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 150%;
|
|
|
+ }
|
|
|
+ hr {
|
|
|
+ margin: 16px 0 0 0;
|
|
|
+ background: rgba($color: #000000, $alpha: 0.15);
|
|
|
+ height: 1px;
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ ul.synonym {
|
|
|
+ display: flex;
|
|
|
+ flex-flow: wrap;
|
|
|
+ margin-left: -4px;
|
|
|
+ padding: 4px 0;
|
|
|
+ li {
|
|
|
+ padding: 4px 8px;
|
|
|
+ background: #ffffff;
|
|
|
+ border: 1px solid rgba(0, 0, 0, 0.15);
|
|
|
+ border-radius: 4px;
|
|
|
+ margin: 4px;
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 150%;
|
|
|
+ color: #000000;
|
|
|
+ text-align: center;
|
|
|
+ min-width: 127px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .practiceBox {
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ z-index: 999;
|
|
|
+ width: 100%;
|
|
|
+ height: 100vh;
|
|
|
+ background: rgba(0, 0, 0, 0.19);
|
|
|
+ padding-top: 32px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow: hidden;
|
|
|
+ overflow-y: auto;
|
|
|
+ }
|
|
|
+ .closeBox {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ padding: 12px;
|
|
|
+ > i {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #000000;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ span {
|
|
|
+ color: #000000;
|
|
|
+ opacity: 0.2;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 130%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ min-width: 312px;
|
|
|
+ min-height: 360px;
|
|
|
+ background: #ffffff;
|
|
|
+ box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.15);
|
|
|
+ border-radius: 8px;
|
|
|
+ padding: 52px 32px 32px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .bwc-top {
|
|
|
+ margin-bottom: 16px;
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ .content-voices {
|
|
|
+ width: 24px;
|
|
|
+ }
|
|
|
+ > span {
|
|
|
+ font-family: "GB-PINYINOK-B";
|
|
|
+ color: #2c2c2c;
|
|
|
+ font-size: 20px;
|
|
|
+ line-height: 24px;
|
|
|
+ margin-right: 4px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bwc-Strockplay {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ min-width: 130px;
|
|
|
+ height: 130px;
|
|
|
+ margin: 0 auto;
|
|
|
+ margin-bottom: 6px;
|
|
|
+ border: 2px solid #de4444;
|
|
|
+ border-radius: 8px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow: hidden;
|
|
|
+ .strockplay {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ position: relative;
|
|
|
+ .collect-icon {
|
|
|
+ width: 16px;
|
|
|
+ position: absolute;
|
|
|
+ right: 4px;
|
|
|
+ bottom: 4px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bwc-line {
|
|
|
+ width: 2px;
|
|
|
+ height: 126px;
|
|
|
+ background: #de4444;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bwc-tolength {
|
|
|
+ color: #404040;
|
|
|
+ font-size: 30px;
|
|
|
+ line-height: 1.5;
|
|
|
+ font-family: FZJCGFKTK;
|
|
|
+ text-align: center;
|
|
|
+ border: 2px solid #de4444;
|
|
|
+ border-radius: 8px;
|
|
|
+ padding: 40px 0;
|
|
|
+ margin: 0 0 16px 0;
|
|
|
+ }
|
|
|
+ .bwc-word-en {
|
|
|
+ font-style: normal;
|
|
|
+ font-weight: 600;
|
|
|
+ font-size: 20px;
|
|
|
+ line-height: 150%;
|
|
|
+ text-align: center;
|
|
|
+ color: #2c2c2c;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ }
|
|
|
+ .bwc-more-intp {
|
|
|
+ font-weight: normal;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 20px;
|
|
|
+ color: #2c2c2c;
|
|
|
+ opacity: 0.5;
|
|
|
+ text-align: center;
|
|
|
+ margin-bottom: 24px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .bwc-footer {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ > button {
|
|
|
+ width: 128px;
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ color: #ff5757;
|
|
|
+ background: rgba(255, 87, 87, 0.1);
|
|
|
+ border-radius: 4px;
|
|
|
+ outline: 0;
|
|
|
+ border: 0;
|
|
|
+ cursor: pointer;
|
|
|
+ > img {
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ margin-right: 8px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.NNPE-Big-Book-preview-green {
|
|
|
+ .wordIntp {
|
|
|
+ .bwc-intp {
|
|
|
+ .pinyin {
|
|
|
+ color: #24b99e;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bwc-Strockplay {
|
|
|
+ border: 2px solid #24b99e;
|
|
|
+ .bwc-line {
|
|
|
+ background: #24b99e;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bwc-tolength {
|
|
|
+ border: 2px solid #24b99e;
|
|
|
+ }
|
|
|
+ .bwc-footer {
|
|
|
+ > button {
|
|
|
+ color: #24b99e;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.NNPE-Big-Book-preview-brown {
|
|
|
+ .wordIntp {
|
|
|
+ .bwc-intp {
|
|
|
+ .pinyin {
|
|
|
+ color: #bd8865;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bwc-Strockplay {
|
|
|
+ border: 2px solid #bd8865;
|
|
|
+ .bwc-line {
|
|
|
+ background: #bd8865;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bwc-tolength {
|
|
|
+ border: 2px solid #bd8865;
|
|
|
+ }
|
|
|
+ .bwc-footer {
|
|
|
+ > button {
|
|
|
+ color: #bd8865;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style lang="scss">
|
|
|
+.wordIntp {
|
|
|
+ .el-menu--horizontal > .el-menu-item {
|
|
|
+ width: 33.33%;
|
|
|
+ text-align: center;
|
|
|
+ color: #000000;
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+ .el-menu.el-menu--horizontal {
|
|
|
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
+ }
|
|
|
+ .el-menu--horizontal > .el-menu-item.is-active {
|
|
|
+ color: #de4444;
|
|
|
+ font-weight: bold;
|
|
|
+ border-bottom: 2px solid #de4444;
|
|
|
+ }
|
|
|
+}
|
|
|
+.NNPE-Big-Book-preview-green {
|
|
|
+ .wordIntp {
|
|
|
+ .el-menu--horizontal > .el-menu-item.is-active {
|
|
|
+ color: #24b99e;
|
|
|
+ border-bottom: 2px solid #24b99e;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.NNPE-Big-Book-preview-brown {
|
|
|
+ .wordIntp {
|
|
|
+ .el-menu--horizontal > .el-menu-item.is-active {
|
|
|
+ color: #bd8865;
|
|
|
+ border-bottom: 2px solid #bd8865;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
秦鹏