| | |
| | | v-for="(citem, cindex) in item.list" |
| | | :style="{ background: citem.color }" |
| | | @mouseover="showDetail(index, cindex, 1)" |
| | | @mouseout="closeDetail(index, cindex, 0)" |
| | | :key="cindex" |
| | | > |
| | | <div class="detailDialog" v-if="citem.showDetail"> |
| | | <!-- <div class="dialogContent" @click="gotoDetail(citem)"> --> |
| | | <floatingWindow :info="citem" /> |
| | | <floatingWindow :info="citem" /> |
| | | <!-- </div> --> |
| | | </div> |
| | | </div> |
| | |
| | | showDetail: false, |
| | | name: "王永炎", |
| | | year: "1938", |
| | | type: "journal", |
| | | id: "1", |
| | | }, |
| | | ], |
| | |
| | | showDetail: false, |
| | | name: "王永炎", |
| | | year: "1937", |
| | | type: "image", |
| | | id: "1", |
| | | }, |
| | | { |
| | |
| | | showDetail: false, |
| | | name: "王永炎", |
| | | year: "1937", |
| | | type: "book", |
| | | id: "2", |
| | | }, |
| | | ], |
| | |
| | | color: "#87A7B9", |
| | | showDetail: false, |
| | | name: "王永炎", |
| | | type: "video", |
| | | id: "3", |
| | | }, |
| | | { |
| | | color: "#87A7B9", |
| | | showDetail: false, |
| | | name: "王永炎", |
| | | type: "audio", |
| | | id: "4", |
| | | }, |
| | | { |
| | |
| | | |
| | | methods: { |
| | | gotoDetail(item) {}, |
| | | |
| | | closeDetail(index, cindex, type) { |
| | | // console.log(cindex, "cindex"); |
| | | // for (let i = 0; i < this.contentList.length; i++) { |
| | | // const item = this.contentList[i]; |
| | | // for (let j = 0; j < item.list.length; j++) { |
| | | // const citem = item.list[j]; |
| | | // this.$set(citem, "showDetail", false); |
| | | // } |
| | | // } |
| | | |
| | | }, |
| | | showDetail(index, cindex, type) { |
| | | for (let i = 0; i < this.contentList.length; i++) { |
| | | const item = this.contentList[i]; |
| | |
| | | this.$set(citem, "showDetail", false); |
| | | } |
| | | } |
| | | if (type == 1) { |
| | | |
| | | if (this.contentList[index].list[cindex].type) { |
| | | this.contentList[index].list[cindex].showDetail = true; |
| | | } else { |
| | | this.contentList[index].list[cindex].showDetail = false; |
| | |
| | | } |
| | | } |
| | | .page-header { |
| | | height: 102px; |
| | | height: 9.4%; |
| | | width: 100%; |
| | | text-align: left; |
| | | margin-bottom: 8px; |
| | | border-bottom: 2px solid #937950; |
| | | |
| | | p { |
| | | padding: 35px 0 34px 0; |
| | | padding: 1.6% 0 1.55% 0; |
| | | font-family: Alimama DongFangDaKai; |
| | | font-size: 30px; |
| | | text-indent: 1em; |
| | |
| | | z-index: 9999; |
| | | cursor: pointer; |
| | | background: #fff; |
| | | border: 2px solid #CBBEAA; |
| | | border: 2px solid #cbbeaa; |
| | | box-shadow: 2px 2px 4px 1px rgba(0, 0, 0, 0.5); |
| | | } |
| | | |