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

Merge branch 'duhanyu' of http://39.101.188.84:8000/suzhou-jichuang-lanhai/LiaoNingDangAn

Browse Source
Lvtianfang
李劲龙 2 years ago
parent 519fc6c765 b381917130
commit 254b18ff08
5 changed files with 327 additions and 525 deletions
Show Stats Download Patch File Download Diff File

46
src/api/archives/cosmetics.js
Unescape View File

@ -1,11 +1,49 @@
import request from "@/utils/request2"; import request from "@/utils/request2";
export default { export default {
//获取 //根据名称或者备案号分页查询国产化妆品数据
getList(query) { domesticList(query) {
return request({ return request({
url: "/inspectorAssign", url: "/pharmaceuticals/gccp",
method: "GET", method: "GET",
params: query, params: query,
}); });
} },
//根据备案号查询单条国产化妆品数据
// domesticGet(bah) {
// return request({
// url: `/pharmaceuticals/gccp/${bah}`,
// method: "GET",
// });
// },
//根据名称或者注册证号分页查询国产特殊化妆品数据
specialList(query) {
return request({
url: "/pharmaceuticals/gctshzp",
method: "GET",
params: query,
});
},
//通过注册证号查询单条国产特殊化妆品
// specialGet(bah) {
// return request({
// url: `/pharmaceuticals/gctshzp/${bah}`,
// method: "GET",
// });
// },
//分页条件查询进口产品
importList(query) {
return request({
url: "/pharmaceuticals/jkcp",
method: "GET",
params: query,
});
},
//根据名称或者注册证号分页查询进口特殊化妆品数据
importSpecialList(query) {
return request({
url: "/pharmaceuticals/jktshzp",
method: "GET",
params: query,
});
},
} }

4
src/api/index.js
Unescape View File

@ -1,4 +1,6 @@
import toLogin from "./archives/toLogin"; import toLogin from "./archives/toLogin";
import cosmetics from "./archives/cosmetics";
export default { export default {
toLogin toLogin,
cosmetics
}; };

4
src/components/Pagination/index.vue
Unescape View File

@ -48,7 +48,7 @@ export default {
pageSizes: { pageSizes: {
type: Array, type: Array,
default() { default() {
return [10, 20, 30, 50]; return [5,10,20];
}, },
}, },
// 移动端页码按钮的数量端默认值5 // 移动端页码按钮的数量端默认值5
@ -119,7 +119,7 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
margin-top: 10px; padding: 15px 20px;
} }
.pagination-container.hidden { .pagination-container.hidden {

2
src/utils/request2.js
Unescape View File

@ -29,7 +29,7 @@ service.interceptors.request.use(
const isRepeatSubmit = (config.headers || {}).repeatSubmit === false; const isRepeatSubmit = (config.headers || {}).repeatSubmit === false;
if (!isToken) { if (!isToken) {
config.headers["Authentication"] = localStorage.getItem( config.headers["Authentication"] = localStorage.getItem(
"MSSM-LIAONING__TOKEN" "Authentication"
); );
} }
// get请求映射params参数 // get请求映射params参数

796
src/views/productsMsg/components/cosmeticsArchives.vue
Unescape View File

@ -1,554 +1,316 @@
<template> <template>
<div class="container"> <div class="container">
<div class="right-content"> <div class="tabs">
<div class="tabs"> <div class="headerText">
<el-tabs <div class="searchP">查询条件</div>
v-model="activeName" </div>
style="color: #edeef0" <el-form ref="form1" :model="form1" label-width="80px">
> <div style="margin-top: 10px">
<el-tab-pane label="查询条件" name="first"> <el-row>
<div class="screen"> <el-col :span="7">
<div class="task-name"> <el-form-item label="产品名称">
<span class="task-name-text">产品名称：</span> <el-input v-model="form1.name"></el-input>
<div class="task-input"> </el-form-item>
<el-input </el-col>
v-model="queryCondition.fullTextSearch" <el-col :span="7">
placeholder="请输入内容" <el-form-item label="备案编码">
></el-input> <el-input v-model="form1.name"></el-input>
</div> </el-form-item>
</div> </el-col>
<div class="task-name"> <el-col :span="7">
<span class="task-name-text">备案编码：</span> <el-form-item label="生产企业">
<div class="task-input"> <el-input v-model="form1.a1"></el-input>
<el-input </el-form-item>
v-model="queryCondition.firmName" </el-col>
placeholder="请输入内容" </el-row>
></el-input> </div>
</div> <el-row>
</div> <el-col :span="7">
<div class="task-name"> <el-form-item label="化妆品类型">
<span class="task-name-text">生产企业：</span> <el-select
<div class="task-input"> v-model="types"
<el-input placeholder="请选择化妆品类型"
v-model="queryCondition.approvalNumber" @change="changeType"
placeholder="请输入内容" >
></el-input> <el-option
</div> v-for="item in options"
</div> :key="item.value"
:label="item.label"
<div class="btn"> :value="item.value"
<el-button size="mini" icon="el-icon-refresh-left">重置</el-button>
<el-button size="mini" type="primary" icon="el-icon-search">查询</el-button>
</div>
</div>
</el-tab-pane>
</el-tabs>
<div class="tabsTwo" :style="tabsTwoStyle">
<el-tabs
v-model="activeName"
style="color: #edeef0"
>
<el-tab-pane label="化妆品列表" name="first">
<div class="daochu">
<div class="btn">
导出
</div>
</div>
<div class="mytable">
<el-table
ref="multipleTable"
:data="tableData"
tooltip-effect="dark"
border
style="width: 100%"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
header-align="center"
class-name="column-text-one"
width="44">
</el-table-column>
<el-table-column
label="序号"
width="50">
<template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column>
<el-table-column
prop="name"
label="产品名称"
>
</el-table-column>
<el-table-column
prop="firmName"
label="备案编码"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="firmName"
label="生产企业"
show-overflow-tooltip>
</el-table-column>
<el-table-column
prop="address"
label="操作"
width="180"
>
<template slot-scope="scope">
<div class="button">
<el-button
size="mini"
type="primary"
class="xiangqing"
plain
@click="handleEdit(scope.$index, scope.row)"
>详情</el-button
>
<el-button
size="mini"
type="primary"
class="bianji"
plain
@click="handleView(scope.$index, scope.row)"
>编辑</el-button
>
</div>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<!-- <span class="custom"
>共{{ total }}条，显示{{
total == 0
? "0"
: queryCondition.current == 1
? "1"
: queryCondition.size * (queryCondition.current - 1) + 1
}}-{{ numberMap() }}条</span
> -->
<span class="custom">
共100条，显示1-10条
</span>
<el-pagination
background
:page-sizes="[10, 15]"
:total="total"
layout=" prev, pager, next, sizes, jumper"
@current-change="currentChange"
@size-change="sizeChange"
:current-page.sync="currentPage"
:page-size.sync="pageSize"
> >
</el-pagination> </el-option>
</div> </el-select> </el-form-item
</div> ></el-col>
</el-tab-pane> </el-row>
</el-tabs> </el-form>
<div class="footBox">
<el-button icon="el-icon-refresh-left" @click="reset">重置</el-button>
<el-button type="primary" icon="el-icon-search" @click="searchList"
>查询</el-button
>
</div>
</div>
<div class="tabsBottom">
<div class="foot-main">
<div class="headerText">
<div class="searchP">产品列表</div>
</div>
<div class="exportBtn">
<el-button type="primary" icon="el-icon-edit-outline">导出</el-button>
</div> </div>
<section class="table-box">
<div class="table-item">
<el-table
v-loading="loading"
:data="tableData"
border
height="300"
:stripe="false"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column type="index" label="序号" width="55" />
<el-table-column label="产品名称">
<template slot-scope="scope">
{{ scope.row.mc || scope.row.cpmc }}
</template>
</el-table-column>
<el-table-column :label="A2">
<template slot-scope="scope">
{{ scope.row.bah || scope.row.pzrq }}
</template>
</el-table-column>
<el-table-column :label="A3">
<template slot-scope="scope">
{{ scope.row.qy || scope.row.sf }}
</template>
</el-table-column>
<el-table-column
label="操作"
class-name="small-padding fixed-width"
width="140"
>
<template slot-scope="scope">
<el-button
size="mini"
plain
type="primary"
@click="toDetail(scope.row)"
>详情</el-button
>
<el-button size="mini" plain type="warning">编辑</el-button>
</template>
</el-table-column>
</el-table>
</div>
</section>
<pagination
v-show="total > 0"
:total="total"
:page="form1.current"
:limit="form1.size"
@pagination="getPagination"
></pagination>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
components: { components: {},
},
data() { data() {
return { return {
drugnum:"(20)", //===========
activeName: "first", loading: false,
queryCondition:{ tableData: [],
fullTextSearch:"", // 全文检索 A1: "产品名称",
firmName:"", // 企业名称 A2: "备案编码",
approvalNumber:"", // 批准文号 A3: "生产企业",
taskName:"", // 产品名称 types: 1,
PrescriptionContent:"", // 处方内容 total: 0,
majorFunction:"", // 功能主治 options: [
startTime:"", // 开始日期 {
endTime:"", // 结束日期 value: 1,
checkList:[], label: "国产化妆品",
checkListTwo:[], },
}, {
tableData: [{ value: 2,
date: '1', label: "国产特殊化妆品",
name: '辽-xxxx', },
type:"药品", {
approvalNumber:"12421432143214321", value: 3,
firmName:"XXX有限公司", label: "进口化妆品",
}, { },
date: '2', {
name: '辽-aaaa', value: 4,
type:"医疗器械", label: "进口特殊化妆品",
approvalNumber:"12421432143214321", },
firmName:"XXX有限公司", ],
}, { form1: {
date: '3', a1: "",
name: '辽-zzzz', name: "",
type:"化妆品", size: 10,
approvalNumber:"12421432143214321", current: 1,
firmName:"XXX有限公司",
}, {
date: '4',
name: '辽-qqqq',
type:"药品",
approvalNumber:"12421432143214321",
firmName:"XXX有限公司",
}, {
date: '5',
name: '辽-xxxx',
type:"医疗器械",
approvalNumber:"12421432143214321",
firmName:"XXX有限公司",
}, {
date: '6',
name: '辽-aaaa',
type:"化妆品",
approvalNumber:"12421432143214321",
firmName:"XXX有限公司",
}, {
date: '7',
name: '辽-zzzz',
type:"药品",
approvalNumber:"12421432143214321",
firmName:"XXX有限公司",
}, {
date: '8',
name: '辽-qqqq',
type:"医疗器械",
approvalNumber:"12421432143214321",
firmName:"XXX有限公司",
}, {
date: '9',
name: '辽-xxxx',
type:"化妆品",
approvalNumber:"12421432143214321",
firmName:"XXX有限公司",
}, {
date: '10',
name: '辽-aaaa',
type:"药品",
approvalNumber:"12421432143214321",
firmName:"XXX有限公司",
}],
tabsTwoStyle:{
height:''
}, },
multipleSelection:[],
total:100,
currentPage:1,
pageSize:10,
}; };
}, },
mounted() { mounted() {},
document.getElementsByClassName( created() {
"el-pagination__jump" this.changeType(1);
)[0].childNodes[0].nodeValue = "跳至";
this.$nextTick(()=>{
let dom = document.getElementsByClassName('tabsTwo');
let height = dom[0].getBoundingClientRect();
// let windowWidth = window.innerWidth;
let windowHeight = window.innerHeight;
let relativeHeight = windowHeight - height.top
this.tabsTwoStyle.height = relativeHeight + 'px'
})
}, },
methods: { methods: {
handleSelectionChange(val){ //去内嵌页面
this.multipleSelection = val; toDetail(e) {
console.log(e);
}, },
currentChange(val){ //搜索
searchList() {
this.changeType(this.types);
}, },
sizeChange(val){ getPagination(e) {
console.log(e);
this.form1.current = e.page;
this.form1.size = e.limit;
this.chinaCosmetics();
}, },
// 详情 //重置
handleEdit(index,row){ reset() {
console.log(index) this.form1 = {
this.$router.push({name:'productInfo'}) name: "",
a1: "",
size: 10,
current: 1,
};
}, },
// 编辑 //国产化妆品
handleView(index,row){ async chinaCosmetics() {
this.loading = true;
let msg1 = await this.$api.cosmetics.domesticList(this.form1);
this.tableData = msg1.data.records;
this.total = msg1.data.total;
this.form1.size = msg1.data.size;
this.form1.current = msg1.data.current;
this.loading = false;
},
//国产特殊化妆品
async chinaSpecialCosmetics() {
this.loading = true;
let msg1 = await this.$api.cosmetics.specialList(this.form1);
this.tableData = msg1.data.records;
this.total = msg1.data.total;
this.form1.size = msg1.data.size;
this.form1.current = msg1.data.current;
this.loading = false;
},
//进口化妆品
async importCosmetics() {
this.loading = true;
let msg1 = await this.$api.cosmetics.importList(this.form1);
this.tableData = msg1.data.records;
this.total = msg1.data.total;
this.form1.size = msg1.data.size;
this.form1.current = msg1.data.current;
this.loading = false;
},
//进口特殊化妆品
async importSpecialCosmetics() {
this.loading = true;
let msg1 = await this.$api.cosmetics.importSpecialList(this.form1);
this.tableData = msg1.data.records;
this.total = msg1.data.total;
this.form1.size = msg1.data.size;
this.form1.current = msg1.data.current;
this.loading = false;
},
async changeType(e) {
this.reset()
if (e == 1) {
this.A2 = "备案编码";
this.A3 = "生产企业";
this.chinaCosmetics();
} else if (e == 2) {
this.A2 = "批准日期";
this.A3 = "省份";
this.chinaSpecialCosmetics();
} else if (e == 3) {
this.A2 = "备案编码";
this.A3 = "生产企业";
this.importCosmetics();
} else if (e == 4) {
this.A2 = "批准日期";
this.A3 = "省份";
this.importSpecialCosmetics();
}
}, },
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
::v-deep .el-select {
width: 100% !important;
}
.container { .container {
height: 100%; height: 100%;
box-sizing: border-box; // overflow: auto;
display: flex;
align-items: center;
background: #f2f2f2; background: #f2f2f2;
// padding: 10px;
& > div { .headerText {
flex: 1; width: 100%;
height: 100%; padding: 10px 20px;
border-bottom: 1px solid #f2f3f5;
color: #323233;
font-size: 20px;
font-weight: bold;
.searchP {
position: relative;
cursor: pointer;
&::before {
content: "";
width: 78px;
height: 3px;
background: #1349c5;
position: absolute;
bottom: -10px;
}
}
} }
& > div:nth-child(2) { .tabs {
flex: 2; width: 100%;
margin: 0 10px; height: 30%;
background: #fff;
} }
.middle { }
//===================
::v-deep .el-button--medium {
padding: 8px;
}
.footBox {
width: 100%;
text-align: center;
}
.tabsBottom {
height: 70%;
padding-top: 10px;
.foot-main {
height: 100%; height: 100%;
background: #ffff; // min-height: 600px;
border-radius: 8px; width: 100%;
overflow: hidden; background: white;
}
.left,
.right {
display: flex;
flex-direction: column;
align-items: center;
& > div {
width: 100%;
border-radius: 8px;
flex: 1;
background: #ffffff;
}
} }
.right-content { }
background-color: #fff; .exportBtn {
::v-deep .el-tabs__header{ padding: 10px 20px;
margin: 0; }
.el-tabs__nav-scroll { .table-box {
padding-left: 15px; padding: 0 20px;
padding-top: 3px; .table-item {
}
.el-tabs__item {
font-size: 18px;
font-family: Source Han Sans SC-Bold, Source Han Sans SC;
font-weight: bold;
color: #323233;
}
.el-tabs__active-bar {
background-color: #1349C5;
height: 2px;
border-radius: 0px 0px 0px 0px;
}
}
.tabs {
background: #F2F2F2 ;
box-shadow: 0px 0px 12px 0px rgba(194, 212, 226, 0.64);
border-radius: vw(10);
min-height: 88vh;
// padding-top: 3px;
// padding-left: 15px;
::v-deep .el-tabs {
background-color: #fff;
}
}
.screen {
padding: 15px 0 26px 28px;
display: flex;
flex-wrap: wrap;
align-items: center;
.task-name {
display: flex;
align-items: center;
margin-right: 30px;
.task-name-text {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #6a6c6f;
line-height: 50px;
// margin-right: vw(10);
}
.task-input {
width: 251px;
height: 32px;
::v-deep .el-input {
width: 251px;
height: 32px;
}
::v-deep .el-input__inner {
width: 100%;
height: 100%;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
// color: #B1B6BF;
line-height: 50px;
padding-left: 15px;
}
}
}
.checkbox-group-name {
width: 695px;
}
.btn{
width: 100%;
// padding-left: 600px;
text-align: center;
margin-top:15px;
}
.time-interval {
display: flex;
align-items: center;
margin-right: 20px;
.interval-text {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #6a6c6f;
// line-height: 50px;
// margin-right: vw(10);
}
.interval-select {
display: flex;
align-items: center;
border: 1px solid #dbe0e8;
border-radius: 4px;
height: 32px;
.star-time,
.end-time {
position: relative;
.data_icon {
position: absolute;
top: 50%;
right: 17px;
z-index: 9;
color: #c0c4cc;
font-size: 14px;
transform: translateY(-50%);
}
::v-deep .el-input__prefix {
display: none;
}
::v-deep .el-input {
width: 243px;
height: 30px;
}
::v-deep .el-input__inner {
width: 100%;
height: 100%;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
// color: #B1B6BF;
line-height: 30px;
padding-left: 15px;
border: none;
cursor: pointer;
}
}
.symbol {
background: rgba(219, 224, 232, 0.5);
width: 40px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #292f38;
line-height: 28px;
}
}
}
}
.tabsTwo {
margin: 10px 0;
overflow-y: scroll;
// padding: 10px 0;
padding-bottom: 20px;
background-color: #fff;
.daochu {
padding: 10px;
.btn {
display: flex;
justify-content: center;
width: 64px;
height: 32px;
background: #1E80EB;
border-radius: 4px 4px 4px 4px;
font-size: 14px;
font-family: MicrosoftYaHei-, MicrosoftYaHei;
font-weight: normal;
color: #FFFFFF;
line-height: 31px;
}
}
.mytable {
width: 99%;
margin: 0 auto;
::v-deep .column-text-one {
text-align: center;
}
::v-deep .el-table td {
height: 40px;
padding: 0;
}
::v-deep .el-table th {
height: 40px;
padding: 0;
font-size: 14px;
font-family: Source Han Sans SC-Medium, Source Han Sans SC;
font-weight: bold;
color: #292f38;
line-height: 36px;
}
.button {
display: flex;
align-items: center;
.xiangqing {
height: 23px;
padding: 3px;
border-radius: 4px;
line-height: 20px;
display: flex;
justify-content: center;
align-items: center;
margin-right: 5px;
background: #EBF5FF;
border: 1px solid #A1CBF8;
::v-deep span {
display: inline-block;
color: #0E7CF4;
}
}
.bianji {
height: 23px;
padding: 3px;
border-radius: 4px;
line-height: 20px;
display: flex;
justify-content: center;
align-items: center;
background: #FFEFE3;
border: 1px solid #FFC89F;
::v-deep span {
display: inline-block;
color: #F88129;
}
}
}
}
.pagination {
margin-top: 17px;
display: flex;
align-items: center;
justify-content: space-between;
// padding-bottom: vh(20);
::v-deep .el-pagination__jump {
margin: 0;
}
.custom {
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #292f38;
line-height: 18px;
}
}
}
.tabsTwo::-webkit-scrollbar {display:none}
} }
} }
</style> .pagination {
display: flex;
justify-content: space-between;
padding: 15px 20px;
}
</style>
Write Preview
Loading…
Cancel
Save