|
|
|
|
@ -1,554 +1,316 @@
|
|
|
|
|
<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 class="headerText">
|
|
|
|
|
<div class="searchP">查询条件</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>
|
|
|
|
|
<el-form ref="form1" :model="form1" label-width="80px">
|
|
|
|
|
<div style="margin-top: 10px">
|
|
|
|
|
<el-row>
|
|
|
|
|
<el-col :span="7">
|
|
|
|
|
<el-form-item label="产品名称">
|
|
|
|
|
<el-input v-model="form1.name"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="7">
|
|
|
|
|
<el-form-item label="备案编码">
|
|
|
|
|
<el-input v-model="form1.name"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="7">
|
|
|
|
|
<el-form-item label="生产企业">
|
|
|
|
|
<el-input v-model="form1.a1"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row>
|
|
|
|
|
</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>
|
|
|
|
|
<el-row>
|
|
|
|
|
<el-col :span="7">
|
|
|
|
|
<el-form-item label="化妆品类型">
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="types"
|
|
|
|
|
placeholder="请选择化妆品类型"
|
|
|
|
|
@change="changeType"
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in options"
|
|
|
|
|
:key="item.value"
|
|
|
|
|
:label="item.label"
|
|
|
|
|
:value="item.value"
|
|
|
|
|
>
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select> </el-form-item
|
|
|
|
|
></el-col>
|
|
|
|
|
</el-row>
|
|
|
|
|
</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>
|
|
|
|
|
</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 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 class="mytable">
|
|
|
|
|
<section class="table-box">
|
|
|
|
|
<div class="table-item">
|
|
|
|
|
<el-table
|
|
|
|
|
ref="multipleTable"
|
|
|
|
|
v-loading="loading"
|
|
|
|
|
: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="产品名称"
|
|
|
|
|
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
|
|
|
|
|
prop="firmName"
|
|
|
|
|
label="备案编码"
|
|
|
|
|
show-overflow-tooltip>
|
|
|
|
|
<el-table-column :label="A2">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
{{ scope.row.bah || scope.row.pzrq }}
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column
|
|
|
|
|
prop="firmName"
|
|
|
|
|
label="生产企业"
|
|
|
|
|
show-overflow-tooltip>
|
|
|
|
|
<el-table-column :label="A3">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
{{ scope.row.qy || scope.row.sf }}
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
|
|
<el-table-column
|
|
|
|
|
prop="address"
|
|
|
|
|
label="操作"
|
|
|
|
|
width="180"
|
|
|
|
|
class-name="small-padding fixed-width"
|
|
|
|
|
width="140"
|
|
|
|
|
>
|
|
|
|
|
<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
|
|
|
|
|
@click="toDetail(scope.row)"
|
|
|
|
|
>详情</el-button
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
<el-button size="mini" plain type="warning">编辑</el-button>
|
|
|
|
|
</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>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-tab-pane>
|
|
|
|
|
</el-tabs>
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
|
|
|
|
<pagination
|
|
|
|
|
v-show="total > 0"
|
|
|
|
|
:total="total"
|
|
|
|
|
:page="form1.current"
|
|
|
|
|
:limit="form1.size"
|
|
|
|
|
@pagination="getPagination"
|
|
|
|
|
></pagination>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
export default {
|
|
|
|
|
components: {
|
|
|
|
|
},
|
|
|
|
|
components: {},
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
drugnum:"(20)",
|
|
|
|
|
activeName: "first",
|
|
|
|
|
queryCondition:{
|
|
|
|
|
fullTextSearch:"", // 全文检索
|
|
|
|
|
firmName:"", // 企业名称
|
|
|
|
|
approvalNumber:"", // 批准文号
|
|
|
|
|
taskName:"", // 产品名称
|
|
|
|
|
PrescriptionContent:"", // 处方内容
|
|
|
|
|
majorFunction:"", // 功能主治
|
|
|
|
|
startTime:"", // 开始日期
|
|
|
|
|
endTime:"", // 结束日期
|
|
|
|
|
checkList:[],
|
|
|
|
|
checkListTwo:[],
|
|
|
|
|
//===========
|
|
|
|
|
loading: false,
|
|
|
|
|
tableData: [],
|
|
|
|
|
A1: "产品名称",
|
|
|
|
|
A2: "备案编码",
|
|
|
|
|
A3: "生产企业",
|
|
|
|
|
types: 1,
|
|
|
|
|
total: 0,
|
|
|
|
|
options: [
|
|
|
|
|
{
|
|
|
|
|
value: 1,
|
|
|
|
|
label: "国产化妆品",
|
|
|
|
|
},
|
|
|
|
|
tableData: [{
|
|
|
|
|
date: '1',
|
|
|
|
|
name: '辽-xxxx',
|
|
|
|
|
type:"药品",
|
|
|
|
|
approvalNumber:"12421432143214321",
|
|
|
|
|
firmName:"XXX有限公司",
|
|
|
|
|
}, {
|
|
|
|
|
date: '2',
|
|
|
|
|
name: '辽-aaaa',
|
|
|
|
|
type:"医疗器械",
|
|
|
|
|
approvalNumber:"12421432143214321",
|
|
|
|
|
firmName:"XXX有限公司",
|
|
|
|
|
}, {
|
|
|
|
|
date: '3',
|
|
|
|
|
name: '辽-zzzz',
|
|
|
|
|
type:"化妆品",
|
|
|
|
|
approvalNumber:"12421432143214321",
|
|
|
|
|
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:''
|
|
|
|
|
{
|
|
|
|
|
value: 2,
|
|
|
|
|
label: "国产特殊化妆品",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: 3,
|
|
|
|
|
label: "进口化妆品",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: 4,
|
|
|
|
|
label: "进口特殊化妆品",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
form1: {
|
|
|
|
|
a1: "",
|
|
|
|
|
name: "",
|
|
|
|
|
size: 10,
|
|
|
|
|
current: 1,
|
|
|
|
|
},
|
|
|
|
|
multipleSelection:[],
|
|
|
|
|
total:100,
|
|
|
|
|
currentPage:1,
|
|
|
|
|
pageSize:10,
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
document.getElementsByClassName(
|
|
|
|
|
"el-pagination__jump"
|
|
|
|
|
)[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'
|
|
|
|
|
})
|
|
|
|
|
mounted() {},
|
|
|
|
|
created() {
|
|
|
|
|
this.changeType(1);
|
|
|
|
|
},
|
|
|
|
|
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();
|
|
|
|
|
},
|
|
|
|
|
//重置
|
|
|
|
|
reset() {
|
|
|
|
|
this.form1 = {
|
|
|
|
|
name: "",
|
|
|
|
|
a1: "",
|
|
|
|
|
size: 10,
|
|
|
|
|
current: 1,
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
// 详情
|
|
|
|
|
handleEdit(index,row){
|
|
|
|
|
console.log(index)
|
|
|
|
|
this.$router.push({name:'productInfo'})
|
|
|
|
|
//国产化妆品
|
|
|
|
|
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;
|
|
|
|
|
},
|
|
|
|
|
// 编辑
|
|
|
|
|
handleView(index,row){
|
|
|
|
|
|
|
|
|
|
//国产特殊化妆品
|
|
|
|
|
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>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
::v-deep .el-select {
|
|
|
|
|
width: 100% !important;
|
|
|
|
|
}
|
|
|
|
|
.container {
|
|
|
|
|
height: 100%;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// overflow: auto;
|
|
|
|
|
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 {
|
|
|
|
|
|
|
|
|
|
.headerText {
|
|
|
|
|
width: 100%;
|
|
|
|
|
border-radius: 8px;
|
|
|
|
|
flex: 1;
|
|
|
|
|
background: #ffffff;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.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;
|
|
|
|
|
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;
|
|
|
|
|
}
|
|
|
|
|
.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;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
height: 30%;
|
|
|
|
|
background: #fff;
|
|
|
|
|
}
|
|
|
|
|
.checkbox-group-name {
|
|
|
|
|
width: 695px;
|
|
|
|
|
}
|
|
|
|
|
.btn{
|
|
|
|
|
}
|
|
|
|
|
//===================
|
|
|
|
|
::v-deep .el-button--medium {
|
|
|
|
|
padding: 8px;
|
|
|
|
|
}
|
|
|
|
|
.footBox {
|
|
|
|
|
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%;
|
|
|
|
|
}
|
|
|
|
|
.tabsBottom {
|
|
|
|
|
height: 70%;
|
|
|
|
|
padding-top: 10px;
|
|
|
|
|
.foot-main {
|
|
|
|
|
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;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// min-height: 600px;
|
|
|
|
|
width: 100%;
|
|
|
|
|
background: white;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.exportBtn {
|
|
|
|
|
padding: 10px 20px;
|
|
|
|
|
}
|
|
|
|
|
.table-box {
|
|
|
|
|
padding: 0 20px;
|
|
|
|
|
.table-item {
|
|
|
|
|
}
|
|
|
|
|
.pagination {
|
|
|
|
|
margin-top: 17px;
|
|
|
|
|
}
|
|
|
|
|
.pagination {
|
|
|
|
|
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}
|
|
|
|
|
}
|
|
|
|
|
padding: 15px 20px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
