Commit dd41f436 authored by 余苗苗's avatar 余苗苗

根据UI修改页面

parent 34ed3557
......@@ -17,6 +17,9 @@
line-height: 64px;
border-bottom: 1px solid #ececec;
}
.cooperate-menu{
border:none;
}
.cooperate-menu .el-menu-item.is-active{
background-color: #eef1fa !important;
position: relative;
......@@ -43,27 +46,37 @@
.cooperate-right .el-table .el-table td, .cooperate-right .el-table .el-table th{
padding: 5px 0;
}
.cooperate-right .all-cooperate-serch{
.cooperate .all-cooperate-serch{
background: #ffffff;
padding: 10px;
padding:12px 10px;
height: 30px;
position: relative;
}
.all-cooperate-serch:after{
position: absolute;
content: '';
left: 20px;
right: 20px;
bottom: 0;
height:1px;
background: #ececec;
}
.cooperate-right .all-cooperate-serch .seach-select .el-input__inner,.cooperate-right .all-cooperate-serch .seach-select .el-input{
.cooperate .all-cooperate-serch .seach-select{
margin-right: 8px;
}
.cooperate .all-cooperate-serch .seach-select .el-input__inner,.cooperate .all-cooperate-serch .seach-select .el-input{
width: 120px !important;
background: #F1F3F9;
border: none;
height: 30px;
}
.cooperate-right .all-cooperate-serch .seach-input .el-input__inner,.cooperate-right .all-cooperate-serch .seach-input {
.cooperate .all-cooperate-serch .seach-input {
margin-right: 8px;
}
.cooperate .all-cooperate-serch .seach-input .el-input__inner,.cooperate .all-cooperate-serch .seach-input {
width: 298px;
height: 30px;
}
.all-cooperate-serch:after {
position: absolute;
content: '';
left: 20px;
right: 20px;
bottom: 0;
height: 1px;
background: #ececec;
}
.button-color{
background: #5874D8;
......@@ -89,18 +102,67 @@
overflow: auto;
padding: 15px;
}
.cooperate-right .cooperate-content table{
text-align: center;
width: 100%;
}
.cooperate-right .cooperate-content .table-header{
background: #eef1fa;
height: 38px;
line-height: 38px;
}
.cooperate-right .cooperate-content .table-body td:nth-child(1),.cooperate-right .cooperate-content .table-header th:nth-child(1){
width: 20%;
}
.cooperate-right .cooperate-content .table-body td:nth-child(2),.cooperate-right .cooperate-content .table-header th:nth-child(2){
width: 20%;
}
.cooperate-right .cooperate-content .table-body td:nth-child(3),.cooperate-right .cooperate-content .table-header th:nth-child(3){
width: 20%;
}
.cooperate-right .cooperate-content .table-body td:nth-child(4),.cooperate-right .cooperate-content .table-header th:nth-child(4){
width: 20%;
}
.cooperate-right .cooperate-content .table-body td:nth-child(5),.cooperate-right .cooperate-content .table-header th:nth-child(5){
width: 20%;
}
.cooperate-right .cooperate-content .table-cell{
border: 1px solid #E2E2E2;
margin: 5px 0;
border-radius: 5px;
height: 74px;
font-size: 12px;
}
.cooperate-right .cooperate-content .table-cell:nth-of-type(odd){
background: #f5f5f5;
}
.cooperate-right .cooperate-content .table-cell .detail{
font-size: 12px;
color: #999;
}
.cooperate-right .cooperate-content table th{
background: #EEF1FC;
background: #eef1fa;
color: #666;
text-align: center;
}
.cooperate-right .cooperate-content table td{
.cooperate-right .cooperate-content table td .cell{
/*font-size: 12px;*/
text-align: center;
}
.cooperate-right .cooperate-content table td .cell .detail{
font-size: 12px;
color: #999;
}
.cooperate-right .cooperate-content table td .cell .blue-text{
color: #5B76D1;
}
/********************详情start*******************/
.cooperate-detail{
width: 720px;
height: 630px;
float: right;
}
.dialog-content{
position: relative;
......@@ -121,11 +183,6 @@
.el-dialog__wrapper{
overflow: hidden !important;
}
.cooperate-detail h2{
padding-left: 15px;
position: relative;
margin-left: 20px;
}
.cooperate-detail h2:before{
position: absolute;
content: '';
......@@ -135,9 +192,6 @@
height: 20px;
background: #50B5FC;
}
.cooperate-detail .el-tabs--card>.el-tabs__header{
padding: 0 20px;
}
.cooperate-detail .el-dialog__body{
padding:30px 0;
}
......@@ -148,6 +202,48 @@
color: #ffffff;
font-size: 16px;
}
.cooperate-detail .el-tabs__header{
border:none;
}
.cooperate-detail .el-dialog__body{
padding: 0;
}
.cooperate-detail .el-dialog__header{
background: #eef1fa;
}
.cooperate-detail .el-dialog__header .el-dialog__title{
color: #5874d8;
font-size: 18px;
}
.cooperate-detail .el-dialog__header .el-dialog__headerbtn i{
color:#8F97A4;
font-size: 24px;
}
.operate-detail h2{
padding-left: 30px;
}
.cooperate-detail .el-tabs--card>.el-tabs__header{
padding: 0 20px;
background: #eef1fa;
}
.cooperate-detail .el-tabs--card>.el-tabs__header .el-tabs__item{
background: #f5f5f5;
margin-bottom: -1px;
margin-right: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border: 1px solid #BFCAEB;
}
.cooperate-detail .el-tabs--card>.el-tabs__header .el-tabs__item.is-active{
background: #ffffff;
border: 1px solid #5874d8;
border-bottom: #ffffff;
color: #5874d8;
}
.cooperate-detail .el-tabs--card>.el-tabs__header .el-tabs__nav{
border:none;
}
.cooperate-detail .cooperate-detail-tab{
margin-top: 5px;
line-height: 2.5;
......@@ -212,16 +308,62 @@
}
/*******************************范围start******************************/
.cooperate-detail-tab .tag{
background: #F1F3F8;
padding: 5px 14px;
background: #eef1fa;
padding: 5px 10px;
border-radius: 5px;
margin-right: 10px;
color: #8F97A4 !important;
border: 1px solid #5874D8;
display: inline-block;
height: 25px;
line-height: 25px;
margin-top: 5px;
}
.cooperate-detail-tab .tag i{
color: #5874D8;
font-size: 14px;
}
.cooperate-detail-tab .tag-range{
background: #F7F9FF;
padding: 0px 14px;
border-radius: 3px;
margin-right: 20px;
color:#999999 !important;
color: #8F97A4 !important;
float: left;
height: 30px;
line-height: 30px;
margin-bottom: 10px;
}
.cooperate-detail-tab .tag i{
color: #3B4B84;
.cooperate-detail-tab .tag-range i{
color: #5874D8;
font-size: 14px;
}
.cooperate-detail .cooperate-detail-tab{
margin-top: 5px;
line-height: 2;
border-bottom: 1px solid #ececec;
padding-bottom: 10px;
margin-bottom: 10px;
padding-left: 20px;
}
.cooperate-detail .cooperate-detail-tab p{
color: #999;
font-size: 12px;
}
.cooperate-detail .cooperate-detail-tab span{
color: #333;
font-size: 12px;
}
.cooperate-detail h2{
padding-left: 15px;
line-height: 1.5;
margin-left: 20px;
}
.cooperate-detail .add-operate h2{
padding-left: 15px;
line-height: 1.5;
margin-left: 0
}
/*******************************授权start******************************/
.el-tabs .wechat{
width: 180px;
......@@ -236,12 +378,9 @@
font-size: 12px;
color: #999;
}
.add-operate{
height: 700px !important;
}
.add-operate form{
/*width: 500px;*/
height: 560px;
height: 523px;
overflow: auto;
}
.add-operate .el-input__inner,.add-operate .seach-input {
......@@ -250,12 +389,48 @@
/*margin-right: 20px;*/
}
.add-operate textarea{
width: 420px;
width: 220px;
height: 28px;
}
.add-operate form .el-form-item {
/*.add-operate form .el-form-item {
margin-bottom: 12px;
}
}*/
.addoperate-icon {
margin-left: 3px;
}
.add-operate .save {
text-align: center;
margin-top: 20px;
}
.add-operate .save button{
background: #5774D8;
color: #ffffff;
width: 180px;
}
.add-operate .save button span{
color: #ffffff !important;
}
.add-operate form .el-input__inner,.add-operate form .el-input{
height: 28px;
font-size: 12px;
}
.el-dialog .el-form-item{
margin-bottom: 15px !important;
}
.add-operate form .el-form-item__error{
padding-top: 0;
}
.add-operate form .pre_space .el-form-item__error{
padding-top: 0;
left: -34px;
top: 28px;
}
.add-operate form .el-input__icon{
line-height: 28px;
}
.add-operate form .el-radio__input{
display: none;
}
.add-operate form .el-radio{
margin-right: 0;
}
......@@ -24,38 +24,51 @@
</div>
<div class="cooperate-right">
<div class="all-cooperate-serch">
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类">
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类" size="mini">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options2'></el-option>
</el-select>
<el-select class="seach-select" v-model="search.area" @change='' placeholder="选择区域">
<el-select class="seach-select" v-model="search.area" @change='' placeholder="选择区域" size="mini">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options1'></el-option>
</el-select>
<el-input class="seach-input" v-model='search.name' prefix-icon="el-icon-search" placeholder='输入名称、联系人或区域'></el-input>
<el-button type='primary' class='firstbackgroud_blue'>搜索</el-button>
<el-button type='primary' class='firstbackgroud_blue addbutton' @click="addOperate()">新增授权点</el-button>
<el-input class="seach-input" v-model='search.name' prefix-icon="el-icon-search" placeholder='输入名称、联系人或区域' size="mini"></el-input>
<el-button type='primary' class='firstbackgroud_blue' size="mini">搜索</el-button>
<el-button type='primary' class='firstbackgroud_blue addbutton' @click="addOperate()" size="mini">新增授权点</el-button>
</div>
<div class="cooperate-content">
<el-table :data="tableData" style="width: 100%" @row-click='checkData'>
<el-table-column prop="date" label="授权点" ></el-table-column>
<el-table-column label="负责人" >
<template slot-scope="scope" >
<table class="table-header">
<tr >
<th>授权点</th>
<th>负责人</th>
<th>合作区域</th>
<th>合作品类</th>
<th>合作状态</th>
</tr>
</table>
<table class="table-body table-cell" v-for="(item,index) in tableData" :key='index'>
<tr >
<td>{{item.date}}</td>
<td>
<span class='cursor firsttext_blue' >
{{scope.row.name }}
{{item.name }}
</span>
<span clas="thirdtext_font">{{scope.row.phone}}</span>
</template>
</el-table-column>
<el-table-column prop="address" label="合作区域"> </el-table-column>
<el-table-column prop="type" label="合作品类"> </el-table-column>
<el-table-column label="合作状态" width='80px'>
<template slot-scope="scope" >
<span clas="thirdtext_font">{{item.phone}}</span>
</td>
<td>
<span>{{item.address }}</span>
</td>
<td>
<span>{{item.type }}</span>
</td>
<td @click='checkData(item)' class="cursor">
<div class='text_center'>
<i class='iconfont iconzhengchang' v-if='scope.row.status==1' style='color:#6FC152;font-size:22px;'></i>
<i class='iconfont iconzhengchang' v-if='item.status==1' style='color:#6FC152;font-size:22px;'></i>
<i class='iconfont icontingyong' v-else style='color:#F05050;font-size:22px'></i>
</div>
</template>
</el-table-column>
</el-table>
</td>
</tr>
</table>
</div>
<div class="cooperate-bottom">
<el-pagination @current-change="handleCurrentChange" background :current-page="table.current_page" :page-sizes="[10, 20, 30, 40]" :page-size="10" layout="sizes, prev, pager, next,total" :page-size="15" :pager-count="table.page_count" :total="table.total">
......@@ -82,7 +95,7 @@
data: function() {
return {
activeIndex:'3',tabindex:'3',modal:null,
active_header:'./../cooperate/index.html',modalData:[],
active_header:'./../cooperate/index.html',modalData:{},
menus:[
{name:'正常',value:'1',icon:'iconzhengchang'},
{name:'停用',value:'2',icon:'icontingyong'},
......
This diff is collapsed.
var vDetail={
template: `
<el-dialog :title="dialog.title" :visible.sync="dialog.show" custom-class='cooperate-detail animated slideInRight' @close="handleClose" :append-to-body="true" :show-close='true'>
<el-dialog :visible.sync="dialog.show" custom-class='cooperate-detail animated slideInRight' @close="handleClose" :append-to-body="true" :show-close='true'>
<div slot='title' class="el-dialog__title">
<i class="iconfont iconhezuo"></i>
{{dialog.title}}
</div>
<div class="dialog-content">
<div class="edict-icon">
<div class="edict-icon" v-if="dialog.tab==3">
<i class="el-icon-edit-outline"></i>
<i class="el-icon-delete"></i>
</div>
<el-tabs v-model="dialog.tab" type="card" @tab-click="handleClick">
<el-tab-pane label="详情" name="1" >
<h2>基本信息</h2>
<h2 class="line-left">基本信息</h2>
<div class='cooperate-detail-tab'>
<p>名 称: <span> 精诚维修</span></p>
<p>负 责 人:<span>张三(13800001111)</span></p>
<p>状 态:<span>正常(已开通接口 )</span></p>
<p>地 址:<span>深圳市精诚家电维修有限公司</span> </p>
</div>
<h2>结算信息</h2>
<h2 class="line-left">结算信息</h2>
<div class='cooperate-detail-tab'>
<p>周期: <span> 日结</span></p>
<p>结算方式:<span>银行卡(13800001111)</span></p>
<p>收款信息:<span>张三 中国建设银行宝安支行 6222212132881212</span></p>
</div>
<h2>认证信息</h2>
<h2 class="line-left">认证信息</h2>
<div class='cooperate-detail-tab' style="border:none">
<p>认证方式: <span>企业认证</span></p>
<p>认证信息:<span>深圳市精诚家电维修有限公司 0102198902010215</span></p>
......@@ -31,25 +35,29 @@ var vDetail={
</div>
</el-tab-pane>
<el-tab-pane label="范围" name="2">
<h2>服务区域</h2>
<h2 class="line-left">服务区域</h2>
<div class='cooperate-detail-tab' style="padding:20px;line-height:3">
<span class='tag' v-for='(item,index) in 9' :key='index'>
<i class='el-icon-location'></i>广东-深圳
</span>
<div style="height: 190px;overflow-y: auto;">
<div class='tag-range' v-for='(item,index) in 9' :key='index'>
<i class='el-icon-location'></i>广东-深圳
</div>
</div>
</div>
<h2>服务品类</h2>
<h2 class="line-left">服务品类</h2>
<div class='cooperate-detail-tab' style="padding:20px;line-height:3;border:none">
<span class='tag' v-for='(item,index) in 2' :key='index'>
空调
</span>
<div style="height: 190px;overflow-y: auto;">
<div class='tag-range' v-for='(item,index) in 2' :key='index'>
空调
</div>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="授权码" name="3">
<h2>授权信息</h2>
<h2 class="line-left">授权信息</h2>
<div class='cooperate-detail-tab' style="border:none">
<p>授权ID:<span>31E8792IWE73</span></p>
<p>授权密钥:<span>31E8792IWE7331E8792IWE7331E8792IWE73</span></p>
<p>接单方式一:<span>API对接</span></p>
<p>接单方式一:<span style="color: #5874D8;text-decoration: underline">API对接</span></p>
<p>接单方式二:<span>小程序</span></p>
</div>
<div class="wechat"></div>
......
......@@ -27,21 +27,23 @@
<div class="order-right">
<div class="all-order">
<div class="all-order-serch">
<el-select class="seach-select" v-model="search.time" @change='' placeholder="创建时间">
<el-select class="seach-select" v-model="search.time" @change='' placeholder="创建时间" size="mini">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options1'></el-option>
</el-select>
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类">
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类" size="mini">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options2'></el-option>
</el-select>
<el-input class="seach-input" v-model='search.name' prefix-icon="el-icon-search" placeholder='请输入项目名、合作商名查询'></el-input>
<el-button type='primary' class='firstbackgroud_blue firstborder_blue'>搜索</el-button>
<el-input class="seach-input" v-model='search.name' prefix-icon="el-icon-search" placeholder='请输入项目名、合作商名查询' size="mini"></el-input>
<el-button type='primary' class='firstbackgroud_blue firstborder_blue' size="mini" style="width:72px;margin-right:8px">搜索</el-button>
<span class='button-icon'><i class='iconfont iconloudou'></i></span>
<span class='button-icon' v-popover:popover2><i class='iconfont iconpaixu'></i></span>
<el-button type='primary' class='firstbackgroud_blue firstborder_blue addbutton' @click='creatOrder()'>新建工单</el-button>
<el-button type='primary' class='firstbackgroud_blue firstborder_blue addbutton' @click='creatOrder()' size='mini'>新建工单</el-button>
<el-popover ref="popover2" placement="bottom" title="" width="120" trigger="click" >
<div class="popover-box">
<div v-for="(item,index) in filters" :key='index'>
{{item.name}}
<i class='el-icon-caret-top' v-if="item.id==1 || item.id==6 || item.id==8"></i>
<i class='el-icon-caret-bottom' v-if="item.id==2 || item.id==7 ||item.id==9"></i>
</div>
</div>
......@@ -51,7 +53,7 @@
<div class="all-order-content">
<div class="all-order-box thirdbackground_blue" v-for='(item,index) in tableData' :key='index' @click='checkDetail(item)'>
<div class="all-box-top firsttext_font">
<span :class="item.id==1?'type1':'type2'">保内</span>
<span :class="item.id==1?'type1':'type2'">{{item.server}}</span>
美的洗衣机--清理
<div class="all-box-topright firsttext_blue">
<i class='iconfont iconfenpei' @click.stop=''></i>
......@@ -146,20 +148,35 @@
type:'',time:'',options1:[],options2:[],name:''
},
tableData:[
{id:'1',statusText:'待派单'},
{id:'2',statusText:'待分配'},
{id:'3',statusText:'待完工'},
{id:'4',statusText:'待确权'},
{id:'5',statusText:'已完成'},
{id:'6',statusText:'已退回'}
{id:'1',statusText:'待派单',server:'保内'},
{id:'2',statusText:'待分配',server:'保外'},
{id:'3',statusText:'待完工',server:'保外'},
{id:'4',statusText:'待确权',server:'保外'},
{id:'5',statusText:'已完成',server:'保外'},
{id:'6',statusText:'已退回',server:'保外'},
{id:'1',statusText:'待派单',server:'保内'},
{id:'2',statusText:'待分配',server:'保外'},
{id:'3',statusText:'待完工',server:'保外'},
{id:'4',statusText:'待确权',server:'保外'},
{id:'5',statusText:'已完成',server:'保外'},
{id:'6',statusText:'已退回',server:'保外'},
{id:'1',statusText:'待派单',server:'保内'},
{id:'2',statusText:'待分配',server:'保外'},
{id:'3',statusText:'待完工',server:'保外'},
{id:'4',statusText:'待确权',server:'保外'},
{id:'5',statusText:'已完成',server:'保外'},
{id:'6',statusText:'已退回',server:'保外'},
],
filters:[
{id:'1',name:'创建时间'},
{id:'2',name:'用户地址'},
{id:'3',name:'用户电话'},
{id:'4',name:'授权点'},
{id:'5',name:'预约时间'},
{id:'6',name:'完工时间'},
{id:'2',name:'创建时间'},
{id:'3',name:'用户地址'},
{id:'4',name:'用户电话'},
{id:'5',name:'授权点'},
{id:'6',name:'预约时间'},
{id:'7',name:'预约时间'},
{id:'8',name:'完工时间'},
{id:'9',name:'完工时间'},
],
table:{
current_page:1,page_count:7,total:100,
......
......@@ -26,7 +26,7 @@ var addOne={
</el-row>
<el-row :gutter="20">
<el-col :span='10' >
<el-form-item prop="address" label='地址:' style=" " >
<el-form-item prop="address" label='地 址:' class="pre_space" >
<el-input v-model='addData.form.address' placeholder='请选择地址'></el-input>
</el-form-item>
</el-col>
......@@ -39,7 +39,7 @@ var addOne={
<el-radio v-model="addData.form.type" label="2" border size="mini">维修</el-radio>
<el-radio v-model="addData.form.type" label="3" border size="mini">检查</el-radio>
</el-form-item>
<el-form-item prop="date" label='质 保 期:' style=" " >
<el-form-item prop="date" label='质 保 期:' class="pre_space" >
<el-radio v-model="addData.form.date" label="1" border size="mini">保内</el-radio>
<el-radio v-model="addData.form.date" label="2" border size="mini">保外</el-radio>
</el-form-item>
......@@ -55,12 +55,12 @@ var addOne={
</el-row>
<el-row :gutter="20">
<el-col :span='10' >
<el-form-item prop="num" label='数量:' style=" " >
<el-form-item prop="num" label='数 量:' class="pre_space" >
<el-input v-model='addData.form.num' placeholder='请输入数量' type='number'></el-input>
</el-form-item>
</el-col>
</el-row>
<el-form-item label='描述:' style=" " >
<el-form-item label='描 述:' class="pre_space">
<el-input v-model='addData.form.remark' :autosize="{ minRows: 1, maxRows: 5}" type='textarea'></el-input>
</el-form-item>
<el-row :gutter="20">
......
......@@ -117,7 +117,6 @@ var beRighting={
<img src="../static/images/man.jpg" alt="" width="120px" height="120px">
<img src="../static/images/man.jpg" alt="" width="120px" height="120px">
</div>
</div>
<p>
完工备注注:
......
......@@ -24,13 +24,16 @@
background-color: #eef1fa !important;
position: relative;
}
.order .el-menu{
border-right: none;
}
.order-menu .el-menu-item.is-active:before{
content: '';
position: absolute;
width: 3px;
height: 20px;
left: 0;
top: 20px;
top: 17px;
background: #50B5FC
}
.order-right{
......@@ -41,25 +44,33 @@
}
.all-order .all-order-serch{
background: #ffffff;
padding: 10px;
padding:12px 10px;
height: 30px;
}
.all-order .all-order-serch .seach-select{
margin-right: 8px;
}
.all-order .all-order-serch .seach-select .el-input__inner,.all-order .all-order-serch .seach-select .el-input{
width: 120px !important;
background: #F1F3F9;
border: none;
height: 30px;
}
.all-order .all-order-serch .seach-input {
margin-right: 8px;
}
.all-order .all-order-serch .seach-input .el-input__inner,.all-order .all-order-serch .seach-input {
width: 298px;
height: 30px;
}
.button-color{
background: #5874D8;
}
.button-icon{
background: rgba(88,116,216,0.1) ; padding: 10px 8px;
background: rgba(88,116,216,0.1) ; padding: 5px 8px;
border-radius: 4px;
margin-right: 8px;
}
.button-icon i {
font-size: 22px;color: #5874D8;
......@@ -71,8 +82,9 @@
left: 0;
right: 0;
bottom: 50px;
top: 64px;
overflow: auto;
top: 54px;
overflow-y: auto;
overflow-x: hidden;
}
.all-order-content{
width: 1178px;
......@@ -82,18 +94,18 @@
}
.all-order-box{
width: 100%;
height: 104px;
height: 94px;
margin-top: 10px;
box-shadow: 3px 0px 5px 0px rgba(43,67,153,0.2);
}
.all-box-top{
height: 42px;
line-height: 42px;
height: 30px;
line-height: 30px;
}
.all-box-top .type1{
font-size: 14px;
color: #ffffff;
padding: 6px;
padding:5px 6px;
margin-right: 10px;
background: url('../static/images/order-set1.png');
background-size: 100% 100%;
......@@ -102,7 +114,7 @@
.all-box-top .type2{
font-size: 14px;
color: #ffffff;
padding: 6px;
padding:5px 6px;
margin-right: 10px;
background: url('../static/images/order-set2.png');
background-size: 100% 100%;
......@@ -113,15 +125,15 @@
}
.all-box-topright i:nth-child(1) {
margin-right: 20px;
font-size: 20px;
font-size: 18px;
}
.all-box-topright i:nth-child(2) {
margin-right: 20px;
font-size: 20px;
font-size: 18px;
}
.all-box-topright i:nth-child(3) {
margin-right: 20px;
font-size: 20px;
font-size: 18px;
}
.all-box-topright i.start2{
color: #50B5FC
......@@ -242,7 +254,7 @@
}
.order-detail .el-dialog__header .el-dialog__headerbtn i{
color:#8F97A4;
font-size: 14px;
font-size: 24px;
}
.order-detail .order-detail-tab{
margin-top: 5px;
......@@ -575,6 +587,11 @@
.add-order-right .add-order-content form .el-form-item__error{
padding-top: 0;
}
.add-order-right .add-order-content form .pre_space .el-form-item__error{
padding-top: 0;
left: -34px;
top: 28px;
}
.add-order-right .add-order-content form .el-input__icon{
line-height: 28px;
}
......@@ -601,6 +618,7 @@
}
.add-order-right .add-order-content .title span{
color: #5B76D1;
font-size: 12px;
}
.add-order-right .add-order-content .textarea{
margin-top: 20px;
......@@ -646,13 +664,13 @@
}
.deliver-dialog .el-dialog__header .el-dialog__headerbtn i{
color: #8F97A4 ;
font-size: 14px;
font-size: 24px;
}
.deliver-dialog .el-dialog__body{
padding: 30px;
padding: 30px 21px;
}
.deliver-dialog .deliver-dialog-title{
font-size:7px;
font-size:14px;
font-family:PingFangSC-Medium;
font-weight:500;
color:rgba(143,151,164,1);
......@@ -661,7 +679,7 @@
.deliver-dialog select{
}
.deliver-dialog .el-input__inner,.deliver-dialog .el-input{
width: 360px;
width: 402px;
height: 36px;
font-size: 12px;
}
......@@ -673,7 +691,7 @@
}
.deliver-dialog .bt-center button{
width: 180px;
border-clo
border:none;
}
/*******派单弹框end************/
/*******确权结算************/
......
......@@ -3,13 +3,13 @@ var Product={
template: `
<div class="settle-right">
<div class="all-settle-serch">
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类">
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类" size="mini">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options1'></el-option>
</el-select>
<el-input class="seach-input" v-model='search.name' prefix-icon="el-icon-search" placeholder='输入规格,型号名查询'></el-input>
<el-button type='primary' class='button-color'>搜索</el-button>
<el-button type='primary' plain class='firstbackgroud_blue addbutton' @click='AddCardfun()'>新建品牌</el-button>
<el-button type='primary' class='firstbackgroud_blue addbutton' @click='creatProduct()'>新建产品</el-button>
<el-input class="seach-input" v-model='search.name' prefix-icon="el-icon-search" placeholder='输入规格,型号名查询' size="mini"></el-input>
<el-button type='primary' class='button-color' size="mini">搜索</el-button>
<el-button type='primary' plain class='firstbackgroud_blue addbutton' @click="AddCardfun('creat')" size="mini">新建品牌</el-button>
<el-button type='primary' class='firstbackgroud_blue addbutton' @click='creatProduct()' size="mini">新建产品</el-button>
</div>
<div class="settle-content">
<table class="table-header">
......@@ -47,7 +47,7 @@ var Product={
<td style="width:70%" class='third-table-center'>
<div class="text_center"><el-button type='text' @click='edictModel(items,child)'>{{child.type}}</el-button></div>
</td>
<td style="width:30%">
<td style="width:30%" @click="AddCardfun('edict')">
<div class="text_center"><div class="text_center">{{child.name}}</div></div>
</td>
......@@ -186,9 +186,8 @@ var Product={
this.modalData = {};
this.modal = AddProduct;
},
AddCardfun(){
console.log(444)
this.modalData = {type:'creat'};
AddCardfun(type){
this.modalData = {type:type};
this.modal = AddCard;
},
edictType(item){
......
......@@ -2,15 +2,14 @@ var Protect ={
template: `
<div class="settle-right">
<div class="all-settle-serch">
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类">
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类" size="mini">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options1'></el-option>
</el-select>
<el-select class="seach-select" v-model="search.status" @change='' placeholder="选择类型">
<el-select class="seach-select" v-model="search.status" @change='' placeholder="选择类型" size="mini">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options2'></el-option>
</el-select>
<!-- <el-input class="seach-input" v-model='search.name' prefix-icon="el-icon-search" placeholder='输入项目名,合作商名查询'></el-input> -->
<el-button type='primary' class='firstbackgroud_blue'>搜索</el-button>
<el-button type='primary' class='firstbackgroud_blue addbutton' @click="addProtect()">新建</el-button>
<el-button type='primary' class='firstbackgroud_blue' size="mini">搜索</el-button>
<el-button type='primary' class='firstbackgroud_blue addbutton' @click="addProtect()" size="mini">新建</el-button>
</div>
<div class="settle-content">
<table class="table-header">
......
......@@ -2,15 +2,14 @@ var Server={
template: `
<div class="settle-right">
<div class="all-settle-serch">
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类">
<el-select class="seach-select" v-model="search.type" @change='' placeholder="选择品类" size="mini">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options1'></el-option>
</el-select>
<el-select class="seach-select" v-model="search.status" @change='' placeholder="选择状态">
<el-select class="seach-select" v-model="search.status" @change='' placeholder="选择状态" size="mini">
<el-option :label="item.label" :value="item.value" :key='item.label' v-for='(item,index) in search.options2'></el-option>
</el-select>
<!-- <el-input class="seach-input" v-model='search.name' prefix-icon="el-icon-search" placeholder='输入项目名,合作商名查询'></el-input> -->
<el-button type='primary' class='firstbackgroud_blue'>搜索</el-button>
<el-button type='primary' class='firstbackgroud_blue addbutton' @click='AddServerFun()'>新建服务</el-button>
<el-button type='primary' class='firstbackgroud_blue' size="mini">搜索</el-button>
<el-button type='primary' class='firstbackgroud_blue addbutton' @click='AddServerFun()' size="mini">新建服务</el-button>
</div>
<div class="settle-content">
<table class="table-header">
......
var AddCard={
template: `
<el-dialog width="420px" :title="dialog.title" custom-class='addcate animated slideInRight' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="品牌名称:">
<el-input v-model='form.name'></el-input>
</el-form-item>
</el-form>
<div class='button-box'>
<el-button type='primary' class='primary_btcolor' >保存</el-button>
</div>
<el-dialog width='444px' :title="dialog.title" custom-class='addcate' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<div class="dialog-content">
<div class="deliver-dialog-title">品牌名称:</div>
<el-input v-model="form.name"></el-input>
<div class="bt-center">
<el-button type="primary" class='firstbackgroud_blue text-white firstborder_blue' >保存</el-button>
<el-button type="danger" class='firstbackgroud_red text-white firstborder_red' v-if="isEdcit">删除</el-button>
</div>
</div>
</el-dialog>`,
props: {
......@@ -17,7 +18,7 @@ var AddCard={
},
data(){
return{
uploadApi:'',
uploadApi:'',isEdcit:false,
dialog:{
show:true,title:'新建品牌',type:1
},
......@@ -31,6 +32,10 @@ var AddCard={
if(this.modalData.type=='creat'){
this.dialog.title = '新增品牌'
}
if(this.modalData.type=='edict'){
this.isEdcit = true;
this.dialog.title = '编辑品牌'
}
},
methods:{
handleClose() {
......
// 产品规格
var AddCate={
template: `
<el-dialog width="420px" :title="dialog.title" custom-class='addcate animated slideInRight' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="产品品类:">
{{form.name}}
</el-form-item>
<el-form-item label="产品规格:">
<el-input v-model='form.cate'></el-input>
</el-form-item>
</el-form>
<div class='button-box'>
<el-button type='primary' class='primary_btcolor' >保存</el-button>
<el-button type='danger' class="firstbackgroud_red" v-if='!isCreat'>删除</el-button>
</div>
<el-dialog width="444px" :title="dialog.title" custom-class='addcate ' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<div class="dialog-content">
<div class="deliver-dialog-title">产品品类:</div>
<el-input v-model="form.name"></el-input>
<div class="deliver-dialog-title">产品规格:</div>
<el-input v-model="form.cate"></el-input>
<div class="bt-center">
<el-button type="primary" class='firstbackgroud_blue text-white firstborder_blue' >保存</el-button>
<el-button type="danger" class='firstbackgroud_red text-white firstborder_red' v-if="!isCreat">删除</el-button>
</div>
</div>
</el-dialog>`,
props: {
//父组件调用时传进来的参数
......@@ -25,7 +25,7 @@ var AddCate={
show:true,title:'产品规格',type:1
},
form:{
name:'',
name:'空调',
cate:''
}
}
......
// 产品型号
var AddModel={
template: `
<el-dialog width="420px" :title="dialog.title" custom-class='addcate' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="规格分类:">
{{form.name}}
</el-form-item>
<el-form-item label="归属品牌:">
<el-select v-model="form.card" placeholder="请选择">
<el-option label="海尔" value="海尔"></el-option>
<el-option label="美的" value="美的"></el-option>
</el-select>
</el-form-item>
<el-form-item label="输入型号:">
<el-input v-model='form.cate'></el-input>
</el-form-item>
</el-form>
<div class='button-box'>
<el-button type='primary' class='primary_btcolor' >保存</el-button>
<el-button type='danger' class="firstbackgroud_red" v-if='!isCreat'>删除</el-button>
</div>
<el-dialog width="444px" :title="dialog.title" custom-class='addcate' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<div class="dialog-content">
<div class="deliver-dialog-title">规格分类:</div>
<el-input v-model="form.name"></el-input>
<div class="deliver-dialog-title">归属品牌:</div>
<el-select v-model="form.card" placeholder="请选择" style="width:100%">
<el-option label="海尔" value="海尔"></el-option>
<el-option label="美的" value="美的"></el-option>
</el-select>
<div class="deliver-dialog-title">输入型号:</div>
<el-input v-model="form.model" type="textarea" placeholder="型号名称(多个用逗号隔开)"></el-input>
<div class="bt-center">
<el-button type="primary" class='firstbackgroud_blue text-white firstborder_blue' >保存</el-button>
<el-button type="danger" class='firstbackgroud_red text-white firstborder_red' v-if="!isCreat">删除</el-button>
</div>
</div>
</el-dialog>`,
props: {
//父组件调用时传进来的参数
......@@ -33,7 +35,7 @@ var AddModel={
form:{
name:'',
card:'',
cate:''
model:''
}
}
},
......
var AddProduct={
template: `
<el-dialog :title="dialog.title" :visible.sync="dialog.show" custom-class='order-detail animated slideInRight' @close="handleClose" :append-to-body="true" :show-close='true'>
<el-tabs v-model="dialog.tab" type="card" @tab-click="handleClick">
<el-dialog :title="dialog.title" :visible.sync="dialog.show" custom-class='order-detail' @close="handleClose" :append-to-body="true" :show-close='true'>
<el-tabs v-model="dialog.tab" type="card" @tab-click="handleClick" >
<el-tab-pane label="品类" name="1">
<div class='order-detail-tab' style="padding:20px;line-height:3">
<el-radio v-model="choose_type" v-for='(item,index) in products' :key='index' :label="item.id" @change='clickType(item)' border size="medium">{{item.name}}</el-radio>
......@@ -91,7 +91,7 @@ var AddProduct={
this.modal = AddCate;
},
addModel(){
this.innerData = {title:'新增类型',name:this.choose_cateName,show:true};
this.innerData = {title:'新增类型',name:this.choose_cateName,show:true,type:'creat'};
this.modal = AddModel;
},
closeChild(){
......
// 新增编辑品类
var AddType={
template: `
<el-dialog width="420px" :title="dialog.title" custom-class='addcate animated slideInRight' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="品类名称:">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="图片:">
<el-upload class="avatar-uploader" :action="uploadApi"
:show-file-list="false"
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload">
<img v-if="form.img" :src="form.img" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-form-item>
</el-form>
<div class='button-box'>
<el-button type='primary' class='primary_btcolor' >保存</el-button>
<el-button type='danger' class="firstbackgroud_red" v-if='!isCreat'>删除</el-button>
</div>
<el-dialog width="444px" :title="dialog.title" custom-class='addcate ' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<div class="dialog-content">
<div class="deliver-dialog-title">品类名称:</div>
<el-input v-model="form.name"></el-input>
<div class="deliver-dialog-title">上传图片:</div>
<el-upload class="addtype-uploader" :action="uploadApi" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
<img v-if="form.img" :src="form.img" class="addtype">
<i v-else class="el-icon-plus addtype-uploader-icon"></i>
</el-upload>
<div class="bt-center">
<el-button type="primary" class='firstbackgroud_blue text-white firstborder_blue' >保存</el-button>
<el-button type="danger" class='firstbackgroud_red text-white firstborder_red' v-if="!isCreat">删除</el-button>
</div>
</div>
</el-dialog> `,
props: {
//父组件调用时传进来的参数
......
var EdictProtect={
template: `
<el-dialog width="420px" :title="dialog.title" custom-class='addcate add-protect animated slideInRight' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<el-dialog width="444px" :title="dialog.title" custom-class='addcate add-protect ' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<div class="dialog-content">
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="品类名称:">
<el-select v-model="form.name" placeholder="选择品类">
<el-select v-model="form.name" placeholder="选择品类" style="width:100%">
<el-option :label="item.label" :value="item.value" :key="item.label" v-for="(item,index) in options1"></el-option>
</el-select>
</el-form-item>
<el-form-item label="服务类型:">
<el-select v-model="form.type" placeholder="选择类型">
<el-select v-model="form.type" placeholder="选择类型" style="width:100%">
<el-option :label="item.label" :value="item.value" :key="item.label" v-for="(item,index) in options2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="服务分类:">
<el-select v-model="form.area" placeholder="选择分类">
<el-select v-model="form.area" placeholder="选择分类" style="width:100%">
<el-option :label="item.label" :value="item.value" :key="item.label" v-for="(item,index) in options3"></el-option>
</el-select>
</el-form-item>
<el-form-item label="产品规格:">
<el-select v-model="form.cate" placeholder="选择规格">
<el-option :label="item.label" :value="item.value" :key="item.label" v-for="(item,index) in options4"></el-option>
<el-select v-model="form.cate" placeholder="选择规格(多选)" style="width:100%" @change="chooseFun">
<el-option :label="item.label" :value="item" :key="item.label" v-for="(item,index) in options4"></el-option>
</el-select>
<div style="max-height:122px;overflow-y:auto">
<span class="tag" v-for="(item,index) in chooseList" :key="index">
{{item.label}}
<i @click="deleteFun(index)" class='el-icon-close addoperate-icon'></i>
</span>
</div>
</el-form-item>
<el-form-item label="已 选:" class="pre_space">
<el-input placeholder='请输入金额'></el-input>
</el-form-item>
<el-form-item label="保内结算:">
<el-input v-model="form.price" placeholder='请输入金额'></el-input>
</el-form-item>
</el-form>
<div class='button-box'>
<el-button type='primary' class='primary_btcolor' >保存</el-button>
<el-button type='danger' class="firstbackgroud_red" v-if='!isCreat'>删除</el-button>
<div class="protect-center">
<el-button type="primary" class='firstbackgroud_blue text-white firstborder_blue' >保存</el-button>
<el-button type="danger" class='firstbackgroud_red text-white firstborder_red' v-if="!isCreat">删除</el-button>
</div>
</div>
</el-dialog> `,
props: {
......@@ -52,7 +64,13 @@ var EdictProtect={
options1:[],
options2:[],
options3:[],
options4:[],
options4:[
{value:1,label:'定频1.5P1'},
{value:2,label:'定频1.5P2'},
{value:3,label:'定频1.5P3'},
{value:4,label:'定频1.5P4'},
],
chooseList:[]
}
},
created(){
......@@ -71,6 +89,13 @@ var EdictProtect={
handleClose() {
this.$emit('close')
},
chooseFun(value){
console.log(value,this.chooseList)
this.chooseList.push(value)
},
deleteFun(index){
this.chooseList.splice(index,1)
},
}
}
......@@ -11,7 +11,7 @@ var AddServer={
<el-input v-model='input_first' ></el-input>
</el-col>
<el-col :span="18">
<i class='el-icon-success cursor' @click='addFirst()'></i>
<i class='el-icon-success cursor' @click='addFirst()' style="color: #5da75d;font-size: 22px;margin-left: 7px;margin-top: 10px;"></i>
</el-col>
</el-row>
</div>
......@@ -26,7 +26,7 @@ var AddServer={
<el-input v-model='input_second' ></el-input>
</el-col>
<el-col :span="18">
<i class='el-icon-success cursor' @click='addSecond()'></i>
<i class='el-icon-success cursor' @click='addSecond()' style="color: #5da75d;font-size: 22px;margin-left: 7px;margin-top: 10px;"></i>
</el-col>
</el-row>
</div>
......@@ -43,7 +43,7 @@ var AddServer={
<el-input v-model='input_third' type='textarea'></el-input>
</el-col>
<el-col :span="14">
<i class='el-icon-success cursor' @click='addThird()'></i>
<i class='el-icon-success cursor' @click='addThird()' style="color: #5da75d;font-size: 22px;margin-left: 7px;margin-top: 10px;"></i>
</el-col>
</el-row>
</div>
......
var EdictName={
template: `
<el-dialog width="420px" title="编辑" custom-class='addcate animated slideInRight' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="名称:">
<el-input v-model='form.name'></el-input>
</el-form-item>
</el-form>
<div class='button-box'>
<el-button type='primary' class='primary_btcolor' >保存</el-button>
<el-button type='danger' class="firstbackgroud_red" >删除</el-button>
</div>
<el-dialog width='444px' :title="dialog.title" custom-class='addcate' :visible.sync="dialog.show" @close="handleClose" append-to-body>
<div class="dialog-content">
<div class="deliver-dialog-title">品牌名称:</div>
<el-input v-model="form.name"></el-input>
<div class="bt-center">
<el-button type="primary" class='firstbackgroud_blue text-white firstborder_blue' >保存</el-button>
<el-button type="danger" class='firstbackgroud_red text-white firstborder_red' >删除</el-button>
</div>
</div>
</el-dialog> `,
props: {
//父组件调用时传进来的参数
......@@ -19,11 +19,10 @@ var EdictName={
return{
uploadApi:'',
dialog:{
show:true,title:'',type:1
show:true,title:'编辑',type:1
},
form:{
name:'空调',
cate:''
}
}
},
......
......@@ -30,6 +30,9 @@
top: 20px;
background: #50B5FC
}
.settle-menu{
border:none;
}
.settle-content table{
width: 100%;
border-collapse: separate;
......@@ -72,27 +75,29 @@
position: relative;
background: #ffffff;
}
.settle-right .all-settle-serch{
background: #ffffff;
padding: 10px;
position: relative;
.settle .all-settle-serch{
background: #ffffff;
padding:12px 10px;
height: 30px;
position: relative;
}
.all-settle-serch:after{
position: absolute;
content: '';
left: 20px;
right: 20px;
bottom: 0;
height:1px;
background: #ececec;
.settle .all-settle-serch .seach-select{
margin-right: 8px;
}
.settle-right .all-settle-serch .seach-select .el-input__inner,.settle-right .all-settle-serch .seach-select .el-input{
width: 120px !important;
background: #F1F3F9;
border: none;
.settle .all-settle-serch .seach-select .el-input__inner,.settle .all-settle-serch .seach-select .el-input{
width: 120px !important;
background: #F1F3F9;
border: none;
height: 30px;
}
.settle-right .all-settle-serch .seach-input .el-input__inner,.settle-right .all-settle-serch .seach-input {
width: 298px;
.settle .all-settle-serch .seach-input {
margin-right: 8px;
}
.settle .all-settle-serch .seach-input .el-input__inner,.settle .all-settle-serch .seach-input {
width: 298px;
height: 30px;
}
.button-color{
background: #5874D8;
......@@ -144,31 +149,13 @@
.addcate .button-box button{
width: 100px;
}
.order-detail{
width: 720px;
height: 670px;
}
.order-detail h2{
padding-left: 20px;
}
.order-detail .el-tabs--card>.el-tabs__header{
padding: 0 20px;
}
.order-detail .order-detail-tab{
margin-top: 5px;
line-height: 2;
/*border-bottom: 1px solid #ececec;*/
padding-bottom: 10px;
margin-bottom: 10px;
padding-left: 20px;
}
/*********dialog 样式********************/
.order-detail .el-radio__input{
display: none;
}
.order-detail .el-radio{
/*margin-right: 0;*/
/*background: #F1F3F8;*/
padding: 7px 15px 9px 3px;
border-radius: 3px;
margin-right: 20px;
......@@ -176,6 +163,64 @@
height: 30px;
}
.order-detail .el-dialog__body{
padding:30px 0;
}
.order-detail .el-dialog__header{
background: #6C8BF8;
}
.order-detail .el-dialog__header .el-dialog__title,.order-detail .el-dialog__header .el-dialog__headerbtn i{
color: #ffffff;
font-size: 16px;
}
.order-detail .el-tabs__header{
border:none;
}
.order-detail .el-dialog__body{
padding: 0;
}
.order-detail .el-dialog__header{
background: #eef1fa;
}
.order-detail .el-dialog__header .el-dialog__title{
color: #5874d8;
font-size: 18px;
}
.order-detail .el-dialog__header .el-dialog__headerbtn i{
color:#8F97A4;
font-size: 24px;
}
.order-detail h2{
padding-left: 30px;
}
.order-detail .el-tabs--card>.el-tabs__header{
padding: 0 20px;
background: #eef1fa;
padding-top: 10px;
}
.order-detail .el-tabs--card>.el-tabs__header .el-tabs__item{
background: #f5f5f5;
margin-bottom: -1px;
margin-right: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border: 1px solid #BFCAEB;
}
.order-detail .el-tabs--card>.el-tabs__header .el-tabs__item.is-active{
background: #ffffff;
border: 1px solid #5874d8;
border-bottom: #ffffff;
color: #5874d8;
}
.order-detail .el-tabs--card>.el-tabs__header .el-tabs__nav{
border:none;
}
/*******************************范围start******************************/
.order-detail-tab .tag{
......@@ -200,27 +245,87 @@
.addcate .button-box button{
width: 100px;
}
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
/*******增加品牌start************/
.addcate{
height: 492px;
}
.addcate .el-dialog__header{
background: #ffffff ;
padding-left: 30px;
}
.addcate .el-dialog__header .el-dialog__title{
color: #5B76D1 ;
font-size:24px;
font-family:PingFangSC-Medium;
font-weight:500;
line-height:35px
}
.addcate .el-dialog__header .el-dialog__headerbtn i{
color: #8F97A4 ;
font-size: 24px;
}
.addcate .el-dialog__body{
padding: 30px 21px;
}
.addcate .deliver-dialog-title{
font-size:14px;
font-family:PingFangSC-Medium;
font-weight:500;
color:rgba(143,151,164,1);
line-height:35px;
}
.addcate select{
}
.addcate .el-input__inner,.deliver-dialog .el-input{
height: 36px;
font-size: 12px;
}
.addcate .bt-center{
position: absolute;
bottom: 40px;
left: 0;
right: 0;
text-align: center;
}
.addcate .protect-center{
text-align: center;margin-top: 20px;
}
.addcate .bt-center button,.addcate .protect-center button{
width: 180px;
border:none;
}
/*******增加品牌end************/
/************上传***********************/
.addtype-uploader {
width: 100%
}
.addtype-uploader .el-upload {
border: 1px dashed #5774D8;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
width: 100%;
}
.avatar-uploader .el-upload:hover {
.addtype-uploader .el-upload:hover {
border-color: #409EFF;
}
.avatar-uploader-icon {
.addtype-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 120px;
height: 120px;
line-height: 120px;
color:#5774D8;
width: 100%;
height: 180px;
line-height: 180px;
text-align: center;
}
.avatar {
width: 120px;
height: 120px;
.addtype {
width: 100%;
height: 180px;
display: block;
}
.settle-content table{
......@@ -396,44 +501,6 @@
padding: 15px;
}
.order-detail{
width: 720px;
height: 670px;
}
.order-detail h2{
padding-left: 20px;
}
.order-detail .add-input{
margin-top: 10px;
}
.order-detail .add-input i{
color: #81C868;
font-size: 30px;
vertical-align: middle;
margin-left: 10px;
}
.order-detail .el-tabs--card>.el-tabs__header{
padding: 0 20px;
}
.order-detail .order-detail-tab{
/*margin-top: 5px;*/
line-height: 2;
/*border-bottom: 1px solid #ececec;*/
padding-bottom: 10px;
margin-bottom: 10px;
padding-left: 20px;
}
.order-detail .el-radio__input{
display: none;
}
.order-detail .el-radio{
padding: 7px 15px 9px 3px;
border-radius: 3px;
margin-right: 20px;
color: #999999 !important;
height: 30px;
}
/*******************************范围start******************************/
......@@ -452,12 +519,30 @@
.add-server .el-dialog__body{
padding:15px 0 !important;
}
.add-protect{
height: auto !important;
max-height: 580px;
}
.add-protect form{
width: 480px;
}
.add-protect form{
width: 320px;
width: 365px;
margin-left: 20px;
}
\ No newline at end of file
.add-protect .el-form-item{
margin-bottom: 7px;
}
.add-protect .tag{
background: #eef1fa;
padding: 5px ;
border-radius: 3px;
margin-right: 10px;
color: #8F97A4 !important;
border: 1px solid #5874D8;
display: inline-block;
height: 25px;
line-height: 25px;
margin-top: 5px;
}
This diff is collapsed.
var vPay={
template: `
<el-dialog :title="dialog.title" :visible.sync="dialog.show" custom-class='settle-dialog animated slideInRight' @close="handleClose" :append-to-body="true" :show-close='true'>
<div class="dialog-content">
<el-dialog :title="dialog.title" width='444px' :visible.sync="dialog.show" custom-class='settle-dialog' @close="handleClose" :append-to-body="true" :show-close='true'>
<div class="pay-detail-tab">
<p>
<span>授权点数:</span>
<span>唯修汇(张三 15599991111)</span>
<span class="settle-dialog-title">授权点数:</span>
<span>基 本:安装--新机 *1 ¥200.00</span>
</p>
<p>
<span>收款方式:</span>
<span>银行卡(中国银行高新支行)</span>
<span class="settle-dialog-title">其他金额:</span>
<el-input v-model="price"></el-input>
</p>
<p>收款人:<span>张三(62220998678123)</span></p>
<p>
<span>金额:</span>
<span>¥120000</span>
<span class="settle-dialog-title">金额说明:</span>
<el-input v-model="remark"></el-input>
</p>
<div class="bt-center">
<el-button class='background-blue text-white' >确定付款</el-button>
<p>
<span class="settle-dialog-title">合计金额:</span>
<el-input v-model="total"></el-input>
</p>
<div class="bt-center" style="bottom:25px !important">
<el-button class='background-blue text-white' >确定</el-button>
</div>
</div>
</el-dialog>`,
props: {
modalData: Array
......@@ -26,9 +30,9 @@ var vPay={
data(){
return{
detail:{ },uploadApi:'',
price:'',remark:'',total:'',
dialog:{
show:true,title:'结算付款',tab:'1',
show:true,title:'工单结算',tab:'1',
},
}
},
......
var payDetail={
template: `
<el-dialog :title="dialog.title" :visible.sync="dialog.show" custom-class='order-detail animated slideInRight' @close="handleClose" :append-to-body="true" :show-close='true'>
<el-dialog :title="dialog.title" :visible.sync="dialog.show" custom-class='pay-detail animated slideInRight' @close="handleClose" :append-to-body="true" :show-close='true'>
<el-tabs v-model="dialog.tab" type="card" @tab-click="handleClick">
<el-tab-pane label="详情" name="1">
<h2>付款信息</h2>
<div class='order-detail-tab' style="line-height:2.5;border:none">
<h2 class="line-left">付款信息</h2>
<div class='pay-detail-tab' style="border:none">
<p>
付款状态: <span>已付</span>
<span class="pay-dialog-title">付款状态:</span>
<span>已付款</span>
</p>
</div>
<p>
<span class="pay-dialog-title">创建日期:</span>
<span>2019-05-22</span>
</p>
<p>
<span class="pay-dialog-title">收款方式:</span>
<span>线上</span>
</p>
<p>
<span class="pay-dialog-title">授 权 点:</span>
<span>银行卡</span>
</p>
<p>
<span class="pay-dialog-title">金 额:</span>
<span>¥1200</span>
</p>
<p>
<span class="pay-dialog-title">付款日期:</span>
<span>2019-05-01</span>
</p>
<p>
<span class="pay-dialog-title">付款流水:</span>
<span>12739854065765</span>
</p>
<p>
<span class="pay-dialog-title">完工备注:</span>
<el-input type="textarea" v-model="remark"></el-input>
</p>
</div>
</el-tab-pane>
</el-tabs>
</el-dialog> `,
......@@ -19,7 +48,7 @@ var payDetail={
},
data(){
return{
detail:{ },uploadApi:'',isdedict:false,other:'',price:'',
detail:{ },uploadApi:'',isdedict:false,other:'',price:'',remark:'',
dialog:{
show:true,title:'付款单(GLDQ0019211237)',tab:'1',
},
......
var vSettle={
template: `
<el-dialog :title="dialog.title" :visible.sync="dialog.show" custom-class='settle-dialog animated slideInRight' @close="handleClose" :append-to-body="true" :show-close='true'>
<el-dialog :title="dialog.title" width='444px' :visible.sync="dialog.show" custom-class='settle-dialog ' @close="handleClose" :append-to-body="true" :show-close='true'>
<div class="dialog-content">
<p>
<span>授权点数:</span>
<span>3</span>
<span class="settle-dialog-title">授权点数:</span>
<span>唯修汇(张三 15599991111)</span>
</p>
<p>
<span>工单数量:</span>
<span>300</span>
<span class="settle-dialog-title">收款方式:</span>
<span>银行卡(中国银行高新支行)</span>
</p>
<p>
<span>结算金额:</span>
<span class="settle-dialog-title">收 款 人:</span>
<span>张三(62220998678123)</span>
</p>
<p>
<span class="settle-dialog-title">金 额:</span>
<span>¥120000</span>
</p>
<div class="settle-dialog-title">付款流水:</div>
<el-input v-model='form.number'></el-input>
<div class="settle-dialog-title">备 注:</div>
<el-input v-model='form.remark'></el-input>
<div class="bt-center">
<el-button class='background-blue text-white' >确定结算</el-button>
<el-button class='background-blue text-white' >确定付款</el-button>
</div>
</div>
</el-dialog> `,
......@@ -27,7 +35,7 @@ var vSettle={
data(){
return{
detail:{ },uploadApi:'',
form:{number:'',remark:''},
dialog:{
show:true,title:'结算工单',tab:'1',
},
......
var settleDetail={
template: `
<el-dialog :title="dialog.title" :visible.sync="dialog.show" custom-class='order-detail animated slideInRight' @close="handleClose" :append-to-body="true" :show-close='true'>
<el-dialog :title="dialog.title" :visible.sync="dialog.show" custom-class='pay-detail animated slideInRight' @close="handleClose" :append-to-body="true" :show-close='true'>
<div class="dialog-content">
<div class="edict-icon">
<i class="el-icon-edit-outline" @click='edictFun()' v-show='!isdedict'></i>
<i class="el-icon-edit-outline" @click='edictFun()' ></i>
</div>
<el-tabs v-model="dialog.tab" type="card" @tab-click="handleClick">
<el-tab-pane label="结算信息" name="1">
<h2>结算信息</h2>
<div class='order-detail-tab' style="line-height:2.5">
<h2 class="line-left">结算信息</h2>
<div class='pay-detail-tab' style="line-height:2.5">
<p>
基 本: <span>安装--新机安装*1¥200.00</span>
</p>
<p>
其 他:
<el-input class="seach-input" placeholder='其他项目' v-model='other' :disabled='!isdedict'></el-input>
<span>高空补贴 *1 ¥100.00</span>
</p>
<p>
金 额:
<el-input class="seach-input" placeholder='其他项目' v-model='price' :disabled='!isdedict'></el-input>
合计:
<span>¥1500</span>
</p>
</div>
<h2>完工信息</h2>
<div class='order-detail-tab' style="line-height:2.5;border:none">
<h2 class="line-left">完工信息</h2>
<div class='pay-detail-tab' style="line-height:2.5;border:none">
<el-row>
<el-col :span="12">
<p>授 权 点: <span> 唯修汇 (张三 15599991111)</span></p>
......@@ -45,27 +45,15 @@ var settleDetail={
<p>
完工图片: <span>(6张)</span>
</p>
<div class="order-carousel">
<el-carousel :interval="4000" type="card" height="120px" :autoplay='false' arrow="always">
<el-carousel-item >
<img src="../static/images/women.jpg" alt="" width="100%" height="100%">
</el-carousel-item>
<el-carousel-item >
<img src="../static/images/man.jpg" alt="" width="100%" height="100%">
</el-carousel-item>
<el-carousel-item >
<img src="../static/images/man.jpg" alt="" width="100%" height="100%">
</el-carousel-item>
<el-carousel-item >
<img src="../static/images/man.jpg" alt="" width="100%" height="100%">
</el-carousel-item>
<el-carousel-item >
<img src="../static/images/man.jpg" alt="" width="100%" height="100%">
</el-carousel-item>
<el-carousel-item >
<img src="../static/images/man.jpg" alt="" width="100%" height="100%">
</el-carousel-item>
</el-carousel>
<div class="pay-carousel">
<i class="el-icon-arrow-left"></i>
<i class="el-icon-arrow-right"></i>
<div class="pay-carousel-content">
<img src="../static/images/man.jpg" alt="" width="120px" height="120px" class="one">
<img src="../static/images/man.jpg" alt="" width="120px" height="120px">
<img src="../static/images/man.jpg" alt="" width="120px" height="120px">
<img src="../static/images/man.jpg" alt="" width="120px" height="120px">
</div>
</div>
<p>
完工备注注:
......@@ -75,6 +63,7 @@ var settleDetail={
</el-tab-pane>
</el-tabs>
</div>
<component :is="modal" @close="closeChild" :modal-data="innerData"></component>
</el-dialog>`,
props: {
......@@ -83,7 +72,7 @@ var settleDetail={
},
data(){
return{
detail:{ },uploadApi:'',isdedict:false,other:'',price:'',
detail:{ },uploadApi:'',other:'',price:'',modal:null,innerData:{},
dialog:{
show:true,title:'工单(GLDQ0019211237)--待结',tab:'1',
},
......@@ -97,7 +86,12 @@ var settleDetail={
},
edictFun(){
this.isdedict = true;
this.innerData = {};
this.modal = vSettle;
},
closeChild(){
this.modal = null;
}
}
}
......@@ -17,6 +17,9 @@
line-height: 64px;
border-bottom: 1px solid #ececec;
}
.settle-left .settle-menu .el-menu-item .settle-number{
float: right;
}
.settle-menu .el-menu-item.is-active{
background-color: #eef1fa !important;
position: relative;
......@@ -27,9 +30,13 @@
width: 3px;
height: 20px;
left: 0;
top: 20px;
top: 17px;
background: #50B5FC
}
.settle .el-menu{
border-right: none;
}
.settle-right{
float: right;
width: 1180px;
......@@ -47,6 +54,7 @@
background: #ffffff;
padding: 10px;
position: relative;
height: 34px
}
.all-settle-serch:after{
position: absolute;
......@@ -57,13 +65,20 @@
height:1px;
background: #ececec;
}
.all-settle-serch .seach-select{
margin-right: 8px;
}
.settle-right .all-settle-serch .seach-select .el-input__inner,.settle-right .all-settle-serch .seach-select .el-input{
width: 120px !important;
background: #F1F3F9;
border: none;
height: 30px;
}
.settle-right .all-settle-serch .seach-input .el-input__inner,.settle-right .all-settle-serch .seach-input {
width: 298px;
height: 30px;
margin-right: 8px;
}
.button-color{
background: #5874D8;
......@@ -92,10 +107,55 @@
bottom: 50px;
overflow: auto;
padding: 15px;
}
}
.settle-right .settle-content table{
text-align: center;
width: 100%;
}
.settle-right .settle-content .table-header{
background: #eef1fa;
height: 38px;
line-height: 38px;
}
.settle-right .settle-content .table-body td:nth-child(1),.settle-right .settle-content .table-header th:nth-child(1){
width: 5.5%;
}
.settle-right .settle-content .table-body td:nth-child(2),.settle-right .settle-content .table-header th:nth-child(2){
width: 11.5%;
}
.settle-right .settle-content .table-body td:nth-child(3),.settle-right .settle-content .table-header th:nth-child(3){
width: 11.5%;
}
.settle-right .settle-content .table-body td:nth-child(4),.settle-right .settle-content .table-header th:nth-child(4){
width: 13.5%;
}
.settle-right .settle-content .table-body td:nth-child(5),.settle-right .settle-content .table-header th:nth-child(5){
width: 18.5%;
}
.settle-right .settle-content .table-body td:nth-child(6),.settle-right .settle-content .table-header th:nth-child(6){
width: 16.5%;
}
.settle-right .settle-content .table-body td:nth-child(7),.settle-right .settle-content .table-header th:nth-child(7){
width: 13.5%;
}
.settle-right .settle-content .table-body td:nth-child(8),.settle-right .settle-content .table-header th:nth-child(8){
width: 8.5%;
}
.settle-right .settle-content .table-cell{
border: 1px solid #E2E2E2;
margin: 5px 0;
border-radius: 5px;
height: 74px;
font-size: 12px;
}
.settle-right .settle-content .table-cell:nth-of-type(odd){
background: #f5f5f5;
}
.settle-right .settle-content .table-cell .detail{
font-size: 12px;
color: #999;
}
.settle-right .settle-content table th{
background: #eef1fa;
color: #666;
......@@ -112,103 +172,190 @@
.settle-right .settle-content table td .cell .blue-text{
color: #5B76D1;
}
/*******付款弹框tart************/
.settle-dialog{
width: 420px;
height: 290px;
}
.el-dialog__wrapper{
overflow: hidden !important;
height: 492px;
}
.settle-dialog .el-tabs--card>.el-tabs__header{
padding: 0 20px;
.settle-dialog .el-dialog__header{
background: #ffffff ;
padding-left: 30px;
}
.settle-dialog .el-dialog__header .el-dialog__title{
color: #5B76D1 ;
font-size:24px;
font-family:PingFangSC-Medium;
font-weight:500;
line-height:35px
}
.settle-dialog .el-dialog__header .el-dialog__headerbtn i{
color: #8F97A4 ;
font-size: 24px;
}
.settle-dialog .el-dialog__body{
padding:30px 0;
padding: 30px 21px;
}
.settle-dialog .el-dialog__header{
background: #6C8BF8;
.settle-dialog .settle-dialog-title{
font-size:14px;
font-family:PingFangSC-Medium;
font-weight:500;
color:rgba(143,151,164,1);
line-height:35px;
white-space:pre;
}
.settle-dialog .el-dialog__header .el-dialog__title,.settle-dialog .el-dialog__header .el-dialog__headerbtn i{
color: #ffffff;
}
.settle-dialog .dialog-content{
padding: 0 20px;
line-height: 2;
.settle-dialog .dialog-content{
position: relative;
height: 368px;
}
.settle-dialog .el-input__inner,.settle-dialog .el-input{
width: 402px;
height: 36px;
font-size: 12px;
}
.bt-center{
.settle-dialog .bt-center{
position: absolute;
bottom: 0px;
left: 0;
right: 0;
text-align: center;
margin-top: 20px;
}
.settle-dialog .bt-center button{
width: 180px;
border-clo
}
/*******付款弹框end************/
/********************详情start*******************/
.order-detail{
width: 420px;
height: 260px;
.el-dialog__wrapper{
overflow: hidden !important;
}
.el-dialog__wrapper{
overflow: hidden !important;
.pay-detail{
width: 720px;
height: 638px;
float: right;
}
.pay-detail .el-tabs__header{
border:none;
}
.order-detail h2{
padding-left: 20px;
.pay-detail .el-dialog__body{
padding: 0;
}
.order-detail .el-tabs--card>.el-tabs__header{
padding: 0 20px;
.pay-detail .el-dialog__header{
background: #eef1fa;
}
.order-detail .el-dialog__body{
padding:30px 0;
.pay-detail .el-dialog__header .el-dialog__title{
color: #5874d8;
font-size: 18px;
}
.order-detail .el-dialog__header{
background: #6C8BF8;
.pay-detail .el-dialog__header .el-dialog__headerbtn i{
color:#8F97A4;
font-size: 24px;
}
.order-detail .el-dialog__header .el-dialog__title,.order-detail .el-dialog__header .el-dialog__headerbtn i{
color: #ffffff;
.pay-detail .pay-detail-tab{
margin-top: 5px;
line-height: 2;
border-bottom: 1px solid #ececec;
padding-bottom: 10px;
margin-bottom: 10px;
padding-left: 20px;
}
.order-detail .order-detail-tab{
margin-top: 5px;
line-height: 2;
border-bottom: 1px solid #ececec;
padding-bottom: 10px;
margin-bottom: 10px;
padding-left: 20px;
.pay-detail .pay-detail-tab p{
/*font-size: 12px;*/
}
.order-detail .order-detail-tab p{
color: #999;
font-size: 12px;
/*.pay-detail .pay-detail-tab span{
color: #333;
font-size: 12px;
}*/
.pay-detail h2{
padding-left: 30px;
}
.order-detail .order-detail-tab span{
color: #333;
font-size: 12px;
.pay-detail .el-tabs--card>.el-tabs__header{
padding: 0 20px;
background: #eef1fa;
}
.settle-dialog{
width: 420px;
.pay-detail .el-tabs--card>.el-tabs__header .el-tabs__item{
background: #f5f5f5;
margin-bottom: -1px;
margin-right: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border: 1px solid #BFCAEB;
}
.pay-detail .el-tabs--card>.el-tabs__header .el-tabs__item.is-active{
background: #ffffff;
border: 1px solid #5874d8;
border-bottom: #ffffff;
color: #5874d8;
}
.pay-detail .el-tabs--card>.el-tabs__header .el-tabs__nav{
border:none;
}
.pay-detail .pay-dialog-title{
font-size:12px;
font-family:PingFangSC-Medium;
font-weight:500;
color:rgba(143,151,164,1);
white-space: pre
}
.pay-detail-tab .el-textarea{
width: 564px;
vertical-align: text-top;
}
.pay-detail .edict-icon{
position: absolute;right: 20px;
top:60px;z-index: 3000;
}
.el-dialog__wrapper{
overflow: hidden !important;
.pay-detail .edict-icon i{
font-size: 24px;
color: #5874D8;
cursor: pointer;
}
/*.settle-dialog .el-tabs--card>.el-tabs__header{
padding: 0 20px;
.pay-detail .pay-detail-tab{
margin-top: 5px;
line-height: 2;
border-bottom: 1px solid #ececec;
padding-bottom: 10px;
margin-bottom: 10px;
padding-left: 20px;
}
.pay-detail .pay-detail-tab p{
color: #999;
font-size: 12px;
}
.pay-detail .pay-detail-tab span{
color: #333;
font-size: 12px;
}
.pay-carousel{
height: 135px;
margin: auto;
padding: 0 100px;
position: relative;
}
.pay-carousel-content{
/*width: 520px;*/
/*border: 1px solid #ececec;*/
margin: auto;
height: 135px;
overflow: hidden;
}
.settle-dialog .el-dialog__body{
padding:30px 0;
.pay-carousel i:nth-child(1){
position: absolute;
left: 0;
top: 35%;
font-size: 28px;
}
.settle-dialog .el-dialog__header{
background: #6C8BF8;
.pay-carousel i:nth-child(2){
position: absolute;
right: 20px;
top: 35%;
font-size: 28px;
}
.settle-dialog .el-dialog__header .el-dialog__title,.settle-dialog .el-dialog__header .el-dialog__headerbtn i{
color: #ffffff;
}
.settle-dialog .dialog-content{
padding: 0 20px;
line-height: 2;
}*/
/*.bt-center{
text-align: center;
margin-top: 20px;
}*/
/********************详情start*******************/
.order-detail{
/*.order-detail{
width: 720px;
height: 670px;
}
......@@ -266,7 +413,7 @@
.order-detail .seach-input .el-input__inner,.order-detail .seach-input {
width: 200px;
height: 25px;
}
}*/
/************************确权start******************************/
......
......@@ -11,7 +11,9 @@ html,body,#app,.wrapper{
position: relative;
}
#app{
opacity:0
opacity:0 ;
overflow-y: hidden;
overflow-x: auto;
}
body{
......@@ -26,6 +28,9 @@ button,.el-button{
.cursor{
cursor: pointer;
}
.pre_space{
white-space: pre;
}
.text_center{
text-align: center;
}
......@@ -250,6 +255,13 @@ ul .iconfont {
line-height: 2.4;
color: #8F97A4;
}
.el-popover .popover-box i{
float: right;
margin-right: 15px;
margin-top: 8px;
font-size: 18px;
}
.el-popover .popover-box div{
cursor: pointer;
padding-left: 12px;
......@@ -281,10 +293,15 @@ ul .iconfont {
background: red;
}
/****表单样式************/
.el-form-item__label{
position: relative !important;
}
.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before, .el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:after{
content: '*';
color: #F56C6C;
margin-right: 4px;
position: absolute;
left: 82px;
}
.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before, .el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before{
content: '';
......@@ -293,4 +310,29 @@ ul .iconfont {
border:1px solid #5874d8;
color: #5874d8;
background: #f5f5f5;
}
/************上传***********************/
.avatar-uploader .el-upload {
border: 1px dashed #5774D8;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409EFF;
}
.avatar-uploader-icon {
font-size: 28px;
color:#5774D8;
width: 120px;
height: 120px;
line-height: 120px;
text-align: center;
}
.avatar {
width: 120px;
height: 120px;
display: block;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment