|
@@ -1,7 +1,7 @@
|
|
|
<template>
|
|
|
<div class="containe">
|
|
|
<div class="picture">
|
|
|
- <img src="../../assets/img/Group 467.png" alt="" />
|
|
|
+ <img src="../../assets/img/Group 467.png" alt=""/>
|
|
|
</div>
|
|
|
<div class="search">
|
|
|
<!-- <el-select v-model="type">
|
|
@@ -10,16 +10,16 @@
|
|
|
<el-option value="3" label="个人文档">个人文档</el-option>
|
|
|
</el-select> -->
|
|
|
<el-input auto-complete="on" type="text" name="content" placeholder="请输入查询关键字" v-model="input"
|
|
|
- @keyup.enter.native="searchPre"></el-input>
|
|
|
+ @keyup.enter.native="searchPre"></el-input>
|
|
|
<span class="cen—top-span" @click="searchPre">快速搜索</span>
|
|
|
- <img src="../../assets/img/ri:search-2-line@2x.png" class="cen—top-img" />
|
|
|
+ <img src="../../assets/img/ri:search-2-line@2x.png" class="cen—top-img"/>
|
|
|
</div>
|
|
|
|
|
|
<div class="main1">
|
|
|
<div class="range">
|
|
|
<p class="range-p">文档范围:</p>
|
|
|
- <el-radio-group v-model="type" size="small" class="range-ul" fill="#2E8AECFF" text-color="#fff">
|
|
|
- <el-radio-button label="1">公共文档</el-radio-button>
|
|
|
+ <el-radio-group v-model="type" size="small" class="range-ul" fill="#2E8AECFF" text-color="#fff" @change="searchPre">
|
|
|
+ <el-radio-button label="1" >公共文档</el-radio-button>
|
|
|
<el-radio-button label="2">部门文档</el-radio-button>
|
|
|
<el-radio-button label="3">个人文档</el-radio-button>
|
|
|
</el-radio-group>
|
|
@@ -51,23 +51,23 @@
|
|
|
</div> -->
|
|
|
</div>
|
|
|
|
|
|
- <div class="mains" @scroll="handleScroll" v-if="mains_data2">
|
|
|
+ <div class="mains" @scroll="handleScroll">
|
|
|
<div v-for="item in count" :key="item.id" class="main-main">
|
|
|
<div class="one" @click="docName(item.id, item.content.info)">
|
|
|
{{ item.content.info.docName }}
|
|
|
</div>
|
|
|
<div class="two">
|
|
|
<div class="two1">
|
|
|
- <img src="../../assets/img/UserCircle.png" />
|
|
|
+ <img src="../../assets/img/UserCircle.png"/>
|
|
|
{{ item.content.info.createBy }}
|
|
|
</div>
|
|
|
<div>
|
|
|
- <img src="../../assets/img/Clock.png" />
|
|
|
+ <img src="../../assets/img/Clock.png"/>
|
|
|
{{ item.content.info.createTime }}
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="three" v-for="highlightFieldsContentItem in item.highlightFields.content"
|
|
|
- :key="highlightFieldsContentItem.id" v-html="highlightFieldsContentItem" style="white-space: normal"></div>
|
|
|
+ :key="highlightFieldsContentItem.id" v-html="highlightFieldsContentItem" style="white-space: normal"></div>
|
|
|
<ul class="four">
|
|
|
<li v-for="tagName in item.content.info.tagList" :key="tagName.id">
|
|
|
{{ tagName.tagName }}
|
|
@@ -77,350 +77,352 @@
|
|
|
</div>
|
|
|
<div class="mains_prompt" v-if="mains_data2">
|
|
|
<span>滚动显示更多内容</span>
|
|
|
- <img src="../../assets/img/chevrons-down.png" alt="" />
|
|
|
+ <img src="../../assets/img/chevrons-down.png" alt=""/>
|
|
|
</div>
|
|
|
<div class="empty" v-if="mains_data">
|
|
|
- <img src="../../assets/img/Empty.png" alt="" />
|
|
|
+ <img src="../../assets/img/Empty.png" alt=""/>
|
|
|
<p>您搜索的内容暂无数据,建议更换关键词</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import {
|
|
|
- ret
|
|
|
- } from "@/api/doc/share1.js";
|
|
|
-
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- //搜索框绑定
|
|
|
- input: "",
|
|
|
- type: "",
|
|
|
- //搜索出来的数据
|
|
|
- count: [],
|
|
|
- page: 0,
|
|
|
- size: 3,
|
|
|
- mains_data: false,
|
|
|
- mains_data2: false,
|
|
|
- checkList: [],
|
|
|
- value1: "",
|
|
|
- };
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.input = this.$route.query.datas;
|
|
|
- if (this.input) {
|
|
|
- this.type = this.$route.query.data2;
|
|
|
- this.searchs();
|
|
|
- } else {
|
|
|
- this.type = "1"
|
|
|
- }
|
|
|
- },
|
|
|
- watch: {
|
|
|
- $route: {
|
|
|
- handler(val, oldval) {
|
|
|
- this.input = this.$route.query.datas;
|
|
|
- this.count = [];
|
|
|
- if (this.input) {
|
|
|
- this.searchs();
|
|
|
- } else {
|
|
|
- this.mains_data = true;
|
|
|
- this.mains_data2 = false;
|
|
|
- }
|
|
|
- },
|
|
|
- // 深度观察监听
|
|
|
- deep: true,
|
|
|
+import { ret } from '@/api/doc/share1.js'
|
|
|
+
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ //搜索框绑定
|
|
|
+ input: '',
|
|
|
+ type: '',
|
|
|
+ //搜索出来的数据
|
|
|
+ count: [],
|
|
|
+ page: 0,
|
|
|
+ size: 3,
|
|
|
+ mains_data: false,
|
|
|
+ mains_data2: false,
|
|
|
+ checkList: [],
|
|
|
+ value1: ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.input = this.$route.query.datas
|
|
|
+ if (this.input) {
|
|
|
+ this.type = this.$route.query.data2
|
|
|
+ this.searchs()
|
|
|
+ } else {
|
|
|
+ this.type = '1'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ $route: {
|
|
|
+ handler(val, oldval) {
|
|
|
+ this.input = this.$route.query.datas
|
|
|
+ this.page = 0
|
|
|
+ this.count = []
|
|
|
+ if (this.input) {
|
|
|
+ this.searchs()
|
|
|
+ } else {
|
|
|
+ this.mains_data = true
|
|
|
+ this.mains_data2 = false
|
|
|
+ }
|
|
|
},
|
|
|
+ // 深度观察监听
|
|
|
+ deep: true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ //添加滚动条事件
|
|
|
+ window.addEventListener('scroll', this.handleScroll, true)
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 点击搜索调用的方法
|
|
|
+ searchPre() {
|
|
|
+ // this.searchs()
|
|
|
+ this.$router.push({
|
|
|
+ path: '/home/retrieval',
|
|
|
+ query: {
|
|
|
+ datas: this.input,
|
|
|
+ data2: this.type
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
- mounted() {
|
|
|
- //添加滚动条事件
|
|
|
- window.addEventListener("scroll", this.handleScroll, true);
|
|
|
+ handleScroll() {
|
|
|
+ const container = document.querySelector('.mains')
|
|
|
+ const {
|
|
|
+ scrollTop,
|
|
|
+ scrollHeight,
|
|
|
+ clientHeight
|
|
|
+ } = container
|
|
|
+ // console.log('scrollHeight',scrollHeight);
|
|
|
+ // console.log('clientHeight',clientHeight);
|
|
|
+ // console.log(scrollTop);
|
|
|
+ // 是否达到页面底部
|
|
|
+ if (scrollTop + clientHeight >= scrollHeight) {
|
|
|
+ // console.log('滚动到底部了!')
|
|
|
+ this.page += 1
|
|
|
+ // 执行加载
|
|
|
+ this.searchs()
|
|
|
+ }
|
|
|
},
|
|
|
- methods: {
|
|
|
- // 点击搜索调用的方法
|
|
|
- searchPre() {
|
|
|
- // this.searchs()
|
|
|
-
|
|
|
- this.$router.push({
|
|
|
- path: "/home/retrieval",
|
|
|
- query: {
|
|
|
- datas: this.input,
|
|
|
- data2: this.type
|
|
|
- },
|
|
|
- });
|
|
|
- },
|
|
|
- handleScroll() {
|
|
|
- const container = document.querySelector(".mains");
|
|
|
- const {
|
|
|
- scrollTop,
|
|
|
- scrollHeight,
|
|
|
- clientHeight
|
|
|
- } = container;
|
|
|
- // console.log('scrollHeight',scrollHeight);
|
|
|
- // console.log('clientHeight',clientHeight);
|
|
|
- // console.log(scrollTop);
|
|
|
- // 是否达到页面底部
|
|
|
- if (scrollTop + clientHeight >= scrollHeight) {
|
|
|
- // console.log('滚动到底部了!')
|
|
|
- this.page += 1;
|
|
|
- // 执行加载
|
|
|
- this.searchs();
|
|
|
- }
|
|
|
- },
|
|
|
|
|
|
- //查找返回的数据
|
|
|
- searchs() {
|
|
|
- ret({
|
|
|
- content: this.input,
|
|
|
- type: this.type,
|
|
|
- page: this.page,
|
|
|
- size: this.size,
|
|
|
- }).then((item) => {
|
|
|
- // console.log('item=',item)
|
|
|
- if (item.length > 0) {
|
|
|
- this.count.push(...item);
|
|
|
- this.mains_data = false;
|
|
|
- this.mains_data2 = true;
|
|
|
- } else {
|
|
|
+ //查找返回的数据
|
|
|
+ searchs() {
|
|
|
+ ret({
|
|
|
+ content: this.input,
|
|
|
+ type: this.type,
|
|
|
+ page: this.page,
|
|
|
+ size: this.size
|
|
|
+ }).then((item) => {
|
|
|
+ console.log('item=', item, this.type, this.page, this.size)
|
|
|
+ if (item.length > 0) {
|
|
|
+ this.count.push(...item)
|
|
|
+ this.mains_data = false
|
|
|
+ if (this.count.length > this.size) {
|
|
|
+ this.mains_data2 = true
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.mains_data2 = false
|
|
|
+ if (this.page === 0) {
|
|
|
// this.input = "";
|
|
|
- this.mains_data = true;
|
|
|
- this.mains_data2 = false;
|
|
|
+ this.mains_data = true
|
|
|
}
|
|
|
- });
|
|
|
- },
|
|
|
- //预览界面
|
|
|
- docName(curentDocId, value) {
|
|
|
- // this.$tab.openPage(
|
|
|
- // window.open('/individual/Pre/user/' + row.docId + "?row=" + JSON.stringify(row),
|
|
|
- // '_blank'),
|
|
|
- // // window.open("/individual/Pre/user/" + row.docId +"/title/"+ row.docName, '_blank'),
|
|
|
- // );
|
|
|
- // this.$tab.openPage(
|
|
|
- // window.open("/individual/Pre/user/" + curentDocId, "_blank"),
|
|
|
- window.open(
|
|
|
- "/individual/Pre/user/" +
|
|
|
- curentDocId +
|
|
|
- "?row=" +
|
|
|
- JSON.stringify(value),
|
|
|
- "_blank"
|
|
|
- )
|
|
|
- // );
|
|
|
- },
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
- };
|
|
|
+ //预览界面
|
|
|
+ docName(curentDocId, value) {
|
|
|
+ // this.$tab.openPage(
|
|
|
+ // window.open('/individual/Pre/user/' + row.docId + "?row=" + JSON.stringify(row),
|
|
|
+ // '_blank'),
|
|
|
+ // // window.open("/individual/Pre/user/" + row.docId +"/title/"+ row.docName, '_blank'),
|
|
|
+ // );
|
|
|
+ // this.$tab.openPage(
|
|
|
+ // window.open("/individual/Pre/user/" + curentDocId, "_blank"),
|
|
|
+ window.open(
|
|
|
+ '/individual/Pre/user/' +
|
|
|
+ curentDocId +
|
|
|
+ '?row=' +
|
|
|
+ JSON.stringify(value),
|
|
|
+ '_blank'
|
|
|
+ )
|
|
|
+ // );
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</script>
|
|
|
<style lang='scss'>
|
|
|
- .three {
|
|
|
- margin-bottom: calc(100vw * (10 / 1920));
|
|
|
+.three {
|
|
|
+ margin-bottom: calc(100vw * (10 / 1920));
|
|
|
|
|
|
- em {
|
|
|
- color: #f00 !important;
|
|
|
- }
|
|
|
+ em {
|
|
|
+ color: #f00 !important;
|
|
|
}
|
|
|
+}
|
|
|
</style>
|
|
|
<style scoped lang='scss'>
|
|
|
- .containe {
|
|
|
- color: #7ea4c8;
|
|
|
- /* font-size: 0.14rem; */
|
|
|
- font-family: PingFang SC-Medium, PingFang SC;
|
|
|
- font-weight: 500;
|
|
|
- }
|
|
|
-
|
|
|
- .picture {
|
|
|
- width: calc(100vw * (220 / 1920));
|
|
|
- height: calc(100vh * (57 / 1080));
|
|
|
- margin-left: calc(100vw * (860 / 1920));
|
|
|
- margin-top: calc(100vh * (100 / 1080));
|
|
|
- margin-bottom: calc(100vh * (40 / 1080));
|
|
|
-
|
|
|
- img {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- display: block;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .search {
|
|
|
- width: calc(100vw * (864 / 1920));
|
|
|
- height: calc(100vh * (50 / 1080));
|
|
|
- margin-left: calc(100vw * (528 / 1920));
|
|
|
- margin-bottom: calc(100vh * (50 / 1080));
|
|
|
- position: relative;
|
|
|
- // background: salmon;
|
|
|
+.containe {
|
|
|
+ color: #7ea4c8;
|
|
|
+ /* font-size: 0.14rem; */
|
|
|
+ font-family: PingFang SC-Medium, PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+}
|
|
|
+
|
|
|
+.picture {
|
|
|
+ width: calc(100vw * (220 / 1920));
|
|
|
+ height: calc(100vh * (57 / 1080));
|
|
|
+ margin-left: calc(100vw * (860 / 1920));
|
|
|
+ margin-top: calc(100vh * (100 / 1080));
|
|
|
+ margin-bottom: calc(100vh * (40 / 1080));
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: block;
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
+.search {
|
|
|
+ width: calc(100vw * (864 / 1920));
|
|
|
+ height: calc(100vh * (50 / 1080));
|
|
|
+ margin-left: calc(100vw * (528 / 1920));
|
|
|
+ margin-bottom: calc(100vh * (50 / 1080));
|
|
|
+ position: relative;
|
|
|
+ // background: salmon;
|
|
|
+}
|
|
|
+
|
|
|
+.main1 {
|
|
|
+ width: calc(100vw * (1100 / 1920));
|
|
|
+ height: calc(100vh * (100 / 1080));
|
|
|
+ // background: seagreen;
|
|
|
+ margin-left: calc(100vw * (528 / 1920));
|
|
|
+ margin-bottom: calc(100vh * (20 / 1080));
|
|
|
+
|
|
|
+ .range,
|
|
|
+ .category {
|
|
|
+ width: calc(100vw * (480 / 1920));
|
|
|
+ height: calc(100vh * (36 / 1080));
|
|
|
+ // margin-left: calc(100vw * (528 / 1920));
|
|
|
+ margin-bottom: calc(100vh * (30 / 1080));
|
|
|
+ /* line-height: calc(100vh * (36 / 1080)); */
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
|
|
|
- .main1 {
|
|
|
- width: calc(100vw * (1100 / 1920));
|
|
|
- height: calc(100vh * (100 / 1080));
|
|
|
- // background: seagreen;
|
|
|
- margin-left: calc(100vw * (528 / 1920));
|
|
|
- margin-bottom: calc(100vh * (20 / 1080));
|
|
|
-
|
|
|
- .range,
|
|
|
- .category {
|
|
|
- width: calc(100vw * (480 / 1920));
|
|
|
- height: calc(100vh * (36 / 1080));
|
|
|
- // margin-left: calc(100vw * (528 / 1920));
|
|
|
- margin-bottom: calc(100vh * (30 / 1080));
|
|
|
- /* line-height: calc(100vh * (36 / 1080)); */
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .range-ul {
|
|
|
- display: flex;
|
|
|
- list-style: none;
|
|
|
- padding: 0;
|
|
|
-
|
|
|
- ::v-deep .el-radio-button__inner {
|
|
|
-
|
|
|
- background: transparent;
|
|
|
- color: #7EA4C8FF;
|
|
|
- border: none;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .time {
|
|
|
- width: calc(100vw * (1333 / 1920));
|
|
|
- height: calc(100vh * (36 / 1080));
|
|
|
- // margin-left: calc(100vw * (528 / 1920));
|
|
|
+ .range-ul {
|
|
|
display: flex;
|
|
|
- align-items: center;
|
|
|
+ list-style: none;
|
|
|
+ padding: 0;
|
|
|
|
|
|
- .el-checkbox-group {
|
|
|
- .el-checkbox {
|
|
|
- margin-right: calc(100vw * (40 / 1920));
|
|
|
- }
|
|
|
+ ::v-deep .el-radio-button__inner {
|
|
|
|
|
|
- .el-date-picker {
|
|
|
- height: calc(100vh * (36 / 1080));
|
|
|
- }
|
|
|
+ background: transparent;
|
|
|
+ color: #7EA4C8FF;
|
|
|
+ border: none;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .cen—top-img {
|
|
|
- width: calc(100vw * (24 / 1920));
|
|
|
- height: calc(100vh * (24 / 1080));
|
|
|
- position: absolute;
|
|
|
- left: calc(100vw * (15 / 1920));
|
|
|
- top: calc(100vh * (15 / 1080));
|
|
|
- }
|
|
|
-
|
|
|
- .el-input {
|
|
|
- width: calc(100vw * (750 / 1920));
|
|
|
- height: calc(100vh * (50 / 1080));
|
|
|
- margin-right: calc(100vw * (14 / 1920));
|
|
|
- }
|
|
|
-
|
|
|
- .cen—top-span {
|
|
|
- display: inline-block;
|
|
|
- width: calc(100vw * (100 / 1920));
|
|
|
- height: calc(100vh * (50 / 1080));
|
|
|
- background: #2e8aecff;
|
|
|
- color: #ffffffcc;
|
|
|
- text-align: center;
|
|
|
- line-height: calc(100vh * (50 / 1080));
|
|
|
-
|
|
|
- &:hover {
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .mains {
|
|
|
- width: calc(100vw * (1450 / 1920));
|
|
|
- height: calc(100vh * (500 / 1080));
|
|
|
- // background: seagreen;
|
|
|
- margin-left: calc(100vw * (300 / 1920));
|
|
|
- overflow: auto;
|
|
|
- }
|
|
|
-
|
|
|
- .mains_prompt {
|
|
|
+ .time {
|
|
|
+ width: calc(100vw * (1333 / 1920));
|
|
|
+ height: calc(100vh * (36 / 1080));
|
|
|
+ // margin-left: calc(100vw * (528 / 1920));
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- margin-left: calc(100vw * (900 / 1920));
|
|
|
- margin-top: calc(100vh * (20 / 1080));
|
|
|
- }
|
|
|
|
|
|
- .empty {
|
|
|
- width: 100%;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
+ .el-checkbox-group {
|
|
|
+ .el-checkbox {
|
|
|
+ margin-right: calc(100vw * (40 / 1920));
|
|
|
+ }
|
|
|
|
|
|
- img {
|
|
|
- width: calc(100vw * (160 / 1920));
|
|
|
- height: calc(100vh * (160 / 1080));
|
|
|
- margin-top: calc(100vh * (150 / 1080));
|
|
|
+ .el-date-picker {
|
|
|
+ height: calc(100vh * (36 / 1080));
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
- .main-main {
|
|
|
- width: calc(100vw * (1430 / 1920));
|
|
|
- // height: calc(100vh * (220 / 1080));
|
|
|
- padding: calc(100vh * (20 / 1080));
|
|
|
- border-bottom: 1px dashed #083b61ff;
|
|
|
- }
|
|
|
-
|
|
|
- .one {
|
|
|
- margin-bottom: calc(100vw * (10 / 1920));
|
|
|
- color: #2e8aecff;
|
|
|
- font-size: 14px;
|
|
|
- text-decoration: underline;
|
|
|
+}
|
|
|
+
|
|
|
+.cen—top-img {
|
|
|
+ width: calc(100vw * (24 / 1920));
|
|
|
+ height: calc(100vh * (24 / 1080));
|
|
|
+ position: absolute;
|
|
|
+ left: calc(100vw * (15 / 1920));
|
|
|
+ top: calc(100vh * (15 / 1080));
|
|
|
+}
|
|
|
+
|
|
|
+.el-input {
|
|
|
+ width: calc(100vw * (750 / 1920));
|
|
|
+ height: calc(100vh * (50 / 1080));
|
|
|
+ margin-right: calc(100vw * (14 / 1920));
|
|
|
+}
|
|
|
+
|
|
|
+.cen—top-span {
|
|
|
+ display: inline-block;
|
|
|
+ width: calc(100vw * (100 / 1920));
|
|
|
+ height: calc(100vh * (50 / 1080));
|
|
|
+ background: #2e8aecff;
|
|
|
+ color: #ffffffcc;
|
|
|
+ text-align: center;
|
|
|
+ line-height: calc(100vh * (50 / 1080));
|
|
|
+
|
|
|
+ &:hover {
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
-
|
|
|
- .two {
|
|
|
- margin-bottom: calc(100vh * (10 / 1080));
|
|
|
- display: flex;
|
|
|
-
|
|
|
- .two1 {
|
|
|
- margin-right: calc(100vw * (30 / 1920));
|
|
|
- }
|
|
|
-
|
|
|
- img {
|
|
|
- vertical-align: middle;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .four {
|
|
|
- display: flex;
|
|
|
- list-style: none;
|
|
|
- padding: 0;
|
|
|
-
|
|
|
- li {
|
|
|
- // width: calc(100vw * (62 / 1920));
|
|
|
- // height: calc(100vh * (24 / 1080));
|
|
|
- border: 1px solid #ff9839ff;
|
|
|
- background: #bba99240;
|
|
|
- padding: 0 5px;
|
|
|
- margin-right: calc(100vw * (5 / 1920));
|
|
|
- }
|
|
|
+}
|
|
|
+
|
|
|
+.mains {
|
|
|
+ width: calc(100vw * (1450 / 1920));
|
|
|
+ height: calc(100vh * (500 / 1080));
|
|
|
+ // background: seagreen;
|
|
|
+ margin-left: calc(100vw * (300 / 1920));
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.mains_prompt {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-left: calc(100vw * (900 / 1920));
|
|
|
+ margin-top: calc(100vh * (20 / 1080));
|
|
|
+}
|
|
|
+
|
|
|
+.empty {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: calc(100vw * (160 / 1920));
|
|
|
+ height: calc(100vh * (160 / 1080));
|
|
|
+ margin-top: calc(100vh * (150 / 1080));
|
|
|
}
|
|
|
-
|
|
|
- //滚动条样式
|
|
|
- ::-webkit-scrollbar {
|
|
|
- width: 3.5px;
|
|
|
+}
|
|
|
+
|
|
|
+.main-main {
|
|
|
+ width: calc(100vw * (1430 / 1920));
|
|
|
+ // height: calc(100vh * (220 / 1080));
|
|
|
+ padding: calc(100vh * (20 / 1080));
|
|
|
+ border-bottom: 1px dashed #083b61ff;
|
|
|
+}
|
|
|
+
|
|
|
+.one {
|
|
|
+ margin-bottom: calc(100vw * (10 / 1920));
|
|
|
+ color: #2e8aecff;
|
|
|
+ font-size: 14px;
|
|
|
+ text-decoration: underline;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.two {
|
|
|
+ margin-bottom: calc(100vh * (10 / 1080));
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .two1 {
|
|
|
+ margin-right: calc(100vw * (30 / 1920));
|
|
|
}
|
|
|
|
|
|
- ::-webkit-scrollbar-track {
|
|
|
- background-color: rgba(0, 0, 0, 0);
|
|
|
+ img {
|
|
|
+ vertical-align: middle;
|
|
|
}
|
|
|
-
|
|
|
- ::-webkit-scrollbar-thumb {
|
|
|
- background: #2e8aec;
|
|
|
- border-radius: 3px;
|
|
|
- }
|
|
|
-
|
|
|
- ::-webkit-scrollbar-thumb:hover {
|
|
|
- background: #2e8aec;
|
|
|
- }
|
|
|
-
|
|
|
- ::v-deep .el-input--medium .el-input__inner {
|
|
|
- padding-left: calc(100vw * (50 / 1920));
|
|
|
- background: #14265e80;
|
|
|
- border: 1px solid #01d1ffff;
|
|
|
- color: #7ea4c8ff;
|
|
|
+}
|
|
|
+
|
|
|
+.four {
|
|
|
+ display: flex;
|
|
|
+ list-style: none;
|
|
|
+ padding: 0;
|
|
|
+
|
|
|
+ li {
|
|
|
+ // width: calc(100vw * (62 / 1920));
|
|
|
+ // height: calc(100vh * (24 / 1080));
|
|
|
+ border: 1px solid #ff9839ff;
|
|
|
+ background: #bba99240;
|
|
|
+ padding: 0 5px;
|
|
|
+ margin-right: calc(100vw * (5 / 1920));
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
+//滚动条样式
|
|
|
+::-webkit-scrollbar {
|
|
|
+ width: 3.5px;
|
|
|
+}
|
|
|
+
|
|
|
+::-webkit-scrollbar-track {
|
|
|
+ background-color: rgba(0, 0, 0, 0);
|
|
|
+}
|
|
|
+
|
|
|
+::-webkit-scrollbar-thumb {
|
|
|
+ background: #2e8aec;
|
|
|
+ border-radius: 3px;
|
|
|
+}
|
|
|
+
|
|
|
+::-webkit-scrollbar-thumb:hover {
|
|
|
+ background: #2e8aec;
|
|
|
+}
|
|
|
+
|
|
|
+::v-deep .el-input--medium .el-input__inner {
|
|
|
+ padding-left: calc(100vw * (50 / 1920));
|
|
|
+ background: #14265e80;
|
|
|
+ border: 1px solid #01d1ffff;
|
|
|
+ color: #7ea4c8ff;
|
|
|
+}
|
|
|
</style>
|