|
@@ -1,722 +0,0 @@
|
|
|
-<!-- -->
|
|
|
-<template>
|
|
|
- <div class="wordIntp" v-if="word">
|
|
|
- <div class="closeBox">
|
|
|
- <span>数据来自百度汉语</span>
|
|
|
- <i class="el-icon-close" @click="changeIntpShow(false)"></i>
|
|
|
- </div>
|
|
|
- <div class="bwc-top" v-if="word.detail">
|
|
|
- <span v-if="word.detail.pinyin">{{ word.detail.pinyin }}</span>
|
|
|
- <Audio
|
|
|
- :fontSize="20"
|
|
|
- :mp3="mp3Url ? mp3Url : ''"
|
|
|
- :themeColor="themeColor"
|
|
|
- />
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="bwc-Strockplay"
|
|
|
- :style="{ width: word.detail.new_word.length * 126 + 4 + 'px' }"
|
|
|
- v-if="word.detail.new_word.length < 5"
|
|
|
- >
|
|
|
- <div
|
|
|
- :key="conindex"
|
|
|
- class="strockplay"
|
|
|
- v-for="(conItem, conindex) in word.list"
|
|
|
- >
|
|
|
- <Strockplayredline
|
|
|
- :Book_text="conItem"
|
|
|
- :playStorkes="true"
|
|
|
- :targetDiv="'bwcIntp' + conItem + conindex"
|
|
|
- :wordNum="word.detail.new_word.length"
|
|
|
- />
|
|
|
- <div
|
|
|
- class="bwc-line"
|
|
|
- v-if="conindex < word.detail.new_word.length - 1"
|
|
|
- ></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <p v-else class="bwc-tolength">
|
|
|
- <span v-for="(item, index) in word.detail.new_word" :key="index">{{
|
|
|
- item
|
|
|
- }}</span>
|
|
|
- </p>
|
|
|
- <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.detail.pinyin" class="pinyin">{{
|
|
|
- word.detail.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"],
|
|
|
- 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.detail.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: 600px;
|
|
|
- // 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;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.NPC-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;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.NPC-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;
|
|
|
- }
|
|
|
-}
|
|
|
-.NPC-Big-Book-preview-green {
|
|
|
- .wordIntp {
|
|
|
- .el-menu--horizontal > .el-menu-item.is-active {
|
|
|
- color: #24b99e;
|
|
|
- border-bottom: 2px solid #24b99e;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.NPC-Big-Book-preview-brown {
|
|
|
- .wordIntp {
|
|
|
- .el-menu--horizontal > .el-menu-item.is-active {
|
|
|
- color: #bd8865;
|
|
|
- border-bottom: 2px solid #bd8865;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|