首页增加了 选项卡,页面优化

main
李劲龙 10 months ago
parent 6b9c34f458
commit aa2f8160e0

@ -5,6 +5,7 @@ VUE_APP_TITLE = 产品画像
ENV = 'development' ENV = 'development'
# 若依管理系统/开发环境 # 若依管理系统/开发环境
VUE_APP_BASE_API = 'https://dev-mssm-liaoning.imian.org.cn' VUE_APP_BASE_API = 'https://dev-mssm-liaoning.lesdev.cn'
# VUE_APP_BASE_API = 'http://192.168.0.109:9023'
# 路由懒加载 # 路由懒加载
VUE_CLI_BABEL_TRANSPILE_MODULES = true VUE_CLI_BABEL_TRANSPILE_MODULES = true

@ -4,7 +4,7 @@ VUE_APP_TITLE = 产品画像
# 生产环境配置 # 生产环境配置
ENV = 'production' ENV = 'production'
# 若依管理系统/生产环境 # 若依管理系统/生产环境 /api/ggfw/
VUE_APP_BASE_API = '/prod-api' VUE_APP_BASE_API = '/prod-api'
VUE_APP_HOUTAI = /ggfw-jcphx VUE_APP_HOUTAI = /ggfw-jcphx

@ -56,3 +56,11 @@ export function getXXMSG(query) {
params: query params: query
}) })
} }
//根据产品画像类型查询产品
export function findByType(query) {
return request({
url: '/ggfw-api/pharmaceuticals/largeScreen/findByType',
method: 'get',
params: query
})
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 410 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

@ -71,19 +71,20 @@ DictData.install()
import { setToken } from '@/utils/auth' import { setToken } from '@/utils/auth'
// 临时获取token // 临时获取token
let token = async () => { // let token = async () => {
let Authentication = await API.login.frimLogin(); // let Authentication = await API.login.frimLogin();
localStorage.setItem( // localStorage.setItem(
"MSSM-LIAONING__TOKEN", // "MSSM-LIAONING__TOKEN",
Authentication.data.result.userToken // Authentication.data.result.userToken
); // );
} // }
token()
let infor = async () => { // token()
let response = await API.login.getuserinfo(); // let infor = async () => {
localStorage.setItem("userDto", JSON.stringify(response?.result.userDto)); // let response = await API.login.getuserinfo();
} // localStorage.setItem("userDto", JSON.stringify(response?.result.userDto));
infor() // }
// infor()
/** /**

@ -16,7 +16,9 @@ axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
const service = axios.create({ const service = axios.create({
// axios中请求配置有baseURL选项表示请求URL公共部分 // axios中请求配置有baseURL选项表示请求URL公共部分
baseURL: process.env.VUE_APP_BASE_API, baseURL: process.env.VUE_APP_BASE_API,
//!线上 //!线上--2.17-198
// baseURL:location.origin +"/api/ggfw",
//!其他
// baseURL:location.origin, // baseURL:location.origin,
// 超时 // 超时
timeout: 10000 timeout: 10000

@ -113,14 +113,13 @@ export default {
}, },
methods: { methods: {
reducefn(data = []) { reducefn(data = []) {
return data.reduce((accumulator, current) => current.sampleType + accumulator, 0); return data.length
}, },
getData() { getData() {
let newRouter = this.$route.query; let newRouter = this.$route.query;
getCPCJ({ name: newRouter.code }).then((res) => { getCPCJ({ name: newRouter.code }).then((res) => {
if (res.code == 200) { if (res.code == 200) {
if (res.data.result.length != 0) { if (res.data.result.length != 0) {
// //
this.myChart1data[0].value = res.data.result.filter(item => item.inspectType === "生产环节").length this.myChart1data[0].value = res.data.result.filter(item => item.inspectType === "生产环节").length
this.myChart1data[0].percent = ((res.data.result.filter(item => item.inspectType === "生产环节").length / res.data.result.length) * 100).toFixed(1) this.myChart1data[0].percent = ((res.data.result.filter(item => item.inspectType === "生产环节").length / res.data.result.length) * 100).toFixed(1)
@ -131,11 +130,11 @@ export default {
res.data.result.forEach((item) => { res.data.result.forEach((item) => {
if (item.qualified === "合格") { if (item.qualified === "合格") {
if (mergedData[item.province]) { if (mergedData[item.province]) {
mergedData[item.province].sampleType += item.sampleType; mergedData[item.province].sampleType += 1;
} else { } else {
mergedData[item.province] = { mergedData[item.province] = {
province: item.province, province: item.province,
sampleType: item.sampleType sampleType: 1
}; };
} }
} }
@ -145,8 +144,10 @@ export default {
this.myChart2data.push(item.province) this.myChart2data.push(item.province)
this.myChart2data2.push(item.sampleType) this.myChart2data2.push(item.sampleType)
}) })
// //
this.countryC = res.data.result.length this.countryC = res.data.result.filter(item => item.sampleType == "2").length
//
this.provinceC = res.data.result.filter(item => item.sampleType == "1").length
// //
const filteredData = res.data.result.filter(item => item.qualified === "不合格"); const filteredData = res.data.result.filter(item => item.qualified === "不合格");
this.pt = Math.floor(((this.reducefn(res.data.result) - this.reducefn(filteredData)) / this.reducefn(res.data.result)) * 100) this.pt = Math.floor(((this.reducefn(res.data.result) - this.reducefn(filteredData)) / this.reducefn(res.data.result)) * 100)
@ -248,10 +249,10 @@ export default {
backgroundColor: "rgba(0,0,0,0)", // backgroundColor: "rgba(0,0,0,0)", //
tooltip: {}, tooltip: {},
grid: { grid: {
top: "8%", top: "7%",
left: "10%", left: "10%",
right: "10%", right: "10%",
bottom: "8%", bottom: "-5%",
containLabel: true, containLabel: true,
}, },
xAxis: [ xAxis: [

@ -1,15 +1,15 @@
<template> <template>
<div class="pc-container"> <div class="pc-container">
<div class="system-header"> <div class="system-header">
<div class="left-tags">2023年8月11日 星期五 16:23:34</div> <div class="left-tags">{{dataNow(2)+ dataNow(3) + date}}</div>
<div class="system-title" text="产品画像">产品画像</div> <div class="system-title" text="产品画像">产品画像</div>
<div class="rigth-tags"> <div class="rigth-tags">
<!-- <div class="rigth-tags-diva"> <!-- <div class="rigth-tags-diva">
<span class="rigth-tags-spana"><i class="el-icon-sunny"></i></span <span class="rigth-tags-spana"><i class="el-icon-sunny"></i></span
>晴天 17~28°C <span class="rigth-tags-spanb"> | </span>东南风3级 >晴天 17~28°C <span class="rigth-tags-spanb"> | </span>东南风3级
</div> --> </div> -->
<div class="content-top-fanhui" @click="toBack"> <div class="content-top-fanhui" @click="toBack" v-if="newRouter.cpda != 1">
<div class="content-top-fanhui-main"> <div class="content-top-fanhui-main">
<div class="black-bg"></div> <div class="black-bg"></div>
<span>返回</span> <span>返回</span>
@ -50,10 +50,7 @@
<span v-if="query.gllb">{{ query.gllb }}</span> <span v-if="query.gllb">{{ query.gllb }}</span>
<span v-if="query.jgtz">{{ query.jgtz }}</span> <span v-if="query.jgtz">{{ query.jgtz }}</span>
</div> </div>
<div <div class="right-text-bog" v-if="newRouter.type != 1 && newRouter.type != 2">
class="right-text-bog"
v-if="newRouter.type != 1 && newRouter.type != 2"
>
<span v-if="query.type">{{ query.type }}</span> <span v-if="query.type">{{ query.type }}</span>
</div> </div>
</div> </div>
@ -68,10 +65,7 @@
</div> </div>
<!-- 右边 --> <!-- 右边 -->
<div class="system-box-right"> <div class="system-box-right">
<div <div class="top" v-if="this.$route.query.type == 1 || this.$route.query.type == 2">
class="top"
v-if="this.$route.query.type == 1 || this.$route.query.type == 2"
>
<headtitle mytitle="召回信息"></headtitle> <headtitle mytitle="召回信息"></headtitle>
<recallbox></recallbox> <recallbox></recallbox>
</div> </div>
@ -116,19 +110,60 @@ export default {
return { return {
query: {}, query: {},
newRouter: {}, newRouter: {},
date: '',
}; };
}, },
created() {}, created() { this.dataNow(1) },
mounted() { mounted() {
this.getData(); this.getData();
setInterval(() => {
this.dataNow(1)
}, 1000);
}, },
methods: { methods: {
toBack() { toBack() {
this.$router.go(-1); this.$router.go(-1);
}, },
dataNow(index) {
let now = new Date();
if (index == 1) {
let hour = now.getHours();
if (hour < 10) hour = "0" + hour
let minute = now.getMinutes();
if (minute < 10) minute = "0" + minute
let second = now.getSeconds();
if (second < 10) second = "0" + second
this.date = `${hour}:${minute}:${second}`
} else if (index == 2) {
let year = now.getFullYear();
if (year < 10) year = "0" + year
let month = now.getMonth() + 1;
if (month < 10) month = "0" + month
let day = now.getDate();
if (day < 10) day = "0" + day
return `${year}/${month}/${day}`
} else if (index == 3) {
let dayOfWeek = now.getDay();
//
let weekDays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
let chineseDayOfWeek = weekDays[dayOfWeek];
return chineseDayOfWeek
}
},
getData() { getData() {
// debugger // debugger
this.newRouter = this.$route.query; this.newRouter = this.$route.query;
console.log(798, this.newRouter);
getXXMSG({ code: this.newRouter.code, type: this.newRouter.type }).then( getXXMSG({ code: this.newRouter.code, type: this.newRouter.type }).then(
(res) => { (res) => {
this.query = res.data; this.query = res.data;
@ -141,14 +176,14 @@ export default {
</script> </script>
<style scoped lang='scss'> <style scoped lang='scss'>
@import "@/assets/styles/theme.scss"; @import "@/assets/styles/theme.scss";
.content-top-fanhui { .content-top-fanhui {
margin-right: 10px; margin-right: 10px;
background: linear-gradient( background: linear-gradient(0deg,
0deg,
rgba(103, 200, 255, 0.2) 0%, rgba(103, 200, 255, 0.2) 0%,
rgba(111, 176, 231, 0.1) 100% rgba(111, 176, 231, 0.1) 100%);
);
cursor: pointer; cursor: pointer;
.content-top-fanhui-main { .content-top-fanhui-main {
padding: 2px 12px; padding: 2px 12px;
border: 1px solid; border: 1px solid;
@ -156,6 +191,7 @@ export default {
border-radius: 4px; border-radius: 4px;
display: flex; display: flex;
align-items: center; align-items: center;
.black-bg { .black-bg {
width: 26px; width: 26px;
height: 24px; height: 24px;
@ -163,20 +199,19 @@ export default {
background-size: cover; background-size: cover;
margin-top: 3px; margin-top: 3px;
} }
span { span {
font-size: 16px; font-size: 16px;
font-family: SourceHanSansSC; font-family: SourceHanSansSC;
font-weight: bold; font-weight: bold;
color: #feffff; color: #feffff;
text-shadow: 0px 4px 9px rgba(0, 0, 0, 0.29); text-shadow: 0px 4px 9px rgba(0, 0, 0, 0.29);
background: linear-gradient( background: linear-gradient(0deg,
0deg,
#caffff 0%, #caffff 0%,
#caffff 0%, #caffff 0%,
#ffffff 0%, #ffffff 0%,
#74b4f4 38.96484375%, #74b4f4 38.96484375%,
#3883ff 100% #3883ff 100%);
);
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
} }
@ -190,8 +225,7 @@ div {
.pc-container { .pc-container {
overflow: hidden; overflow: hidden;
height: 100%; height: 100%;
background: url("../../assets/images/daping/main-background.png") no-repeat background: url("../../assets/images/daping/main-background.png") no-repeat center;
center;
background-size: cover; background-size: cover;
position: relative; position: relative;
@ -207,7 +241,7 @@ div {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
& > div { &>div {
flex: 1; flex: 1;
height: 100%; height: 100%;
} }
@ -331,7 +365,7 @@ div {
height: 100%; height: 100%;
display: flex; display: flex;
& > div { &>div {
height: 100%; height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -395,15 +429,16 @@ div {
.fengxian-top-right { .fengxian-top-right {
display: flex; display: flex;
height: 100%; height: 100%;
.right-text-bog { .right-text-bog {
display: flex; display: flex;
align-items: center; align-items: center;
span { span {
margin: 0 3px; margin: 0 3px;
padding:5px 14px; padding: 5px 14px;
background: url("../../assets/images/daping/fengxianbgc.png") background: url("../../assets/images/daping/fengxianbgc.png") no-repeat;
no-repeat; background-size: 100% 100%;
background-size:100% 100%;
text-align: center; text-align: center;
color: #4da5ff; color: #4da5ff;
font-weight: 400; font-weight: 400;
@ -414,4 +449,3 @@ div {
} }
} }
</style> </style>

@ -1,18 +1,8 @@
<template> <template>
<div class="box"> <div class="box">
<el-pagination <el-pagination background :current-page.sync="currentPage" :page-size.sync="pageSize"
background layout="prev, pager, next,jumper" :page-sizes="pageSizes" :pager-count="pagerCount" :total="total"
:current-page.sync="currentPage" @size-change="handleSizeChange" @current-change="handleCurrentChange" :small="smallShow">
:page-size.sync="pageSize"
layout="prev, pager, next,jumper"
:page-sizes="pageSizes"
:pager-count="pagerCount"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
small
>
</el-pagination> </el-pagination>
</div> </div>
</template> </template>
@ -41,6 +31,10 @@ export default {
return [10, 20, 30, 50]; return [10, 20, 30, 50];
}, },
}, },
smallShow: {
type: Boolean,
default: true
},
// 5 // 5
pagerCount: { pagerCount: {
type: Number, type: Number,
@ -72,7 +66,7 @@ export default {
return this.page; return this.page;
}, },
set(val) { set(val) {
this.$emit("update:page", val); // this.$emit("update:page", val);
}, },
}, },
pageSize: { pageSize: {
@ -80,7 +74,7 @@ export default {
return this.limit; return this.limit;
}, },
set(val) { set(val) {
this.$emit("update:limit", val); // this.$emit("update:limit", val);
}, },
}, },
}, },
@ -90,15 +84,15 @@ export default {
this.currentPage = 1; this.currentPage = 1;
} }
this.$emit("pagination", { page: this.currentPage, limit: val }); this.$emit("pagination", { page: this.currentPage, limit: val });
if (this.autoScroll) { // if (this.autoScroll) {
scrollTo(0, 800); // scrollTo(0, 800);
} // }
}, },
handleCurrentChange(val) { handleCurrentChange(val) {
this.$emit("pagination", { page: val, limit: this.pageSize }); this.$emit("pagination", { page: val, limit: this.pageSize });
if (this.autoScroll) { // if (this.autoScroll) {
scrollTo(0, 800); // scrollTo(0, 800);
} // }
}, },
}, },
}; };
@ -112,24 +106,29 @@ export default {
box-sizing: border-box; box-sizing: border-box;
overflow-y: auto; overflow-y: auto;
} }
.box { .box {
background-color: transparent !important; background-color: transparent !important;
} }
::v-deep .el-pagination.is-background .btn-prev { ::v-deep .el-pagination.is-background .btn-prev {
background-color: transparent !important; background-color: transparent !important;
border: 1px solid #123864; border: 1px solid #123864;
color: #579acf; color: #579acf;
} }
::v-deep .el-pagination.is-background .btn-next { ::v-deep .el-pagination.is-background .btn-next {
background-color: transparent !important; background-color: transparent !important;
border: 1px solid #123864; border: 1px solid #123864;
color: #579acf; color: #579acf;
} }
::v-deep .el-pagination .el-pager li { ::v-deep .el-pagination .el-pager li {
background-color: transparent !important; background-color: transparent !important;
border: 1px solid #123864; border: 1px solid #123864;
color: #579acf; color: #579acf;
} }
// ::v-deep .el-pagination.is-background.el-pager li:not(.disabled).active { // ::v-deep .el-pagination.is-background.el-pager li:not(.disabled).active {
// background: rgba(20, 131, 242, 0.2) !important; // background: rgba(20, 131, 242, 0.2) !important;
// border: 1px solid #1483f2; // border: 1px solid #1483f2;
@ -139,12 +138,14 @@ export default {
::v-deep .el-pagination__jump { ::v-deep .el-pagination__jump {
margin: 0; margin: 0;
color: #2668d6; color: #2668d6;
.el-input__inner { .el-input__inner {
background-color: transparent !important; background-color: transparent !important;
border: 1px solid #123864; border: 1px solid #123864;
color: #2668d6; color: #2668d6;
} }
} }
::v-deep .el-pager li.active { ::v-deep .el-pager li.active {
background: rgba(20, 131, 242, 0.52) !important; background: rgba(20, 131, 242, 0.52) !important;
border: 1px solid #1483f2; border: 1px solid #1483f2;
@ -153,5 +154,4 @@ export default {
// ::v-deep .el-pagination__total { // ::v-deep .el-pagination__total {
// color: #2668d6; // color: #2668d6;
// } // }</style>
</style>

@ -1,4 +1,3 @@
<template> <template>
<div class="container"> <div class="container">
<div class="content"> <div class="content">
@ -35,7 +34,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="content-content">
<div class="title"> <div class="title">
<img src="@/assets/images/daping/guangxian.png" alt="" /> <img src="@/assets/images/daping/guangxian.png" alt="" />
<div>产品画像搜索</div> <div>产品画像搜索</div>
@ -57,13 +56,85 @@
</div> </div>
</div> </div>
</div> </div>
<div class="bottomList">
<div class="conbtm-item" v-for="(item, index) in btmLitstTitle" v-show="btmLitstTitleShow">
<span class="conitem-bgimg">{{ index + 1 }}</span>
<div class="conitme-title"><span class="spantext">{{ item.name }}</span></div>
<div class="conitme-right-item" v-for="(item, index) in item.childarray" @click="onActivebtm(item)"
:class="activebtm == item.value ? 'conitme-right-item-active' : ''">
{{ item.lable }}
</div>
</div>
<div class="bottomListShow">
<el-button type="success" @click="btmLitstTitleShow = !btmLitstTitleShow">{{ btmLitstTitleShow ? "收起" : "展开"
}}<i class="el-icon-d-arrow-left"></i></el-button>
</div>
<div class="listBottom" v-loading="loadingTow">
<div class="listBottom-title">
<div class="span1"></div>
<div class="div1">为您查询到
<span class="span2">{{ total }}</span>
条数据
</div>
</div>
<div class="listBottom-item" v-for="(item, index) in btmLise">
<div class="listBottom-item-left">
<div class="listitem-title">
{{ item.name || "" }}
</div>
<div class="listitemleft-bottom">
<span class="span1">
<span>药品批准文号</span>
<el-tooltip class="item" effect="dark" :content="item.code || ''" placement="top-start">
<span class="span2">{{ item.code || "" }}</span>
</el-tooltip>
</span>
<span class="span1">
<span>持有/注册/备案人:</span>
<el-tooltip class="item" effect="dark" :content="item.scqy || ''" placement="top-start">
<span class="span2">{{ item.scqy || "" }}</span>
</el-tooltip>
</span>
</div>
</div>
<!-- <div class="listBottom-item-right">
<div class="listitem-title">近3年统计</div>
<div class="listitemright-bottom">
<div class="listitemright-bottom-item">
<img src='../assets/images/icon-xxx1.png' alt="">抽检不合格:<span>{{ item.cjbhg || "0" }}</span>
</div>
<div class="listitemright-bottom-item">
<img src='../assets/images/icon-xxx2.png' alt="">不良反应:<span>{{ item.blfy || "0" }}</span>
</div>
<div class="listitemright-bottom-item">
<img src='../assets/images/icon-xxx3.png' alt="">产品召回:<span>{{ item.cpzh || "0" }}</span>
</div>
</div>
</div> -->
<div class="listBottom-item-xiangqing">
<el-button type="primary" @click="ListGO(item)"></el-button>
</div>
</div>
</div>
<div ref="pagination">
<Pagination :total="total" :page="query.current" :limit="query.size" @pagination="changeList"
:smallShow="false"></Pagination>
</div>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import Pagination from "@/views/components/Pagination";
import { findByType } from "@/api/largeScreen/index";
export default { export default {
name: '', name: '',
components: {}, components: { Pagination },
data() { data() {
return { return {
input: "", input: "",
@ -73,6 +144,63 @@ export default {
searchList: [], searchList: [],
getData: {}, getData: {},
userName: '', userName: '',
btmLitstTitleShow: true,
btmLitstTitle: [{
name: "药品",
childarray: [{
lable: "本省注册药品",
value: 1,
}, {
lable: "本省持受托生产药品",
value: 2,
},]
}, {
name: "医疗器械",
childarray: [{
lable: "三类医疗器械",
value: 3,
}, {
lable: "三类体外诊断试剂",
value: 4,
}, {
lable: "二类医疗器械",
value: 5,
}, {
lable: "二类体外诊断试剂",
value: 6,
}, {
lable: "一类医疗器械",
value: 7,
}, {
lable: "一类体外诊断试剂",
value: 8,
},]
}, {
name: "化妆品",
childarray: [{
lable: "国产普通化妆品",
value: 9,
}, {
lable: "国产特殊化妆品",
value: 10,
}, {
lable: "进口普通化妆品",
value: 11,
}, {
lable: "进口特殊化妆品",
value: 12,
}]
},],
activebtm: 1,
query: {
current: 1,
size: 10,
type: 1,
},
total: 0,
btmLise: [],
loadingTow: true
} }
}, },
watch: { watch: {
@ -93,16 +221,45 @@ export default {
created() { this.dataNow(1) }, created() { this.dataNow(1) },
mounted() { mounted() {
this.getDataInterval(1) this.getDataInterval(1)
console.log(localStorage.getItem('userDto')) this.getLiset()
let user = JSON.parse(localStorage.getItem('userDto')) let user = JSON.parse(localStorage.getItem('userDto'))
console.log(user)
this.userName = user.realName this.userName = user.realName
}, },
methods: { methods: {
ListGO(item) {
this.$router.push({ path: "/bgpage", query: { code: item.code, name: item.name, type: item.type } })
},
changeList(e) {
this.loadingTow = true
this.query.current = e.page;
this.query.size = e.limit;
this.getLiset()
},
onActivebtm(item) {
this.loadingTow = true
this.activebtm = item.value;
this.query.current = 1;
this.query.size = 10;
this.query.type = item.value
this.getLiset()
},
//
getLiset() {
findByType(this.query).then((res) => {
console.log(res);
if (res.code == 200) {
this.total = res.data.total
this.btmLise = res.data.records
this.loadingTow = false
}
})
},
gotoBgpage() { gotoBgpage() {
if (this.input) { if (this.input) {
console.log(this.searchList, 'this.searchList') console.log(this.searchList, 'this.searchList')
console.log( this.getData.code," this.getData"); console.log(this.getData.code, " this.getData");
if (this.searchList.length == 1 || this.getData.code) { if (this.searchList.length == 1 || this.getData.code) {
this.$router.push({ path: "/bgpage", query: { code: this.getData.code, name: this.getData.name, type: this.getData.type } }) this.$router.push({ path: "/bgpage", query: { code: this.getData.code, name: this.getData.name, type: this.getData.type } })
this.searchList = []; this.searchList = [];
@ -185,7 +342,7 @@ export default {
.container { .container {
width: 100vw; width: 100vw;
height: 100vh; min-height: 100vh;
padding: 10px 40px 0; padding: 10px 40px 0;
background-color: #000000; background-color: #000000;
position: relative; position: relative;
@ -250,7 +407,7 @@ export default {
} }
span { span {
font-size: 16px; font-size: 18px;
font-family: SourceHanSansSC; font-family: SourceHanSansSC;
font-weight: bold; font-weight: bold;
color: #FEFFFF; color: #FEFFFF;
@ -286,18 +443,25 @@ export default {
} }
.content-content {
height: 23vh;
position: relative;
}
.title { .title {
margin-top: 250px; margin-top: 60px;
color: #fff; color: #fff;
// display: flex; // display: flex;
// justify-content: center; // justify-content: center;
div { div {
position: relative;
z-index: 2;
padding-left: 50px; padding-left: 50px;
text-align: center; text-align: center;
font-size: 48px; font-size: 48px;
font-family: Tensentype; font-family: Tensentype;
font-weight: normal; font-weight: 700;
color: #FFFFFF; color: #FFFFFF;
line-height: 18px; line-height: 18px;
text-shadow: 0px 8px 16px rgba(24, 118, 172, 0.6); text-shadow: 0px 8px 16px rgba(24, 118, 172, 0.6);
@ -305,22 +469,25 @@ export default {
// -webkit-background-clip: text; // -webkit-background-clip: text;
// -webkit-text-fill-color: transparent; // -webkit-text-fill-color: transparent;
z-index: 20; z-index: 20;
} }
img { img {
width: 316px; width: 316px;
height: 316px; height: 316px;
position: absolute; position: absolute;
top: 220px; z-index: 1;
left: 830px; left: 50%;
transform: translate(-40%, -30%);
} }
} }
.content-bottom-box { .content-bottom-box {
position: absolute; position: absolute;
top: 50%; top: 60%;
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
z-index: 999;
.content-bottom { .content-bottom {
position: relative; position: relative;
@ -386,7 +553,8 @@ export default {
top: 120px; top: 120px;
left: 10px; left: 10px;
padding: 2px; padding: 2px;
background: linear-gradient(to right, rgba(24, 101, 242, 0.1), rgba(24, 101, 242, 0.1)); // background: linear-gradient(to right, rgba(24, 101, 242, 0.1), rgba(24, 101, 242, 0.1));
background: linear-gradient(to right, rgb(1, 2, 62), rgb(25, 31, 84));
overflow: scroll; overflow: scroll;
.dialog-item { .dialog-item {
@ -409,18 +577,218 @@ export default {
} }
} }
.bottomList {
padding-left: 50px;
color: #fff;
.conbtm-item {
display: flex;
align-items: center;
margin: 20px 0;
color: #fff;
.conitem-bgimg {
width: 45px;
height: 45px;
font-size: 16px;
background-image: url("../assets/images/icon-type.png");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
display: flex;
justify-content: center;
align-items: center;
}
.conitme-title {
color: #f28221;
padding: 0 15px;
font-size: 17px;
text-align: justify;
/* 将文字两端对齐 */
.spantext {
display: inline-block;
width: 70px;
text-align: justify;
text-align-last: justify;
}
}
.conitme-right-item {
padding: 10px 20px;
background-color: #314b70;
margin-right: 1rem;
border-radius: 5px;
font-size: 18px;
cursor: pointer;
&:hover {
background: #1d82dc;
}
}
.conitme-right-item-active {
background: #1d82dc;
}
}
.bottomListShow {
position: relative;
z-index: 200;
text-align: center;
margin-left: -60px;
.el-icon-d-arrow-left {
transform: rotate(90deg);
font-size: 16px;
margin-left: 5px;
}
::v-deep .el-button {
font-size: 16px;
background: #4ed4a4;
}
}
.listBottom {
.listBottom-title {
display: flex;
align-items: center;
.span1 {
width: 25px;
height: 20px;
background-image: url("../assets/images/icon-search.png");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
margin-right: 10px;
}
.div1 {
color: #accbee;
font-size: 16px;
.span2 {
color: #0cc16e;
margin: 0 8px;
}
}
}
.listBottom-item {
width: 100%;
display: flex;
justify-content: space-between;
padding: 15px 20px;
color: #fff;
background: #1f3552;
border-radius: 10px;
margin: 15px 0;
.listitem-title {
width: 100%;
white-space: nowrap;
/* 禁止文本换行 */
overflow: hidden;
/* 溢出部分隐藏 */
text-overflow: ellipsis;
font-weight: 700;
font-size: 18px;
}
.listBottom-item-left {
width: 40%;
.listitemleft-bottom {
margin-top: 20px;
color: #accbee;
font-size: 18px;
display: flex;
align-items: center;
.span1 {
margin-right: 10px;
display: flex;
align-items: center;
.span2 {
display: inline-block;
width: 200px;
white-space: nowrap;
/* 禁止文本换行 */
overflow: hidden;
/* 溢出部分隐藏 */
text-overflow: ellipsis;
/* 显示省略号 */
}
}
}
}
.listBottom-item-right {
width: 50%;
.listitemright-bottom {
display: flex;
align-items: center;
.listitemright-bottom-item {
margin-top: 10px;
display: flex;
align-items: center;
font-size: 18px;
margin-right: 10px;
img {
width: 45px;
height: 45px;
margin-right: 10px;
}
span {
margin-left: 10px;
color: #35c4ff;
font-size: 28px;
font-weight: 700;
}
}
}
}
.listBottom-item-xiangqing {
display: flex;
align-items: center;
::v-deep .el-button {
font-size: 16px;
}
}
}
}
}
// //
::v-deep .el-loading-mask { ::v-deep .el-loading-mask {
background-color: rgba(205, 235, 243, 0.1); background-color: rgba(205, 235, 243, 0.1);
} }
// // //
// ::v-deep .el-loading-spinner .path{ // ::v-deep .el-loading-spinner .path{
// stroke: #005432; // stroke: #005432;
// } // }
// //
// ::v-deep .el-loading-spinner .el-loading-text{ // ::v-deep .el-loading-spinner .el-loading-text{
// color: #005432; // color: #005432;
// } // }</style>
</style>

@ -49,7 +49,7 @@ module.exports = {
} }
}, },
"API": { "API": {
target: "https://dev-mssm-liaoning.imian.org.cn", target: "https://dev-mssm-liaoning.lesdev.cn",
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
["API"]: "", ["API"]: "",

Loading…
Cancel
Save