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

合并代码

Browse Source
Lvtianfang
吕天方 2 years ago
parent bdc269695b 8661a7e3de
commit 2319f8ff71
5 changed files with 642 additions and 689 deletions
Show Stats Download Patch File Download Diff File

82
src/permission.js
Unescape View File

@ -6,11 +6,11 @@ import "nprogress/nprogress.css";
import { getToken } from "@/utils/auth";
// 踢出系统
// function kickOut() {
// if (process.env.NODE_ENV === "production") {
// location.href = location.origin + "/login";
// }
// }
function kickOut() {
if (process.env.NODE_ENV === "production") {
location.href = location.origin + "/login";
}
}
NProgress.configure({ showSpinner: false });
const whiteList = [
"/login",
@ -21,10 +21,16 @@ const whiteList = [
"/personalData",
"/changePassword",
"/statistics",
"/administrative",
"/enterpriseMsg",
"/productsMsg",
"/logout",
];
router.beforeEach((to, from, next) => {
NProgress.start();
if (getToken()) {
console.log('有token');
to.meta.title && store.dispatch("settings/setTitle", to.meta.title);
/* has token*/
if (to.path === "/login") {
@ -36,39 +42,39 @@ router.beforeEach((to, from, next) => {
} else {
// 没有token
if (whiteList.indexOf(to.path) !== -1) {
// next();
let token = localStorage.getItem("MSSM-LIAONING__TOKEN");
if (token) {
if (store.state.myselfPermission.routerList.length > 0) {
let current = store.state.myselfPermission.routerList.filter(
(item) => item.path == to.path || from.path == "/"
);
if (current.length > 0) {
next();
} else {
Message.error("无权限访问！");
}
} else {
store
.dispatch("GetPermission")
.then((res) => {
if (res.length > 0) {
next({ path: res });
} else {
// kickOut();
}
})
.catch((error) => {
// kickOut();
});
}
} else {
// //没有token踢出去
// Message.error("获取令牌失败！");
// kickOut();
next();
}
next()
// let token = localStorage.getItem("MSSM-LIAONING__TOKEN");
// if (token) {
// if (store.state.myselfPermission.routerList.length > 0) {
// let current = store.state.myselfPermission.routerList.filter(
// (item) => item.path == to.path || from.path == "/"
// );
// if (current.length > 0) {
// next();
// } else {
// next();
// // Message.error("无权限访问！");
// }
// } else {
// store
// .dispatch("GetPermission")
// .then((res) => {
// console.log(res);
// if (res.length > 0) {
// next({ path: res });
// } else {
// kickOut();
// }
// })
// .catch((error) => {
// kickOut();
// });
// }
// } else {
// //没有token踢出去
// Message.error("获取令牌失败！");
// kickOut();
// }
} else {
// kickOut();
NProgress.done();

194
src/router/index.js
Unescape View File

@ -63,102 +63,116 @@ export const constantRoutes = [
},
{
path: "",
component: Layout,
redirect: "index",
// children: [
// {
// path: "index",
// component: () => import("@/views/index"),
// name: "Index",
// meta: { title: "检查员统计", icon: "netWork", affix: true },
// },
// ],
},
{
path: "/index",
path: '',
component: () => import("@/views/index"),
name: "Index",
meta: { title: "首页", icon: "netWork", affix: true },
redirect: "/administrative",
isDiy: true,
hidden: true,
redirect: "/netWorkStat",
children: [
{
path: "/netWorkStat",
name: "产品档案",
icon: require("@/assets/images/tree1.svg"),
component: () => import("@/views/netWorkStat/index"),
meta: { title: "产品档案", icon: "netWork", affix: true },
children:[
{
path: "/drugFile",
name: "药品档案",
icon: require("@/assets/images/tree2.svg"),
component: () => import("@/views/drugFile/index"),
meta: { title: "产品档案", icon: "netWork", affix: true },
}
]
path: "/administrative",
name: "行政审批",
icon: require("@/assets/images/tree4.svg"),
component: () => import("@/views/administrative/index"),
meta: { title: "行政审批", icon: "netWork" },
},
// {
// path: "/censor",
// name: "全局检查员信息",
// icon: require("@/assets/images/tree2.svg"),
// component: () => import("@/views/censor/index"),
// meta: { title: "全局检查员信息", icon: "netWork" },
// },
// {
// path: "/statistics",
// name: "培训情况统计",
// icon: require("@/assets/images/tree3.svg"),
// component: () => import("@/views/statistics/index"),
// meta: { title: "培训情况统计", icon: "netWork" },
// },
// {
// path: "/personalData",
// name: "检查员个人资料",
// icon: require("@/assets/images/tree3.svg"),
// component: () => import("@/views/personalData/index"),
// meta: { title: "检查员个人资料", icon: "netWork" },
// },
// {
// path: "/changePassword",
// name: "修改密码",
// icon: require("@/assets/images/tree4.svg"),
// component: () => import("@/views/changePassword/index"),
// meta: { title: "修改密码", icon: "netWork" },
// },
// {
// path: "/changePassword",
// name: "行政审批",
// icon: require("@/assets/images/tree4.svg"),
// component: () => import("@/views/changePassword/index"),
// meta: { title: "行政审批", icon: "netWork" },
// },
// {
// path: "/changePassword",
// name: "企业档案",
// icon: require("@/assets/images/tree4.svg"),
// component: () => import("@/views/changePassword/index"),
// meta: { title: "企业档案", icon: "netWork" },
// },
// {
// path: "/changePassword",
// name: "产品档案",
// icon: require("@/assets/images/tree4.svg"),
// component: () => import("@/views/changePassword/index"),
// meta: { title: "产品档案", icon: "netWork" },
// },
// {
// path: "/changePassword",
// name: "依法注销",
// icon: require("@/assets/images/tree4.svg"),
// component: () => import("@/views/changePassword/index"),
// meta: { title: "依法注销", icon: "netWork" },
// },
],
{
path: '/enterpriseMsg',
name: "企业档案",
icon: require("@/assets/images/tree4.svg"),
component: () => import("@/views/enterpriseMsg/index"),
meta: { title: "企业档案", icon: "netWork" },
},
{
path: "/logout",
name: "依法注销",
icon: require("@/assets/images/tree4.svg"),
component: () => import("@/views/logout/index"),
meta: { title: "依法注销", icon: "netWork" },
},
{
path: '/productsMsg',
name: "产品档案",
icon: require("@/assets/images/tree4.svg"),
component: () => import("@/views/productsMsg/index"),
meta: { title: "产品档案", icon: "netWork" },
}
]
},
// {
// path: '',
// component: () => import("@/views/index"),
// redirect: "/administrative",
// isDiy: true,
// children: [
// {
// path: "/administrative",
// name: "行政审批",
// icon: require("@/assets/images/tree4.svg"),
// component: () => import("@/views/administrative/index"),
// meta: { title: "行政审批", icon: "netWork" },
// },
// ]
// },
// {
// path: '/A',
// component: () => import("@/views/index"),
// redirect: "enterpriseMsg",
// isDiy: true,
// children: [
// {
// path: 'enterpriseMsg',
// name: "企业档案",
// icon: require("@/assets/images/tree4.svg"),
// component: () => import("@/views/enterpriseMsg/index"),
// meta: { title: "企业档案", icon: "netWork" },
// },
// ]
// },
// {
// path: '/B',
// component: () => import("@/views/index"),
// redirect: "logout",
// isDiy: true,
// children: [
// {
// path: "logout",
// name: "依法注销",
// icon: require("@/assets/images/tree4.svg"),
// component: () => import("@/views/logout/index"),
// meta: { title: "依法注销", icon: "netWork" },
// },
// ]
// },
// {
// path: '/productsMsg',
// component: () => import("@/views/index"),
// redirect: "drugArchives",
// isDiy: true,
// children: [
// {
// path: "drugArchives",
// name: "药品档案",
// icon: require("@/assets/images/tree4.svg"),
// component: () => import("@/views/productsMsg/components/drugArchives.vue"),
// meta: { title: "药品档案", icon: "netWork" },
// },
// {
// path: "cosmeticsArchives",
// name: "化妆品档案",
// icon: require("@/assets/images/tree4.svg"),
// component: () => import("@/views/productsMsg/components/cosmeticsArchives.vue"),
// meta: { title: "化妆品档案", icon: "netWork" },
// },
// {
// path: "health",
// name: "医疗器械档案",
// icon: require("@/assets/images/tree4.svg"),
// component: () => import("@/views/productsMsg/components/health.vue"),
// meta: { title: "医疗器械档案", icon: "netWork" },
// },
// ]
// },
//可以按着若依的思路来写,把菜单全部都设置成一级路由，然后有下拉选择框的去进行区别判断设置成二级子路由
];
// 动态路由，基于用户权限动态去加载

342
src/views/index.vue
Unescape View File

@ -2,8 +2,8 @@
<div class="container">
<myHeader></myHeader>
<div class="body-container">
<!-- <div class="tree-menu">
<router-link
<div class="tree-menu">
<!-- <router-link
tag="div"
:to="{ path: item.path }"
v-for="(item, index) in myRouter"
@ -11,58 +11,61 @@
active-class="routerActive"
>
<div class="view-child">
<img :src="item.icon" alt="" class="router-icon" />
<img :src="item.icon" alt="" class="router-icon" />
{{ item.name }}
</div>
</router-link>
</div> -->
<!-- 左边 -->
<div class="sidebar_content">
<div class="mycontent-left">
<el-menu
:default-active="routerIndex"
class="el-menu-vertical-demo"
@open="handleOpen"
@close="handleClose"
:router="true"
<div></div>
</router-link> -->
<el-menu
:default-active="routerIndex"
class="el-menu-vertical-demo"
:router="true"
background-color="#465970"
text-color="#fff"
>
<div
:index="item.path"
v-for="(item, index) in routerList"
:key="index"
>
<el-submenu
:index="indexOne - '0'"
v-for="(item, indexOne) in myRouter"
:key="indexOne - '0'"
>
<template slot="title">
<img :src="item.icon" alt="" class="title_img" />
<span>{{ item.name }}</span>
</template>
<el-menu-item-group>
<el-menu-item
:index="indexOne + '-' + index"
v-for="(itemb, index) in item.children"
:key="index"
:route="itemb.path"
>{{ itemb.name }}</el-menu-item
>
</el-menu-item-group>
</el-submenu>
</el-menu>
</div>
<!-- 右边 -->
<div class="mycontent-content">
<tags-view ref="tagsView" />
<div class="mycontent-content-title">
<!-- <i class="el-icon-location-outline title-icon" />
<span class="title-font">{{ routerTitle }}</span> -->
<div v-if="item.children && item.children.length > 0">
<el-submenu index="">
<template slot="title">
<img :src="item.icon" alt="" class="leftIcon" />
<span>{{ item.name }}</span>
</template>
<el-menu-item-group v-if="item.children">
<el-menu-item
:index="itemb.path + '66'"
v-for="(itemb, index) in item.children"
:key="index + '3'"
:route="itemb.path"
>{{ itemb.name }}</el-menu-item
>
</el-menu-item-group>
</el-submenu>
</div>
<div v-else>
<el-menu-item
:index="item.path + '2'"
:key="index"
:route="item.path"
>
<template slot="title">
<img :src="item.icon" alt="" class="leftIcon" />
<span>{{ item.name }}</span>
</template></el-menu-item
>
</div>
</div>
<router-view></router-view>
</div>
</el-menu>
</div>
<!-- <div class="view-box">
<div class="view-box">
<tags-view ref="tagsView" />
<div class="child-views">
<router-view />
</div>
</div> -->
</div>
</div>
</div>
</template>
@ -75,26 +78,81 @@ export default {
components: { myHeader, TagsView },
data() {
return {
routerIndex: "0-0",
routerIndex: "1-1",
routerList: [
{
path: "/administrative",
name: "行政审批",
icon: require("@/assets/images/tree4.svg"),
component: () => import("@/views/administrative/index"),
meta: { title: "行政审批", icon: "netWork" },
},
{
path: "/enterpriseMsg",
name: "企业档案",
icon: require("@/assets/images/tree4.svg"),
component: () => import("@/views/enterpriseMsg/index"),
meta: { title: "企业档案", icon: "netWork" },
},
{
path: "/productsMsg",
name: "产品档案",
icon: require("@/assets/images/tree4.svg"),
component: () => import("@/views/index"),
redirect: "drugArchives",
isDiy: true,
// children: [
// {
// path: "/productsMsg/drugArchives",
// name: "药品档案",
// icon: require("@/assets/images/tree4.svg"),
// component: () =>
// import("@/views/productsMsg/components/drugArchives.vue"),
// meta: { title: "药品档案", icon: "netWork" },
// },
// {
// path: "/productsMsg/cosmeticsArchives",
// name: "化妆品档案",
// icon: require("@/assets/images/tree4.svg"),
// component: () =>
// import("@/views/productsMsg/components/cosmeticsArchives.vue"),
// meta: { title: "化妆品档案", icon: "netWork" },
// },
// {
// path: "/productsMsg/health",
// name: "医疗器械档案",
// icon: require("@/assets/images/tree4.svg"),
// component: () =>
// import("@/views/productsMsg/components/health.vue"),
// meta: { title: "医疗器械档案", icon: "netWork" },
// },
// ],
},
{
path: "/logout",
name: "依法注销",
icon: require("@/assets/images/tree4.svg"),
component: () => import("@/views/logout/index"),
meta: { title: "依法注销", icon: "netWork" },
},
],
};
},
computed: {
//获取自定义路由
myRouter() {
console.log(this.$router.options.routes);
// let staticRouter = router.options.routes.filter(
// (item) => item.isDiy == true
// )[0].children;
// return staticRouter;
// return this.$store.state.myselfPermission.routerList;
console.log(this.$router.options.routes[6].children);
return this.$router.options.routes[6].children;
},
},
methods:{
handleOpen(key, keyPath) {
console.log(key, keyPath);
},
handleClose(key, keyPath) {
console.log(key, keyPath);
get1(e) {
console.log(e);
},
},
created() {},
@ -102,6 +160,28 @@ export default {
</script>
<style lang="scss" scoped>
::v-deep .el-submenu {
margin-right: -1px;
}
.leftIcon {
display: inline-block;
height: 14px;
width: 14px;
margin-right: 10px;
}
::v-deep .el-submenu__title {
padding: 0 8px !important;
}
::v-deep .el-menu-item {
padding: 0 8px !important;
margin-right: -1px;
}
::v-deep .el-menu-item-group .el-menu-item {
padding-left: 35px !important;
}
::v-deep .el-menu-item-group__title {
padding: 0 !important;
}
.container {
height: 100%;
.body-container {
@ -111,142 +191,42 @@ export default {
& > div {
height: 100%;
}
// .tree-menu {
// background: #465970;
// width: 220px;
// box-sizing: border-box;
// padding: 14px 10px;
// & > div {
// width: 200px;
// height: 40px;
// display: flex;
// align-items: center;
// font-size: 14px;
// font-weight: 400;
// color: #ffffff;
// padding: 0 10px;
// cursor: pointer;
// .router-icon {
// display: inline-block;
// height: 14px;
// width: 14px;
// margin-right: 10px;
// }
// }
// }
// .view-box {
// flex: 1;
// height: 100%;
// background: #f2f2f2;
// overflow: hidden;
// }
// .child-views {
// height: calc(100% - 40px);
// width: 100%;
// box-sizing: border-box;
// padding: 10px;
// }
// 左边侧边栏
.sidebar_content {
width: 100%;
height: 94.5%;
display: flex;
.mycontent-left {
width: 18%;
height: 100%;
background: #465970;
.el-menu-vertical-demo {
box-sizing: border-box;
.tree-menu {
background: #465970;
color: #ffffff;
overflow: hidden;
height: 100%;
.title_img {
width: vw(20);
margin-right: vw(10);
}
::v-deep .el-submenu__title {
font-size: vw(16);
font-family: Source Han Sans CN;
font-weight: 500;
color: #ffffff;
height: vh(80);
line-height: vh(80);
&:hover {
background: none;
}
}
::v-deep .el-menu-item-group__title {
padding: 0;
}
::v-deep .el-submenu .el-menu-item {
margin: vh(5) 0;
height: vh(60);
line-height: vh(60);
min-width: 100%;
font-size: vw(16);
font-family: Source Han Regular CN;
width: 220px;
box-sizing: border-box;
padding: 14px 10px;
& > div {
width: 200px;
height: 40px;
display: flex;
align-items: center;
font-size: 14px;
font-weight: 400;
color: #b6cbe4;
box-sizing: border-box;
&:hover {
background: #1e80eb;
border-radius: vw(5);
color: #ffffff;
}
}
::v-deep .el-menu-item.is-active {
box-sizing: border-box;
font-size: vw(16);
font-family: Source Han Sans CN;
font-weight: 500;
color: #ffffff;
background: #1e80eb;
border-radius: vw(5);
}
::v-deep .el-submenu__icon-arrow {
box-sizing: border-box;
font-size: vw(16);
font-family: Source Han Sans CN;
font-weight: 500;
color: #ffffff;
}
::v-deep .el-menu {
padding: 0 vw(20);
box-sizing: border-box;
background: #465970;
padding: 0 10px;
cursor: pointer;
.router-icon {
display: inline-block;
height: 14px;
width: 14px;
margin-right: 10px;
}
}
}
}
// 右侧内容
.mycontent-content {
width: 100%;
.view-box {
flex: 1;
height: 100%;
padding: vw(0) vw(18) vh(18);
background: #f2f2f2;
.mycontent-content-title {
display: flex;
align-items: center;
margin: vh(13) vw(7);
.title-icon,
.title-font {
font-size: vw(14);
font-family: Source Han Sans CN;
font-weight: 500;
color: #292f38;
}
.title-icon {
margin: 0 vw(5) 0 0;
font-size: vw(18);
color: #1e80eb;
}
}
overflow: hidden;
}
.child-views {
height: calc(100% - 40px);
width: 100%;
box-sizing: border-box;
padding: 10px;
}
}
}
.routerActive {
background: #1e80eb;

376
src/views/netWorkStat/index.vue
Unescape View File

@ -1,376 +0,0 @@
<template>
<div class="container">
<div class="right-content">
<div class="tabs">
<el-tabs
v-model="activeName"
style="color: #edeef0"
>
<el-tab-pane label="查询条件" name="first">
<div class="screen">
<div class="task-name">
<span class="task-name-text">全文检索：</span>
<div class="task-input">
<el-input
v-model="queryCondition.fullTextSearch"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="task-name">
<span class="task-name-text">企业名称：</span>
<div class="task-input">
<el-input
v-model="queryCondition.firmName"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="task-name">
<span class="task-name-text">批准文号：</span>
<div class="task-input">
<el-input
v-model="queryCondition.approvalNumber"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="task-name">
<span class="task-name-text">处方内容：</span>
<div class="task-input">
<el-input
v-model="queryCondition.PrescriptionContent"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="task-name">
<span class="task-name-text">功能主治：</span>
<div class="task-input">
<el-input
v-model="queryCondition.majorFunction"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="task-name">
<span class="task-name-text">产品名称：</span>
<div class="task-input">
<el-input
v-model="queryCondition.taskName"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="time-interval">
<div class="interval-text">
批号有效期：
</div>
<div class="interval-select">
<div class="star-time">
<el-date-picker
v-model="queryCondition.startTime"
type="datetime"
align="right"
:clearable="false"
format="yyyy-MM-dd HH:mm:ss"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择开始时间"
>
</el-date-picker>
<!-- <i class="el-icon-date data_icon"></i> -->
</div>
<!-- <i class="el-icon-sort-up"></i> -->
<div class="symbol">~</div>
<div class="end-time">
<el-date-picker
v-model="queryCondition.endTime"
type="datetime"
align="right"
:clearable="false"
format="yyyy-MM-dd HH:mm:ss"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择结束时间"
>
</el-date-picker>
<i class="el-icon-date data_icon"></i>
</div>
</div>
</div>
<div class="task-name checkbox-group-name">
<span class="task-name-text">产品标签：</span>
<div class="task-checkbox">
<el-checkbox-group v-model="queryCondition.checkList">
<el-checkbox label="全部"></el-checkbox>
<el-checkbox label="百年产品"></el-checkbox>
<el-checkbox label="疗效显著"></el-checkbox>
<el-checkbox label="无刺激"></el-checkbox>
</el-checkbox-group>
</div>
</div>
<div class="task-name">
<span class="task-name-text">产品筛选：</span>
<div class="task-checkbox">
<el-checkbox-group v-model="queryCondition.checkListTwo">
<el-checkbox label="全部"></el-checkbox>
<el-checkbox :label="'药品' + drugnum"></el-checkbox>
<el-checkbox label="医疗器械"></el-checkbox>
<el-checkbox label="化妆品"></el-checkbox>
</el-checkbox-group>
</div>
</div>
</div>
<div class="btns">
<button class="inquire" @click="inquire(1)">查询</button>
<button class="reset" @click="reset">重置</button>
</div>
</el-tab-pane>
</el-tabs>
</div>
</div>
</div>
</template>
<script>
export default {
components: {
},
data() {
return {
drugnum:" (20)",
activeName: "first",
queryCondition:{
fullTextSearch:"", // 全文检索
firmName:"", // 企业名称
approvalNumber:"", // 批准文号
taskName:"", // 产品名称
PrescriptionContent:"", // 处方内容
majorFunction:"", // 功能主治
startTime:"", // 开始日期
endTime:"", // 结束日期
checkList:[],
checkListTwo:[],
},
};
},
mounted() {},
methods: {},
};
</script>
<style lang="scss" scoped>
.container {
height: 100%;
box-sizing: border-box;
display: flex;
align-items: center;
background: #f2f2f2;
padding: 10px;
& > div {
flex: 1;
height: 100%;
}
& > div:nth-child(2) {
flex: 2;
margin: 0 10px;
}
.middle {
height: 100%;
background: #ffff;
border-radius: 8px;
overflow: hidden;
}
.left,
.right {
display: flex;
flex-direction: column;
align-items: center;
& > div {
width: 100%;
border-radius: 8px;
flex: 1;
background: #ffffff;
}
}
.middle-box {
margin: 10px;
}
.main {
height: calc(100% - 40px);
}
.right-content {
background-color: #fff;
::v-deep .el-tabs__header{
margin: 0;
.el-tabs__nav-scroll {
padding-left: 15px;
padding-top: 3px;
}
.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: rgba(255, 255, 255, 0.9);
box-shadow: 0px 0px 12px 0px rgba(194, 212, 226, 0.64);
border-radius: vw(10);
min-height: 90vh;
// padding-top: 3px;
// padding-left: 15px;
}
.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;
}
.btns {
display: flex;
align-items: center;
.inquire {
display: flex;
justify-content: center;
align-items: center;
border: none;
width: vw(64);
height: vh(40);
background: #1e80eb;
border-radius: vw(4);
font-size: vw(16);
font-family: Source Han Sans CN;
font-weight: 400;
color: #ffffff;
line-height: vh(50);
margin-right: vw(10);
cursor: pointer;
}
.reset {
display: flex;
justify-content: center;
align-items: center;
width: vw(64);
height: vh(40);
border: vw(1) solid #1e80eb;
border-radius: vw(4);
background-color: #fff;
font-size: vw(16);
font-family: Source Han Sans CN;
font-weight: 400;
color: #1e80eb;
line-height: vh(50);
cursor: pointer;
}
}
.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;
}
}
}
}
}
}
</style>

333
src/views/productsMsg/index.vue
Unescape View File

@ -1,3 +1,332 @@
<template>
<div> 3333</div>
</template>
<div class="container">
<div class="right-content">
<div class="tabs">
<el-tabs
v-model="activeName"
style="color: #edeef0"
>
<el-tab-pane label="查询条件" name="first">
<div class="screen">
<div class="task-name">
<span class="task-name-text">全文检索：</span>
<div class="task-input">
<el-input
v-model="queryCondition.fullTextSearch"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="task-name">
<span class="task-name-text">企业名称：</span>
<div class="task-input">
<el-input
v-model="queryCondition.firmName"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="task-name">
<span class="task-name-text">批准文号：</span>
<div class="task-input">
<el-input
v-model="queryCondition.approvalNumber"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="task-name">
<span class="task-name-text">处方内容：</span>
<div class="task-input">
<el-input
v-model="queryCondition.PrescriptionContent"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="task-name">
<span class="task-name-text">功能主治：</span>
<div class="task-input">
<el-input
v-model="queryCondition.majorFunction"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="task-name">
<span class="task-name-text">产品名称：</span>
<div class="task-input">
<el-input
v-model="queryCondition.taskName"
placeholder="请输入内容"
></el-input>
</div>
</div>
<div class="time-interval">
<div class="interval-text">
批号有效期：
</div>
<div class="interval-select">
<div class="star-time">
<el-date-picker
v-model="queryCondition.startTime"
type="datetime"
align="right"
:clearable="false"
format="yyyy-MM-dd HH:mm:ss"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择开始时间"
>
</el-date-picker>
<!-- <i class="el-icon-date data_icon"></i> -->
</div>
<!-- <i class="el-icon-sort-up"></i> -->
<div class="symbol">~</div>
<div class="end-time">
<el-date-picker
v-model="queryCondition.endTime"
type="datetime"
align="right"
:clearable="false"
format="yyyy-MM-dd HH:mm:ss"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择结束时间"
>
</el-date-picker>
<i class="el-icon-date data_icon"></i>
</div>
</div>
</div>
<div class="task-name">
<span class="task-name-text">产品标签：</span>
<div class="task-checkbox">
<el-checkbox-group v-model="queryCondition.checkList">
<el-checkbox label="全部"></el-checkbox>
<el-checkbox label="百年产品"></el-checkbox>
<el-checkbox label="疗效显著"></el-checkbox>
<el-checkbox label="无刺激"></el-checkbox>
</el-checkbox-group>
</div>
</div>
<div class="task-name">
<span class="task-name-text">产品筛选：</span>
<div class="task-checkbox">
<el-checkbox-group v-model="queryCondition.checkListTwo">
<el-checkbox label="全部"></el-checkbox>
<el-checkbox :label="'药品' + drugnum"></el-checkbox>
<el-checkbox label="医疗器械"></el-checkbox>
<el-checkbox label="化妆品"></el-checkbox>
</el-checkbox-group>
</div>
</div>
</div>
</el-tab-pane>
</el-tabs>
</div>
</div>
</div>
</template>
<script>
export default {
components: {
},
data() {
return {
drugnum:"(20)",
activeName: "first",
queryCondition:{
fullTextSearch:"", // 全文检索
firmName:"", // 企业名称
approvalNumber:"", // 批准文号
taskName:"", // 产品名称
PrescriptionContent:"", // 处方内容
majorFunction:"", // 功能主治
startTime:"", // 开始日期
endTime:"", // 结束日期
checkList:[],
checkListTwo:[],
},
};
},
mounted() {},
methods: {},
};
</script>
<style lang="scss" scoped>
.container {
height: 100%;
box-sizing: border-box;
display: flex;
align-items: center;
background: #f2f2f2;
padding: 10px;
& > div {
flex: 1;
height: 100%;
}
& > div:nth-child(2) {
flex: 2;
margin: 0 10px;
}
.middle {
height: 100%;
background: #ffff;
border-radius: 8px;
overflow: hidden;
}
.left,
.right {
display: flex;
flex-direction: column;
align-items: center;
& > div {
width: 100%;
border-radius: 8px;
flex: 1;
background: #ffffff;
}
}
.middle-box {
margin: 10px;
}
.main {
height: calc(100% - 40px);
}
.right-content {
background-color: #fff;
::v-deep .el-tabs__header{
margin: 0;
.el-tabs__nav-scroll {
padding-left: 15px;
padding-top: 3px;
}
.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: rgba(255, 255, 255, 0.9);
box-shadow: 0px 0px 12px 0px rgba(194, 212, 226, 0.64);
border-radius: vw(10);
min-height: 90vh;
// padding-top: 3px;
// padding-left: 15px;
}
.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;
}
}
}
.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;
}
}
}
}
}
}
</style>
Write Preview
Loading…
Cancel
Save