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

修改产品画像检验检测信息，不良反应信息

Browse Source
main
李劲龙 1 year ago
parent 265677dbef
commit 6b9c34f458
9 changed files with 156 additions and 81 deletions
Show Stats Download Patch File Download Diff File

12
src/api/myAPI/login.js
Unescape View File

@ -1,8 +1,8 @@
import request from "@/utils/request"; import request from "@/utils/request";
// 本地 // 本地
// let api = "API" let api = "API"
// 线上 // 线上
let api = location.origin // let api = location.origin
export default { export default {
frimLogin() { frimLogin() {
return request({ return request({
@ -16,10 +16,10 @@ export default {
method: "POST", method: "POST",
timeout: 60000, timeout: 60000,
data: { data: {
pdma: "Q2V0YzI4QGNvbQ==", // pdma: "Q2V0YzI4QGNvbQ==",
urne: "2112042170015", // urne: "2112042170015",
// pdma: "MTExMTEx", pdma: "MTExMTEx",
// urne: "2112042170015", urne: "2112042170015",
}, },
}); });
}, },

19
src/main.js
Unescape View File

@ -71,14 +71,14 @@ 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() token()
let infor = async () => { let infor = async () => {
let response = await API.login.getuserinfo(); let response = await API.login.getuserinfo();
localStorage.setItem("userDto", JSON.stringify(response?.result.userDto)); localStorage.setItem("userDto", JSON.stringify(response?.result.userDto));
@ -94,7 +94,10 @@ infor()
* Currently MockJs will be used in the production environment, * Currently MockJs will be used in the production environment,
* please remove it before going online! ! ! * please remove it before going online! ! !
*/ */
/*
*/
Vue.use(Element, { Vue.use(Element, {
size: Cookies.get('size') || 'medium' // set element-ui default size size: Cookies.get('size') || 'medium' // set element-ui default size
}) })

4
src/utils/request.js
Unescape View File

@ -15,9 +15,9 @@ axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
// 创建axios实例 // 创建axios实例
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,
//!线上 //!线上
baseURL:location.origin, // baseURL:location.origin,
// 超时 // 超时
timeout: 10000 timeout: 10000
}) })

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

@ -28,7 +28,7 @@
</div> </div>
<div class="topbox-item-right"> <div class="topbox-item-right">
<!-- <div class="redStyle">较去年</div> --> <!-- <div class="redStyle">较去年</div> -->
<div >较去年</div> <div>较去年</div>
<!-- <span class="spanxia">↑</span> --> <!-- <span class="spanxia">↑</span> -->
<span class="spanshang">↓</span> <span class="spanshang">↓</span>
</div> </div>
@ -44,7 +44,7 @@
</div> </div>
<div class="topbox-item-right"> <div class="topbox-item-right">
<!-- <div class="redStyle">较去年</div> --> <!-- <div class="redStyle">较去年</div> -->
<div >较去年</div> <div>较去年</div>
<!-- <span class="spanxia">↑</span> --> <!-- <span class="spanxia">↑</span> -->
<span class="spanshang">↓</span> <span class="spanshang">↓</span>
</div> </div>
@ -55,20 +55,20 @@
<div class="bottom-box" ref="bottom-box"></div> <div class="bottom-box" ref="bottom-box"></div>
</div> </div>
<div class="rights"> <div class="rights">
<div> <div v-for="(item, index) in pieDatalist">
<div class="pt-top"> <div class="pt-top">
<div class="ptleftbox"> <div class="ptleftbox">
<div class="rectangular1"></div> <div :class="'rectangular' + (index + 1)"></div>
</div> </div>
<div class="texts">一般不良反应</div> <div class="texts">{{ item.name }}</div>
</div> </div>
<div class="pt-top"> <div class="pt-top">
<div class="ptleftbox"></div> <div class="ptleftbox"></div>
<div class="boxLine"></div> <div class="boxLine"></div>
<div class="ptStyle react1">0%</div> <div :class="('react' + (index + 1))" class="ptStyle">{{item.percent}}%</div>
</div> </div>
</div> </div>
<div> <!-- <div>
<div class="pt-top"> <div class="pt-top">
<div class="ptleftbox"> <div class="ptleftbox">
<div class="rectangular2"></div> <div class="rectangular2"></div>
@ -80,8 +80,8 @@
<div class="boxLine"></div> <div class="boxLine"></div>
<div class="ptStyle react2">0%</div> <div class="ptStyle react2">0%</div>
</div> </div>
</div> </div> -->
<div> <!-- <div>
<div class="pt-top"> <div class="pt-top">
<div class="ptleftbox"> <div class="ptleftbox">
<div class="rectangular3"></div> <div class="rectangular3"></div>
@ -93,7 +93,7 @@
<div class="boxLine"></div> <div class="boxLine"></div>
<div class="ptStyle react3">0%</div> <div class="ptStyle react3">0%</div>
</div> </div>
</div> </div> -->
</div> </div>
</div> </div>
</div> </div>
@ -115,6 +115,7 @@ export default {
option1: {}, option1: {},
// echarts // echarts
myChart1: {}, myChart1: {},
a1: 0, a1: 0,
a2: 0, a2: 0,
a3: 0, a3: 0,
@ -133,10 +134,24 @@ export default {
name: "发生死亡不良反应", name: "发生死亡不良反应",
}, },
], ],
pieDatalist: [
{
percent: 0,
name: "一般不良反应",
},
{
percent: 0,
name: "严重不良反应",
},
{
percent: 0,
name: "发生死亡不良反应",
},
],
total: 0, total: 0,
}; };
}, },
created() {}, created() { },
mounted() { mounted() {
this.getData(); this.getData();
}, },
@ -376,6 +391,13 @@ export default {
normal: { normal: {
show: false, show: false,
formatter: "", formatter: "",
formatter: (params)=> {
if (params.name == "一般不良反应") this.pieDatalist[0].percent = params.percent || 0;
if (params.name == "严重不良反应") this.pieDatalist[1].percent = params.percent || 0;
if (params.name == "发生死亡不良反应") this.pieDatalist[2].percent = params.percent || 0;
return (params.percent || 0) + "%";
},
textStyle: { textStyle: {
fontSize: 12, fontSize: 12,
}, },
@ -447,7 +469,7 @@ export default {
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: bottom; background-position: bottom;
> div { >div {
display: flex; display: flex;
align-items: center; align-items: center;
} }
@ -505,6 +527,7 @@ export default {
.topbox-item-right { .topbox-item-right {
flex: 1; flex: 1;
.redStyle { .redStyle {
font-size: 16px; font-size: 16px;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
@ -515,6 +538,7 @@ export default {
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
margin-right: 5px; margin-right: 5px;
} }
div { div {
font-size: 16px; font-size: 16px;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
@ -542,6 +566,7 @@ export default {
} }
} }
} }
.footers { .footers {
height: calc(100% - 120px); height: calc(100% - 120px);
display: flex; display: flex;
@ -550,11 +575,13 @@ export default {
height: 100%; height: 100%;
width: 50%; width: 50%;
padding: 10px; padding: 10px;
.bottom-box { .bottom-box {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
} }
.rights { .rights {
height: 100%; height: 100%;
padding-left: 15px; padding-left: 15px;
@ -569,25 +596,30 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
position: relative; position: relative;
.ptleftbox { .ptleftbox {
width: 12%; width: 12%;
height: 100%; height: 100%;
.rectangular1 { .rectangular1 {
height: 8px; height: 8px;
width: 8px; width: 8px;
background: #2e87e8; background: #2e87e8;
} }
.rectangular2 { .rectangular2 {
height: 8px; height: 8px;
width: 8px; width: 8px;
background: #f0a436; background: #f0a436;
} }
.rectangular3 { .rectangular3 {
height: 8px; height: 8px;
width: 8px; width: 8px;
background: #f35656; background: #f35656;
} }
} }
.texts { .texts {
width: 60%; width: 60%;
font-size: 16px; font-size: 16px;
@ -595,6 +627,7 @@ export default {
font-weight: 400; font-weight: 400;
color: #b7d4f5; color: #b7d4f5;
} }
.react1 { .react1 {
// font-size: 20px; // font-size: 20px;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
@ -602,6 +635,7 @@ export default {
color: #2e87e8; color: #2e87e8;
padding-left: 10px; padding-left: 10px;
} }
.react2 { .react2 {
// font-size: 20px; // font-size: 20px;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
@ -609,6 +643,7 @@ export default {
color: #f0a436; color: #f0a436;
padding-left: 10px; padding-left: 10px;
} }
.react3 { .react3 {
// font-size: 20px; // font-size: 20px;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
@ -617,15 +652,15 @@ export default {
color: #f35656; color: #f35656;
} }
.ptStyle { .ptStyle {
width: 60%; width: 60%;
margin-top: 5px; margin-top: 5px;
background: linear-gradient( background: linear-gradient(to right,
to right, rgba(36, 64, 97, 1),
rgba(36, 64, 97, 1), rgba(36, 64, 97, 0));
rgba(36, 64, 97, 0)
);
} }
.boxLine { .boxLine {
position: absolute; position: absolute;
width: 18px; width: 18px;

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

@ -109,7 +109,7 @@ export default {
<style scoped lang='scss'> <style scoped lang='scss'>
.Basic-box { .Basic-box {
margin-top: 10px; margin-top: 10px;
width: 100%; max-width: 100%;
height: calc(100% - 41px - 10px); height: calc(100% - 41px - 10px);
// padding: 0 11px 11px 11px; // padding: 0 11px 11px 11px;
overflow-y: auto; overflow-y: auto;

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

@ -10,9 +10,9 @@
:content="Number(countryC) || 0" :content="Number(countryC) || 0"
placement="top-start" placement="top-start"
> --> > -->
<div class="topBOxitem-top"> <div class="topBOxitem-top">
<span>{{ countryC || 0 }}</span> <span>次</span> <span>{{ countryC || 0 }}</span> <span>次</span>
</div> </div>
<!-- </el-tooltip> --> <!-- </el-tooltip> -->
<div class="topBOxitem-bottom">国家检测次数</div> <div class="topBOxitem-bottom">国家检测次数</div>
@ -26,9 +26,9 @@
:content="Number(provinceC) || 0" :content="Number(provinceC) || 0"
placement="top-start" placement="top-start"
> --> > -->
<div class="topBOxitem-top"> <div class="topBOxitem-top">
<span>{{ provinceC || 0 }}</span> <span>次</span> <span>{{ provinceC || 0 }}</span> <span>次</span>
</div> </div>
<!-- </el-tooltip> --> <!-- </el-tooltip> -->
<div class="topBOxitem-bottom">省级抽检次数</div> <div class="topBOxitem-bottom">省级抽检次数</div>
@ -76,7 +76,25 @@ export default {
option1: {}, option1: {},
// echarts // echarts
myChart1: {}, myChart1: {},
myChart1data: [
// 各分区样式: value值，name表示各分区的标识、itemStyle模块样式
// 注意: name与上面的legend-data中必须保持一致，才可展示按钮组
{
value: "0",
name: "生产抽样环节",
percent: "0",
// itemStyle: { color: "#007EFF" },
},
{
value: "0",
name: "流通环节抽样",
percent: "0",
// itemStyle: { color: "#2CD8EC" },
},
],
option2: {}, option2: {},
myChart2data: [],
myChart2data2: [],
// echarts // echarts
myChart2: {}, myChart2: {},
//============== //==============
@ -89,26 +107,56 @@ export default {
ltcy: 0, ltcy: 0,
}; };
}, },
created() {}, created() { },
mounted() { mounted() {
this.getData(); this.getData();
}, },
methods: { methods: {
reducefn(data = []) {
return data.reduce((accumulator, current) => current.sampleType + accumulator, 0);
},
getData() { getData() {
let newRouter = this.$route.query; let newRouter = this.$route.query;
getCPCJ({ name: newRouter.code }).then((res) => { getCPCJ({ name: newRouter.code }).then((res) => {
res.data.result.forEach((value, index) => { if (res.code == 200) {
if (value.sampleType == 1) { if (res.data.result.length != 0) {
this.provinceC += 1;
} else if (value.sampleType == 2) { // 计算生产抽样数量
this.countryC += 1; 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[1].value = res.data.result.filter(item => item.inspectType === "流通环节").length
this.myChart1data[1].percent = ((res.data.result.filter(item => item.inspectType === "流通环节").length / res.data.result.length) * 100).toFixed(1)
// 计算省份次数
let mergedData = {};
res.data.result.forEach((item) => {
if (item.qualified === "合格") {
if (mergedData[item.province]) {
mergedData[item.province].sampleType += item.sampleType;
} else {
mergedData[item.province] = {
province: item.province,
sampleType: item.sampleType
};
}
}
});
const result = Object.values(mergedData);
result.forEach(item=>{
this.myChart2data.push(item.province)
this.myChart2data2.push(item.sampleType)
})
// 国家次数显示
this.countryC = res.data.result.length
// 计算合格率
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)
}else{
this.myChart2data = ["暂无"]
this.myChart2data2 = ['0']
} }
}); }
// this.countryC = 12;
// this.provinceC = 12;
// this.pt = 67;
// this.sccy = 60;
// this.ltcy = 40;
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);
@ -131,9 +179,9 @@ export default {
params.marker + params.marker +
params.name + params.name +
": " + ": " +
params.value + ( params.value||0) +
" (" + " (" +
params.percent + ( params.percent || 0) +
"%)</div>" "%)</div>"
); );
}, },
@ -156,15 +204,15 @@ export default {
{ {
name: "", name: "",
type: "pie", type: "pie",
radius: ["45%", "70%"], radius: ["45%", "66%"],
center: ["50%", "40%"], // 调整 y 值为 '40%'，使饼图向上位移 center: ["50%", "44%"], // 调整 y 值为 '40%'，使饼图向上位移
// itemStyle:{ // itemStyle:{
// borderWidth:1, //设置border的宽度有多大 // borderWidth:1, //设置border的宽度有多大
// borderColor:'#fff', // borderColor:'#fff',
// }, // },
labelLine: { labelLine: {
normal: { normal: {
length: 15, // 指示线宽度 length: 10, // 指示线宽度
position: "outer", // 将标签线放在扇区外部转折点 position: "outer", // 将标签线放在扇区外部转折点
lineStyle: function (params) { lineStyle: function (params) {
// 根据数据项的颜色动态设置文字颜色 // 根据数据项的颜色动态设置文字颜色
@ -180,7 +228,7 @@ export default {
// 各分区的提示内容 // 各分区的提示内容
// params: 即下面传入的data数组,通过自定义函数，展示你想要的内容和格式 // params: 即下面传入的data数组,通过自定义函数，展示你想要的内容和格式
formatter: function (params) { formatter: function (params) {
return params.percent + "%"; return (params.data.percent || 0) + "%";
}, },
textStyle: { textStyle: {
color: "auto", color: "auto",
@ -188,22 +236,7 @@ export default {
}, },
}, },
}, },
data: [ data: this.myChart1data
// 各分区样式: value值，name表示各分区的标识、itemStyle模块样式
// 注意: name与上面的legend-data中必须保持一致，才可展示按钮组
{
value: "1",
name: "生产抽样环节",
// percent: "39",
// itemStyle: { color: "#007EFF" },
},
{
value: "1",
name: "流通环节抽样",
// percent: "21",
// itemStyle: { color: "#2CD8EC" },
},
],
}, },
], ],
}; };
@ -238,11 +271,12 @@ export default {
fontSize: 12, fontSize: 12,
margin: 0, margin: 0,
}, },
rotate: -30, // 设置文字倾斜角度
}, },
axisTick: { axisTick: {
show: false, show: false,
}, },
data: ["辽宁", "江苏", "湖南", "山西", "湖北", "山东"], data: this.myChart2data
}, },
], ],
yAxis: [ yAxis: [
@ -302,7 +336,7 @@ export default {
}, },
}, },
data: [12, 15, 17, 20, 25, 26], data: this.myChart2data2
}, },
], ],
}; };
@ -313,8 +347,7 @@ export default {
}; };
</script> </script>
<style scoped lang='scss'> <style scoped lang='scss'>
.box { .box {}
}
.top-box { .top-box {
margin: 10px 0; margin: 10px 0;

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

@ -349,7 +349,8 @@ 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 {
@ -366,6 +367,8 @@ div {
.system-box-right { .system-box-right {
flex: 1; flex: 1;
width: 25vw;
} }
} }

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

@ -105,7 +105,7 @@ export default {
</script> </script>
<style scoped lang='scss'> <style scoped lang='scss'>
::v-deep .el-pagination { ::v-deep .el-pagination {
width: 100%; max-width: 100%;
display: flex; display: flex;
justify-content: end; justify-content: end;
padding: 8px 5px; padding: 8px 5px;

3
src/views/index.vue
Unescape View File

@ -102,7 +102,8 @@ export default {
gotoBgpage() { gotoBgpage() {
if (this.input) { if (this.input) {
console.log(this.searchList, 'this.searchList') console.log(this.searchList, 'this.searchList')
if (this.searchList.length == 1) { console.log( this.getData.code," this.getData");
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 = [];
} else if (this.searchList.length > 1) { } else if (this.searchList.length > 1) {

Write Preview
Loading…
Cancel
Save