suzhou-jichuang-lanhai
/
LiaoningChanpinHuaxiang
10
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化接口

Browse Source
duhanyu
杜函宇 2 years ago
parent a68c8e0a4c
commit 39954bb2eb
7 changed files with 362 additions and 341 deletions
Show Stats Download Patch File Download Diff File

2
src/assets/font/font.css
Unescape View File

@ -11,6 +11,6 @@
src: url('http://www.jichuanglanhai.com/demo/font-file/din-bold-2.ttf'); src: url('http://www.jichuanglanhai.com/demo/font-file/din-bold-2.ttf');
} }
@font-face { @font-face {
font-family: 'Regular'; font-family: 'Alibaba PuHuiTi';
src: url('http://www.jichuanglanhai.com/demo/font-file/Alibaba-PuHuiTi-Regular.otf'); src: url('http://www.jichuanglanhai.com/demo/font-file/Alibaba-PuHuiTi-Regular.otf');
} }

26
src/views/bigpage/bigcomponents/AdverseBox.vue
Unescape View File

@ -74,27 +74,41 @@ export default {
}, },
methods: { methods: {
getData() { getData() {
getDrugBL({ name: "国药准字B20020034" }).then((res) => { let newRouter = this.$route.query;
console.log(newRouter.type);
if (newRouter.type == 1) {
//药品
getDrugBL({ name: newRouter.code }).then((res) => {
console.log(res);
this.$nextTick(() => { this.$nextTick(() => {
let chartDom = this.$refs["bottom-box"]; let chartDom = this.$refs["bottom-box"];
this.myChart1 = echarts.init(chartDom); this.myChart1 = echarts.init(chartDom);
this.initEcharts(); this.initEcharts();
}); });
}); });
getCosmeticsBL({}).then(res=>{ }
if (newRouter.type != 1 && newRouter.type != 2) {
//化妆品
getCosmeticsBL({ name: newRouter.code }).then((res) => {
console.log(res);
this.$nextTick(() => { this.$nextTick(() => {
let chartDom = this.$refs["bottom-box"]; let chartDom = this.$refs["bottom-box"];
this.myChart1 = echarts.init(chartDom); this.myChart1 = echarts.init(chartDom);
this.initEcharts(); this.initEcharts();
}); });
}) });
getMedicalDevicesBL({}).then(res=>{ }
if (newRouter.type == 2) {
//医疗器械
getMedicalDevicesBL({ name: newRouter.code }).then((res) => {
console.log(res);
this.$nextTick(() => { this.$nextTick(() => {
let chartDom = this.$refs["bottom-box"]; let chartDom = this.$refs["bottom-box"];
this.myChart1 = echarts.init(chartDom); this.myChart1 = echarts.init(chartDom);
this.initEcharts(); this.initEcharts();
}); });
}) });
}
}, },
initEcharts() { initEcharts() {
this.option1 = { this.option1 = {
@ -451,7 +465,7 @@ export default {
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
font-weight: 400; font-weight: 400;
color: #ffffff; color: #ffffff;
background: linear-gradient(0deg,#ffffff 0%, #d21b1b 100%); background: linear-gradient(0deg, #ffffff 0%, #d21b1b 100%);
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
margin-right: 5px; margin-right: 5px;

5
src/views/bigpage/bigcomponents/ChangeinformationList.vue
Unescape View File

@ -7,6 +7,7 @@
element-loading-text="加载中..." element-loading-text="加载中..."
element-loading-spinner="el-icon-loading" element-loading-spinner="el-icon-loading"
element-loading-background="rgba(0, 0, 0, 0.8)" element-loading-background="rgba(0, 0, 0, 0.8)"
height="208"
stripe stripe
style="width: 100%; background-color: transparent" style="width: 100%; background-color: transparent"
> >
@ -67,7 +68,7 @@ export default {
tableData: [], tableData: [],
query: { query: {
current: 1, current: 1,
size: 5, size: 10,
name: "", name: "",
}, },
total: 0, total: 0,
@ -80,6 +81,8 @@ export default {
}, },
methods: { methods: {
getList() { getList() {
let newRouter = this.$route.query;
this.query.name = newRouter.code;
this.load1 = true; this.load1 = true;
getDrugChange(this.query).then((res) => { getDrugChange(this.query).then((res) => {
this.tableData = res.data.records; this.tableData = res.data.records;

13
src/views/bigpage/bigcomponents/informationBox.vue
Unescape View File

@ -41,7 +41,7 @@
<script> <script>
import * as echarts from "echarts"; import * as echarts from "echarts";
import { getCPCJ } from "@/api/largeScreen/index";
export default { export default {
name: "informationBox", name: "informationBox",
components: {}, components: {},
@ -69,22 +69,27 @@ export default {
// echarts // echarts
myChart2: {}, myChart2: {},
//============== //==============
}; };
}, },
created() {}, created() {},
mounted() { mounted() {
this.getData();
},
methods: {
getData() {
let newRouter = this.$route.query;
getCPCJ({ name: newRouter.code }).then((res) => {
console.log(res);
this.$nextTick(() => { this.$nextTick(() => {
let chartDom = this.$refs["left-echart"]; let chartDom = this.$refs["left-echart"];
this.myChart1 = echarts.init(chartDom); this.myChart1 = echarts.init(chartDom);
this.initEcharts(); this.initEcharts();
let chartDom2 = this.$refs["right-echart"]; let chartDom2 = this.$refs["right-echart"];
this.myChart2 = echarts.init(chartDom2); this.myChart2 = echarts.init(chartDom2);
this.initEcharts2(); this.initEcharts2();
}); });
});
}, },
methods: {
initEcharts() { initEcharts() {
this.option1 = { this.option1 = {
tooltip: { tooltip: {

12
src/views/bigpage/bigcomponents/recallbox.vue
Unescape View File

@ -55,7 +55,8 @@ export default {
}, },
methods: { methods: {
getData() { getData() {
getRecall({ name: "国药准字B20020034" }).then((res) => { let newRouter = this.$route.query;
getRecall({ name: newRouter.code }).then((res) => {
this.zhcs = res.data.cpzhcs; this.zhcs = res.data.cpzhcs;
this.cpzhbs = res.data.zhcppc; this.cpzhbs = res.data.zhcppc;
this.cpzhcs = res.data.cpzhl; this.cpzhcs = res.data.cpzhl;
@ -175,17 +176,18 @@ export default {
</script> </script>
<style scoped lang='scss'> <style scoped lang='scss'>
.box { .box {
height: calc(100% - 41px);
width: 100%;
} }
.top-box { .top-box {
margin: 10px 0; margin: 10px 0;
height: 85px; height: 85px;
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-around;
.topbox-item { .topbox-item {
width: 240px; width: 30%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
@ -269,7 +271,7 @@ export default {
} }
.bottom-content { .bottom-content {
height: 210px; height: calc(100% - 20px - 85px);
display: flex; display: flex;
.right-echart { .right-echart {

98
src/views/bigpage/index.vue
Unescape View File

@ -2,16 +2,12 @@
<template> <template>
<div class="pc-container"> <div class="pc-container">
<div class="system-header"> <div class="system-header">
<div class="left-tags"> <div class="left-tags">2023年8月11日 星期五 16:23:34</div>
2023年8月11日 星期五 16:23:34 <div class="system-title" text="产品画像">产品画像</div>
</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>晴天 17~28°C <span class="rigth-tags-spana"><i class="el-icon-sunny"></i></span
<span class="rigth-tags-spanb"> | </span>东南风3级 >晴天 17~28°C <span class="rigth-tags-spanb"> | </span>东南风3级
</div> </div>
</div> </div>
</div> </div>
@ -72,35 +68,41 @@
<script> <script>
// 头部 // 头部
import headtitle from './bigcomponents/headtitle.vue'; import headtitle from "./bigcomponents/headtitle";
// 基本信息 // 基本信息
import Basicbox from './bigcomponents/Basicbox.vue'; import Basicbox from "./bigcomponents/Basicbox.vue";
// 变更信息 // 变更信息
import ChangeinformationList from './bigcomponents/ChangeinformationList.vue'; import ChangeinformationList from "./bigcomponents/ChangeinformationList";
// 风险提示信息 // 风险提示信息
import riskinformationList from './bigcomponents/riskinformationList.vue'; import riskinformationList from "./bigcomponents/riskinformationList";
// 检验检测信息 // 检验检测信息
import informationBox from './bigcomponents/informationBox.vue'; import informationBox from "./bigcomponents/informationBox";
// 召回信息 // 召回信息
import recallbox from './bigcomponents/recallbox.vue'; import recallbox from "./bigcomponents/recallbox.vue";
// 不良反应 // 不良反应
import AdverseBox from './bigcomponents/AdverseBox.vue'; import AdverseBox from "./bigcomponents/AdverseBox.vue";
export default { export default {
name: '', name: "",
components: { headtitle, Basicbox, ChangeinformationList,riskinformationList,informationBox,recallbox,AdverseBox }, components: {
headtitle,
Basicbox,
ChangeinformationList,
riskinformationList,
informationBox,
recallbox,
AdverseBox,
},
data() { data() {
return { return {};
}
}, },
created() { }, created() {},
mounted() { }, mounted() {},
methods: {}, methods: {},
computed: {} computed: {},
} };
</script> </script>
<style scoped lang='scss'> <style scoped lang='scss'>
@import '@/assets/styles/theme.scss'; @import "@/assets/styles/theme.scss";
div { div {
text-align: left; text-align: left;
@ -109,7 +111,8 @@ div {
.pc-container { .pc-container {
overflow: hidden; overflow: hidden;
height: 100%; height: 100%;
background: url('../../assets/images/daping/main-background.png') no-repeat center; background: url("../../assets/images/daping/main-background.png") no-repeat
center;
background-size: cover; background-size: cover;
position: relative; position: relative;
@ -118,14 +121,14 @@ div {
// position: absolute; // position: absolute;
// top: 0; // top: 0;
// left: 0; // left: 0;
height: 12vh; height: 10vh;
width: 100%; width: 100%;
background-image: url('../../assets/images/daping/img_title@2x.png'); background-image: url("../../assets/images/daping/img_title@2x.png");
background-size: 100% 100%; background-size: 100% 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
&>div { & > div {
flex: 1; flex: 1;
height: 100%; height: 100%;
} }
@ -133,7 +136,7 @@ div {
.system-title { .system-title {
padding: 0 0 10px 0; padding: 0 0 10px 0;
font-size: 50px; font-size: 50px;
font-family: 'YouSheBiaoTiHei'; font-family: "YouSheBiaoTiHei";
font-weight: 400; font-weight: 400;
color: #ffffff; color: #ffffff;
display: flex; display: flex;
@ -161,7 +164,7 @@ div {
align-items: flex-end; align-items: flex-end;
flex-direction: row-reverse; flex-direction: row-reverse;
box-sizing: border-box; box-sizing: border-box;
color: #86A3C3; color: #86a3c3;
padding: 0 20px 20px 0; padding: 0 20px 20px 0;
.rigth-tags-spana { .rigth-tags-spana {
@ -176,9 +179,8 @@ div {
width: 2px; width: 2px;
height: 16px; height: 16px;
padding: 0 5px; padding: 0 5px;
color: #2D8EF2; color: #2d8ef2;
} }
} }
.left-tags { .left-tags {
@ -188,13 +190,13 @@ div {
color: #ffffff; color: #ffffff;
font-weight: 400; font-weight: 400;
padding: 0 0 20px 20px; padding: 0 0 20px 20px;
color: #86A3C3; color: #86a3c3;
} }
} }
// 底部 // 底部
.system-bottom { .system-bottom {
height: 87vh; height: 89vh;
padding: 24px; padding: 24px;
position: relative; position: relative;
@ -250,7 +252,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;
@ -269,31 +271,21 @@ div {
.system-box-left { .system-box-left {
flex: 1; flex: 1;
width: 25vw;
.system-boxleft-top, .system-boxleft-top,
.system-boxleft-bottom { .system-boxleft-bottom {
background: url('../../assets/images/daping/boxBG.png'); background: url("../../assets/images/daping/boxBG.png");
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
/* 将项目从下往上排列 */
.system-boxleft-top {}
.system-boxleft-bottom {}
} }
.system-box-content { .system-box-content {
width: 48vw;
margin: 0 15px; margin: 0 15px;
flex: 2; flex: 2;
} }
.system-box-right { .system-box-right {
width: 25vw;
flex: 1; flex: 1;
} }
} }
@ -313,7 +305,7 @@ div {
font-size: 32px; font-size: 32px;
font-family: Regular; font-family: Regular;
font-weight: bold; font-weight: bold;
color: #61B5F5; color: #61b5f5;
line-height: 42px; line-height: 42px;
} }
@ -323,15 +315,17 @@ div {
margin: 0 3px; margin: 0 3px;
width: 93px; width: 93px;
height: 49px; height: 49px;
background: url('../../assets/images/daping/fengxianbgc.png') no-repeat center; background: url("../../assets/images/daping/fengxianbgc.png")
no-repeat center;
background-size: contain; background-size: contain;
text-align: center; text-align: center;
line-height: 49px; line-height: 49px;
color: #4DA5FF; color: #4da5ff;
font-weight: 400; font-weight: 400;
} }
} }
} }
} }
}</style> }
</style>

39
src/views/components/Pagination.vue
Unescape View File

@ -5,7 +5,7 @@
background background
:current-page.sync="currentPage" :current-page.sync="currentPage"
:page-size.sync="pageSize" :page-size.sync="pageSize"
layout="->,prev, total,pager, next,jumper" layout="prev, pager, next,jumper"
:page-sizes="pageSizes" :page-sizes="pageSizes"
:pager-count="pagerCount" :pager-count="pagerCount"
:total="total" :total="total"
@ -104,6 +104,14 @@ export default {
}; };
</script> </script>
<style scoped lang='scss'> <style scoped lang='scss'>
::v-deep .el-pagination {
width: 100%;
display: flex;
justify-content: end;
padding: 8px 5px;
box-sizing: border-box;
overflow-y: auto;
}
.box { .box {
background-color: transparent !important; background-color: transparent !important;
} }
@ -117,18 +125,17 @@ export default {
border: 1px solid #123864; border: 1px solid #123864;
color: #579acf; color: #579acf;
} }
::v-deep .el-pagination.is-background .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; // border-radius: 4px;
border-radius: 4px; // color: #fff;
color: #fff; // }
}
::v-deep .el-pagination__jump { ::v-deep .el-pagination__jump {
margin: 0; margin: 0;
color: #2668d6; color: #2668d6;
@ -138,17 +145,13 @@ export default {
color: #2668d6; color: #2668d6;
} }
} }
::v-deep .el-pagination__total {
color: #2668d6;
}
::v-deep .el-pagination.is-background .el-pager li:hover {
background: rgba(20, 131, 242, 0.2) !important;
border: 1px solid #1483f2;
border-radius: 4px;
}
::v-deep .el-pager li.active { ::v-deep .el-pager li.active {
background: rgba(20, 131, 242, 0.2) !important; background: rgba(20, 131, 242, 0.52) !important;
border: 1px solid #1483f2; border: 1px solid #1483f2;
border-radius: 4px; border-radius: 4px;
} }
// ::v-deep .el-pagination__total {
// color: #2668d6;
// }
</style> </style>

Write Preview
Loading…
Cancel
Save