|
@@ -215,7 +215,12 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <Intp :word="data" :themeColor="themeColor" :type="type" />
|
|
|
+ <Intp
|
|
|
+ :word="data"
|
|
|
+ :dataDetail="dataDetail"
|
|
|
+ :themeColor="themeColor"
|
|
|
+ :type="type"
|
|
|
+ />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
@@ -224,7 +229,7 @@
|
|
|
import Strockplayredline from "./Strockplayredline.vue";
|
|
|
import Audio from "./AudioRed.vue";
|
|
|
import Intp from "./Intp.vue";
|
|
|
-import { getContent } from "../../../../api/ajax";
|
|
|
+import { getContent, getHZChineseInfo } from "../../../../api/ajax";
|
|
|
|
|
|
export default {
|
|
|
//import引入的组件需要注入到对象中才能使用
|
|
@@ -262,6 +267,7 @@ export default {
|
|
|
loading1: false,
|
|
|
loading2: false,
|
|
|
loading3: false,
|
|
|
+ dataDetail: null,
|
|
|
};
|
|
|
},
|
|
|
//计算属性 类似于data概念
|
|
@@ -273,6 +279,9 @@ export default {
|
|
|
const _this = this;
|
|
|
if (val) {
|
|
|
_this.initData();
|
|
|
+ if (_this.type == "newWordDetail") {
|
|
|
+ _this.getChineseInfo();
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
// 深度观察监听
|
|
@@ -409,26 +418,50 @@ export default {
|
|
|
},
|
|
|
|
|
|
initData() {
|
|
|
- console.log(this.data);
|
|
|
this.viewIntp();
|
|
|
- // let Fathernode = document.getElementsByClassName(
|
|
|
- // "NPC-Big-Book-preview"
|
|
|
- // )[0];
|
|
|
- // if (Fathernode) {
|
|
|
- // // this.height = Fathernode.clientHeight + "px";
|
|
|
- // this.height = window.innerHeight + "px";
|
|
|
- // this.margintop = "-" + window.innerHeight / 2 + "px";
|
|
|
- // }
|
|
|
},
|
|
|
handleChangeTab(flag) {
|
|
|
this[flag] = !this[flag];
|
|
|
},
|
|
|
+ getChineseInfo() {
|
|
|
+ let _this = this;
|
|
|
+ let data = {
|
|
|
+ query: _this.data.new_word,
|
|
|
+ };
|
|
|
+ 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.data.mp3Url = itemss.objects[0]["@value"]
|
|
|
+ ? itemss.objects[0]["@value"]
|
|
|
+ : "";
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
},
|
|
|
//生命周期 - 创建完成(可以访问当前this实例)
|
|
|
created() {},
|
|
|
//生命周期 - 挂载完成(可以访问DOM元素)
|
|
|
mounted() {
|
|
|
- this.initData();
|
|
|
+ let _this = this;
|
|
|
+ _this.initData();
|
|
|
+ if (_this.type == "newWordDetail") {
|
|
|
+ _this.getChineseInfo();
|
|
|
+ }
|
|
|
},
|
|
|
//生命周期-创建之前
|
|
|
beforeCreated() {},
|
|
@@ -547,11 +580,13 @@ export default {
|
|
|
border: 2px solid #bd8865;
|
|
|
}
|
|
|
.wordInfor {
|
|
|
+ flex: 1;
|
|
|
.yinpin {
|
|
|
display: flex;
|
|
|
justify-content: flex-start;
|
|
|
align-items: center;
|
|
|
margin-bottom: 16px;
|
|
|
+ width: fit-content;
|
|
|
.pinyintext {
|
|
|
font-size: 20px;
|
|
|
line-height: 30px;
|