|
|
|
@ -1,549 +1,228 @@
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<div class="container">
|
|
|
|
<div class="container">
|
|
|
|
<div class="right-content">
|
|
|
|
<div class="tabs">
|
|
|
|
<div class="tabs">
|
|
|
|
<div class="headerText">
|
|
|
|
<el-tabs v-model="activeName" style="color: #edeef0">
|
|
|
|
<div class="searchP">查询条件</div>
|
|
|
|
<el-tab-pane label="查询条件" name="first">
|
|
|
|
</div>
|
|
|
|
<div class="screen">
|
|
|
|
<el-form ref="form1" :model="form1">
|
|
|
|
<div class="task-name">
|
|
|
|
<div style="margin-top: 10px">
|
|
|
|
<span class="task-name-text">产品名称：</span>
|
|
|
|
<el-row>
|
|
|
|
<div class="task-input">
|
|
|
|
<el-col :span="10">
|
|
|
|
<el-input
|
|
|
|
<el-form-item
|
|
|
|
v-model="queryCondition.fullTextSearch"
|
|
|
|
label="产品名称或者注册证编号或备案编号"
|
|
|
|
placeholder="请输入内容"
|
|
|
|
label-width="230px"
|
|
|
|
></el-input>
|
|
|
|
>
|
|
|
|
</div>
|
|
|
|
<el-input v-model="form1.name"></el-input>
|
|
|
|
</div>
|
|
|
|
</el-form-item>
|
|
|
|
<div class="task-name">
|
|
|
|
</el-col>
|
|
|
|
<span class="task-name-text">注册证号/备案号：</span>
|
|
|
|
<el-col :span="10">
|
|
|
|
<div class="task-input">
|
|
|
|
<el-form-item label="产品管理类别" label-width="130px">
|
|
|
|
<el-input
|
|
|
|
<el-select v-model="form1.cplb" placeholder="请选择产品类别">
|
|
|
|
v-model="queryCondition.firmName"
|
|
|
|
<el-option
|
|
|
|
placeholder="请输入内容"
|
|
|
|
v-for="item in options"
|
|
|
|
></el-input>
|
|
|
|
:key="item.value"
|
|
|
|
</div>
|
|
|
|
:label="item.label"
|
|
|
|
</div>
|
|
|
|
:value="item.label"
|
|
|
|
<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="btn">
|
|
|
|
|
|
|
|
<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>
|
|
|
|
</div>
|
|
|
|
</el-form-item>
|
|
|
|
</el-tab-pane>
|
|
|
|
</el-col>
|
|
|
|
</el-tabs>
|
|
|
|
</el-row>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</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>
|
|
|
|
|
|
|
|
<section class="table-box">
|
|
|
|
|
|
|
|
<div class="table-item">
|
|
|
|
|
|
|
|
<el-table
|
|
|
|
|
|
|
|
v-loading="loading"
|
|
|
|
|
|
|
|
:data="tableData"
|
|
|
|
|
|
|
|
border
|
|
|
|
|
|
|
|
height="300"
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<el-table-column type="selection" width="55" align="center" />
|
|
|
|
|
|
|
|
<el-table-column type="index" label="序号" width="55" />
|
|
|
|
|
|
|
|
<el-table-column label="产品名称" prop="cpmc"> </el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="产品类型" prop="cplx"></el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="产品管理类别" prop="cplb"></el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="注册证编号/备案编号" prop="zczh"> </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: "", // 全文检索
|
|
|
|
total: 0,
|
|
|
|
firmName: "", // 企业名称
|
|
|
|
options: [
|
|
|
|
approvalNumber: "", // 批准文号
|
|
|
|
|
|
|
|
taskName: "", // 产品名称
|
|
|
|
|
|
|
|
PrescriptionContent: "", // 处方内容
|
|
|
|
|
|
|
|
majorFunction: "", // 功能主治
|
|
|
|
|
|
|
|
startTime: "", // 开始日期
|
|
|
|
|
|
|
|
endTime: "", // 结束日期
|
|
|
|
|
|
|
|
checkList: [],
|
|
|
|
|
|
|
|
checkListTwo: [],
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
tableData: [
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
date: "1",
|
|
|
|
|
|
|
|
name: "辽-xxxx",
|
|
|
|
|
|
|
|
type: "药品",
|
|
|
|
|
|
|
|
approvalNumber: "12421432143214321",
|
|
|
|
|
|
|
|
firmName: "XXX有限公司",
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
date: "2",
|
|
|
|
|
|
|
|
name: "辽-aaaa",
|
|
|
|
|
|
|
|
type: "医疗器械",
|
|
|
|
|
|
|
|
approvalNumber: "12421432143214321",
|
|
|
|
|
|
|
|
firmName: "XXX有限公司",
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
{
|
|
|
|
date: "3",
|
|
|
|
value: 1,
|
|
|
|
name: "辽-zzzz",
|
|
|
|
label: "第一类",
|
|
|
|
type: "化妆品",
|
|
|
|
|
|
|
|
approvalNumber: "12421432143214321",
|
|
|
|
|
|
|
|
firmName: "XXX有限公司",
|
|
|
|
|
|
|
|
},
|
|
|
|
},
|
|
|
|
{
|
|
|
|
{
|
|
|
|
date: "4",
|
|
|
|
value: 2,
|
|
|
|
name: "辽-qqqq",
|
|
|
|
label: "第二类",
|
|
|
|
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: {
|
|
|
|
form1: {
|
|
|
|
height: "",
|
|
|
|
cplb: "",
|
|
|
|
|
|
|
|
name: "",
|
|
|
|
|
|
|
|
size: 10,
|
|
|
|
|
|
|
|
current: 1,
|
|
|
|
},
|
|
|
|
},
|
|
|
|
multipleSelection: [],
|
|
|
|
|
|
|
|
total: 100,
|
|
|
|
|
|
|
|
currentPage: 1,
|
|
|
|
|
|
|
|
pageSize: 10,
|
|
|
|
|
|
|
|
};
|
|
|
|
};
|
|
|
|
},
|
|
|
|
},
|
|
|
|
mounted() {
|
|
|
|
mounted() {},
|
|
|
|
document.getElementsByClassName(
|
|
|
|
created() {
|
|
|
|
"el-pagination__jump"
|
|
|
|
this.chinaCosmetics();
|
|
|
|
)[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) {},
|
|
|
|
//搜索
|
|
|
|
sizeChange(val) {},
|
|
|
|
searchList() {
|
|
|
|
// 详情
|
|
|
|
this.chinaCosmetics();
|
|
|
|
handleEdit(index, row) {
|
|
|
|
},
|
|
|
|
console.log(index);
|
|
|
|
getPagination(e) {
|
|
|
|
this.$router.push({ name: "productInfo" });
|
|
|
|
this.form1.current = e.page;
|
|
|
|
|
|
|
|
this.form1.size = e.limit;
|
|
|
|
|
|
|
|
this.chinaCosmetics();
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
//重置
|
|
|
|
|
|
|
|
reset() {
|
|
|
|
|
|
|
|
this.form1 = {
|
|
|
|
|
|
|
|
cplb: "",
|
|
|
|
|
|
|
|
name: "",
|
|
|
|
|
|
|
|
size: 10,
|
|
|
|
|
|
|
|
current: 1,
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
async chinaCosmetics() {
|
|
|
|
|
|
|
|
this.loading = true;
|
|
|
|
|
|
|
|
let msg1 = await this.$api.apparatus.apparatusList(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;
|
|
|
|
},
|
|
|
|
},
|
|
|
|
// 编辑
|
|
|
|
|
|
|
|
handleView(index, row) {},
|
|
|
|
|
|
|
|
},
|
|
|
|
},
|
|
|
|
};
|
|
|
|
};
|
|
|
|
</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: 25%;
|
|
|
|
|
|
|
|
background: #fff;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.middle {
|
|
|
|
}
|
|
|
|
|
|
|
|
//===================
|
|
|
|
|
|
|
|
::v-deep .el-button--medium {
|
|
|
|
|
|
|
|
padding: 8px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.footBox {
|
|
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.tabsBottom {
|
|
|
|
|
|
|
|
height: 75%;
|
|
|
|
|
|
|
|
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>
|
