Skip to content

C
confucius
Commit 3f3ad493 authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 1a1ebc8d
Hide whitespace changes
Inline Side-by-side
Showing with 1092 additions and 1051 deletions
src/components/sale/orderlist.vue
View file @ 3f3ad493
<template> <template>
<div class="classorder"> <div class="classorder">
<table class="enrollTotalSearchTable" border="0" cellspacing="0" cellpadding="0" style=""> <table class="enrollTotalSearchTable" border="0" cellspacing="0" cellpadding="0" style="">
<tr>
<th width="12%">单号</th>
<th width="8%">人数</th>
<th width="8%">单价</th>
<th width="8%">成交</th>
<th width="8%">应收总额</th>
<th width="8%">实收</th>
<th width="8%">优惠</th>
<th width="8%">退款</th>
<th width="8%">待收金额</th>
<th width="8%">状态</th>
<th>操作</th>
</tr>
<tr>
<td v-show="dataList && dataList.length==0" :colspan="11" align="center">暂无数据</td>
</tr>
<tbody v-for="(item,index) in dataList" :key="index">
<tr> <tr>
<th width="12%">单号</th> <td :rowspan="3" style="text-align: left">
<th width="8%">人数</th> <div style="font-size: 18px;color: #2961FE;margin-bottom: 20px;font-weight: bold;text-decoration: underline;cursor: pointer"
<th width="8%">单价</th> @click="goOrderdetails(item,1)">{{item.OrderId}}
<th width="8%">成交</th> </div>
<th width="8%">应收总额</th> <div>{{item.EnterName}}</div>
<th width="8%">实收</th> <div style="margin-top: 10px">{{item.CreateTime}}</div>
<th width="8%">优惠</th> <template v-if="isShowClass">
<th width="8%">退款</th> <div style="margin-top: 30px;margin-bottom: 10px">班级</div>
<th width="8%">待收金额</th> <div style="font-weight: bold;color:#2961FE;cursor:pointer;" @click="getClassInfo(item)">{{item.ClassName}}</div>
<th width="8%">状态</th> </template>
<th>操作</th> <template v-if="item.IsCommissionGive==1">
<div style="margin-top:30px;">提成：{{item.CommissionMoney}}</div>
</template>
<template>
<div style="margin-top:30px;color:red;" v-if="item.ExtraRewardMoney>0">额外奖励：{{item.ExtraRewardMoney}}
</div>
<div style="color:red" v-if="item.ExtraDeductMoney>0">额外扣除：{{item.ExtraDeductMoney}}</div>
</template>
</td>
<td style="border:none">{{item.GuestNum}}人</td>
<td style="border:none">{{item.Class_Price.toFixed(2)}}</td>
<td :style="{color:item.Class_Price!=item.Unit_Price?'#f5576c':'','border':'none'}">
{{item.Unit_Price.toFixed(2)}}
</td>
<td style="border:none">{{item.PreferPrice.toFixed(2)}}</td>
<td style="border:none">{{item.Income.toFixed(2)}}</td>
<td style="color:#f5576c;border:none">{{item.DiscountMoney.toFixed(2)}}</td>
<td style="border:none">{{item.Refund.toFixed(2)}}</td>
<td style="color:#2961FE;border:none">{{item.DueInMoney.toFixed(2)}}</td>
<td style="border:none">
<div style="background: rgba(2, 196, 153, 0.2);width: 80px;border-radius: 2px;text-align: center">
<span style="color: #02C499">{{item.OrderStateName}}</span>
</div>
</td>
<td style="border:none">
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="编辑"
@click="editOrder(item)" />
<q-btn-dropdown flat size="xs" color="dark" label="更多" style="margin-left:10px;">
<q-list>
<q-item clickable v-close-popup>
<q-item-section @click="gostudent(item)">
<q-item-label>学生名单</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="isShowClass">
<q-item-section @click="transferOrder(item,1)">
<q-item-label>转交订单</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass">
<q-item-section @click="transferOrder(item,2)">
<q-item-label>修改销售</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="isShowClass">
<q-item-section @click="editOrderRemark(item,1)">
<q-item-label>销售备注</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass">
<q-item-section @click="editOrderRemark(item,2)">
<q-item-label>教务备注</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass">
<q-item-section @click="editOrderRemark(item,3)">
<q-item-label>校长备注</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass">
<q-item-section @click="editOrderRemark(item,4)">
<q-item-label>总经理备注</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass&&item.IsCommissionGive==1">
<q-item-section @click="upDateMoney(item,1)">
<q-item-label>修改提成</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass">
<q-item-section @click="upDateMoney(item,2)">
<q-item-label>额外奖励</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup>
<q-item-section @click="CancelOrder(item)">
<q-item-label>取消订单</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-close-popup v-if="isShowClass">
<q-item-section>
<q-item-label @click="showBackClassForm(item)">退课</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-close-popup v-if="isShowClass">
<q-item-section>
<q-item-label @click="showContinueClass(item)">续课</q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-btn-dropdown>
</td>
</tr> </tr>
<tr> <tr>
<td v-show="dataList && dataList.length==0" :colspan="11" align="center">暂无数据</td> <td :colspan="11" style="text-align: left">
<div class="row" v-if="item.GuestList.length>0">
学生名单：
<span v-for="(x,j) in item.GuestList" :index="j" v-if="x.GuestState==1"
style="color:#2961FE;margin-right: 5px">{{x.GuestName}} </span>
</div>
<div class="row" v-if=" item.GuestList.length>0&&getTkshow(item.GuestList)">
退课名单：
<span v-for="(x,j) in item.GuestList" :index="j" v-if="x.GuestState==2" style="color:#f5576c;margin-right: 5px">{{x.GuestName}} </span>
</div>
<span v-if="item.GuestList.length==0">暂无</span>
</td>
</tr> </tr>
<tbody v-for="(item,index) in dataList" :key="index"> <tr>
<tr> <td :colspan="11" style="height: 168px;text-align: left">
<td :rowspan="3" style="text-align: left"> <div class="col row remarks q-gutter-x-md">
<div style="font-size: 18px;color: #2961FE;margin-bottom: 20px;font-weight: bold;text-decoration: underline;cursor: pointer" @click="goOrderdetails(item,1)">{{item.OrderId}}</div> <div class="col">
<div>{{item.EnterName}}</div> <div>销售备注：</div>
<div style="margin-top: 10px">{{item.CreateTime}}</div> <div class="remarks-b">
<template v-if="isShowClass"> <div v-if="item.SaleRemark!=null||item.SaleRemark!=''">
<div style="margin-top: 30px;margin-bottom: 10px">班级</div> <div>{{item.SaleRemark}}</div>
<div style="font-weight: bold;color:#2961FE;cursor:pointer;" @click="getClassInfo(item)">{{item.ClassName}}</div> <div class="remarks-b-b">
</template> <span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"
<template v-if="item.IsCommissionGive==1"> v-if="item.SaleRemarkList&&item.SaleRemarkList.length>0"></span>
<div style="margin-top:30px;">提成：{{item.CommissionMoney}}</div> <q-popup-proxy>
</template> <q-banner>
<template> <div style="width: 500px;">
<div style="margin-top:30px;color:red;" v-if="item.ExtraRewardMoney>0">额外奖励：{{item.ExtraRewardMoney}}</div> <div>销售备注</div>
<div style="color:red" v-if="item.ExtraDeductMoney>0">额外扣除：{{item.ExtraDeductMoney}}</div> <div v-for="(xq,jq) in item.SaleRemarkList" :index="jq"
</template> style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
</td> <div>{{xq.Content}}</div>
<td style="border:none">{{item.GuestNum}}人</td> <div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
<td style="border:none">{{item.Class_Price.toFixed(2)}}</td> </div>
<td :style="{color:item.Class_Price!=item.Unit_Price?'#f5576c':'','border':'none'}"> </div>
{{item.Unit_Price.toFixed(2)}} </q-banner>
</td> </q-popup-proxy>
<td style="border:none">{{item.PreferPrice.toFixed(2)}}</td>
<td style="border:none">{{item.Income.toFixed(2)}}</td>
<td style="color:#f5576c;border:none">{{item.DiscountMoney.toFixed(2)}}</td>
<td style="border:none">{{item.Refund.toFixed(2)}}</td>
<td style="color:#2961FE;border:none">{{item.DueInMoney.toFixed(2)}}</td>
<td style="border:none">
<div style="background: rgba(2, 196, 153, 0.2);width: 80px;border-radius: 2px;text-align: center">
<span style="color: #02C499">{{item.OrderStateName}}</span>
</div> </div>
</td>
<td style="border:none">
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="编辑" @click="editOrder(item)" />
<q-btn-dropdown flat size="xs" color="dark" label="更多" style="margin-left:10px;">
<q-list>
<q-item clickable v-close-popup>
<q-item-section @click="gostudent(item)">
<q-item-label>学生名单</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="isShowClass">
<q-item-section @click="transferOrder(item,1)">
<q-item-label>转交订单</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass">
<q-item-section @click="transferOrder(item,2)">
<q-item-label>修改销售</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="isShowClass">
<q-item-section @click="editOrderRemark(item,1)">
<q-item-label>销售备注</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass">
<q-item-section @click="editOrderRemark(item,2)">
<q-item-label>教务备注</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass">
<q-item-section @click="editOrderRemark(item,3)">
<q-item-label>校长备注</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass">
<q-item-section @click="editOrderRemark(item,4)">
<q-item-label>总经理备注</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass&&item.IsCommissionGive==1">
<q-item-section @click="upDateMoney(item,1)">
<q-item-label>修改提成</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-if="!isShowClass">
<q-item-section @click="upDateMoney(item,2)">
<q-item-label>额外奖励</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup>
<q-item-section @click="CancelOrder(item)">
<q-item-label>取消订单</q-item-label>
</q-item-section>
</q-item>
<q-item clickable v-close-popup v-close-popup v-if="isShowClass">
<q-item-section>
<q-item-label @click="showBackClassForm(item)">退课</q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-btn-dropdown>
</td>
</tr>
<tr>
<td :colspan="11" style="text-align: left">
<div class="row" v-if="item.GuestList.length>0">
学生名单：
<span v-for="(x,j) in item.GuestList" :index="j" v-if="x.GuestState==1" style="color:#2961FE;margin-right: 5px">{{x.GuestName}} </span>
</div>
<div class="row" v-if=" item.GuestList.length>0&&getTkshow(item.GuestList)">
退课名单：
<span v-for="(x,j) in item.GuestList" :index="j" v-if="x.GuestState==2" style="color:#f5576c;margin-right: 5px">{{x.GuestName}} </span>
</div> </div>
<span v-if="item.GuestList.length==0">暂无</span> <span v-if="item.SaleRemark==null||item.SaleRemark==''">暂无</span>
</div>
</td> </div>
</tr> <div class="col">
<tr> <div>教务备注：</div>
<td :colspan="11" style="height: 168px;text-align: left"> <div class="remarks-b ">
<div class="col row remarks q-gutter-x-md"> <div v-if="item.TeacherRemark!=null||item.TeacherRemark!=''">
<div class="col"> <div>{{item.TeacherRemark}}</div>
<div>销售备注：</div> <div class="remarks-b-b">
<div class="remarks-b"> <span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"
<div v-if="item.SaleRemark!=null||item.SaleRemark!=''"> v-if="item.TeacherRemarkList&&item.TeacherRemarkList.length>0"></span>
<div>{{item.SaleRemark}}</div> <q-popup-proxy>
<div class="remarks-b-b"> <q-banner>
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px" v-if="item.SaleRemarkList&&item.SaleRemarkList.length>0"></span> <div style="width: 500px;">
<q-popup-proxy> <div>教务备注</div>
<q-banner> <div v-for="(xq,jq) in item.TeacherRemarkList" :index="jq"
<div style="width: 500px;"> style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<div>销售备注</div> <div>{{xq.Content}}</div>
<div v-for="(xq,jq) in item.SaleRemarkList" :index="jq" style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px"> <div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
<div>{{xq.Content}}</div>
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
</div>
</div>
</q-banner>
</q-popup-proxy>
</div>
</div>
<span v-if="item.SaleRemark==null||item.SaleRemark==''">暂无</span>
</div>
</div>
<div class="col">
<div>教务备注：</div>
<div class="remarks-b ">
<div v-if="item.TeacherRemark!=null||item.TeacherRemark!=''">
<div>{{item.TeacherRemark}}</div>
<div class="remarks-b-b">
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px" v-if="item.TeacherRemarkList&&item.TeacherRemarkList.length>0"></span>
<q-popup-proxy>
<q-banner>
<div style="width: 500px;">
<div>教务备注</div>
<div v-for="(xq,jq) in item.TeacherRemarkList" :index="jq" style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<div>{{xq.Content}}</div>
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
</div>
</div>
</q-banner>
</q-popup-proxy>
</div>
</div>
<span v-if="item.TeacherRemark==null||item.TeacherRemark==''">暂无</span>
</div>
</div>
<div class="col">
<div>校长备注：</div>
<div class="remarks-b ">
<div v-if="item.RectorRemark!=null ||item.RectorRemark!=''">
<div>{{item.RectorRemark}}</div>
<div class="remarks-b-b">
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px" v-if="item.RectorRemarkList&&item.RectorRemarkList.length>0"></span>
<q-popup-proxy>
<q-banner>
<div style="width: 500px;">
<div>校长备注</div>
<div v-for="(xq,jq) in item.RectorRemarkList" :index="jq" style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<div>{{xq.Content}}</div>
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
</div>
</div>
</q-banner>
</q-popup-proxy>
</div>
</div>
<span v-if="item.RectorRemark==null||item.RectorRemark==''">暂无</span>
</div> </div>
</div> </div>
<div class="col"> </q-banner>
<div>总经理备注：</div> </q-popup-proxy>
<div class="remarks-b "> </div>
<div v-if="item.DirectorRemark!=null||item.DirectorRemark!=''"> </div>
<div>{{item.DirectorRemark}}</div> <span v-if="item.TeacherRemark==null||item.TeacherRemark==''">暂无</span>
<div class="remarks-b-b"> </div>
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px" v-if="item.DirectorRemarkList&&item.DirectorRemarkList.length>0"></span> </div>
<q-popup-proxy> <div class="col">
<q-banner> <div>校长备注：</div>
<div style="width: 500px;"> <div class="remarks-b ">
<div>总经理备注</div> <div v-if="item.RectorRemark!=null ||item.RectorRemark!=''">
<div v-for="(xq,jq) in item.DirectorRemarkList" :index="jq" style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px"> <div>{{item.RectorRemark}}</div>
<div>{{xq.Content}}</div> <div class="remarks-b-b">
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div> <span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"
</div> v-if="item.RectorRemarkList&&item.RectorRemarkList.length>0"></span>
</div> <q-popup-proxy>
</q-banner> <q-banner>
</q-popup-proxy> <div style="width: 500px;">
</div> <div>校长备注</div>
</div> <div v-for="(xq,jq) in item.RectorRemarkList" :index="jq"
<span v-if="item.DirectorRemark==null||item.DirectorRemark==''">暂无</span> style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<div>{{xq.Content}}</div>
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
</div> </div>
</div> </div>
<div class="col"> </q-banner>
<div class="row" style="justify-content: space-between"> </q-popup-proxy>
<span>收款单据：</span> </div>
<q-btn flat size="xs" icon="edit" v-if="isShowClass" style="font-weight:400;color: #02C499" label="修改" @click="chanceType(item,1)" /> </div>
<span v-if="item.RectorRemark==null||item.RectorRemark==''">暂无</span>
</div>
</div>
<div class="col">
<div>总经理备注：</div>
<div class="remarks-b ">
<div v-if="item.DirectorRemark!=null||item.DirectorRemark!=''">
<div>{{item.DirectorRemark}}</div>
<div class="remarks-b-b">
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"
v-if="item.DirectorRemarkList&&item.DirectorRemarkList.length>0"></span>
<q-popup-proxy>
<q-banner>
<div style="width: 500px;">
<div>总经理备注</div>
<div v-for="(xq,jq) in item.DirectorRemarkList" :index="jq"
style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<div>{{xq.Content}}</div>
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
</div> </div>
</div>
<div class="row wrap"> </q-banner>
<div class="finance row" v-for="(x,j) in item.FinanceList" :index="j" :style="{ </q-popup-proxy>
</div>
</div>
<span v-if="item.DirectorRemark==null||item.DirectorRemark==''">暂无</span>
</div>
</div>
<div class="col">
<div class="row" style="justify-content: space-between">
<span>收款单据：</span>
<q-btn flat size="xs" icon="edit" v-if="isShowClass" style="font-weight:400;color: #02C499" label="修改"
@click="chanceType(item,1)" />
</div>
<div class="row wrap">
<div class="finance row" v-for="(x,j) in item.FinanceList" :index="j"
:style="{
background:x.ColorState==1 ? 'rgba(41, 97, 254, 0.2)':(x.ColorState==2 ? 'rgba(2, 196, 153, 0.2)':(x.ColorState==3 ? 'rgba(242, 140, 29, 0.2)':'rgba(63, 196, 255, 0.2)')), background:x.ColorState==1 ? 'rgba(41, 97, 254, 0.2)':(x.ColorState==2 ? 'rgba(2, 196, 153, 0.2)':(x.ColorState==3 ? 'rgba(242, 140, 29, 0.2)':'rgba(63, 196, 255, 0.2)')),
color: x.ColorState==1 ? '#2961FE':(x.ColorState==2 ? '#02C499':(x.ColorState==3 ? '#F28C1D':'#3FC4FF'))}"> color: x.ColorState==1 ? '#2961FE':(x.ColorState==2 ? '#02C499':(x.ColorState==3 ? '#F28C1D':'#3FC4FF'))}">
<span style="cursor: pointer" @click="goOrderdetails(item,4)">{{x.FrID}}</span> <span style="cursor: pointer" @click="goOrderdetails(item,4)">{{x.FrID}}</span>
</div> </div>
</div> </div>
<div class="row" style="justify-content: space-between"> <div class="row" style="justify-content: space-between">
<span>付款单据：</span> <span>付款单据：</span>
<q-btn flat size="xs" icon="edit" v-if="isShowClass" style="font-weight:400;color: #02C499" label="修改" @click="chanceType(item,2)" /> <q-btn flat size="xs" icon="edit" v-if="isShowClass" style="font-weight:400;color: #02C499" label="修改"
</div> @click="chanceType(item,2)" />
<div class="row wrap"> </div>
<div class="finance row" v-for="(x,j) in item.RefundFinanceList" :index="j" :style="{ <div class="row wrap">
<div class="finance row" v-for="(x,j) in item.RefundFinanceList" :index="j"
:style="{
background:x.ColorState==1 ? 'rgba(41, 97, 254, 0.2)':(x.ColorState==2 ? 'rgba(2, 196, 153, 0.2)':(x.ColorState==3 ? 'rgba(242, 140, 29, 0.2)':'rgba(63, 196, 255, 0.2)')), background:x.ColorState==1 ? 'rgba(41, 97, 254, 0.2)':(x.ColorState==2 ? 'rgba(2, 196, 153, 0.2)':(x.ColorState==3 ? 'rgba(242, 140, 29, 0.2)':'rgba(63, 196, 255, 0.2)')),
color: x.ColorState==1 ? '#2961FE':(x.ColorState==2 ? '#02C499':(x.ColorState==3 ? '#F28C1D':'#3FC4FF'))}"> color: x.ColorState==1 ? '#2961FE':(x.ColorState==2 ? '#02C499':(x.ColorState==3 ? '#F28C1D':'#3FC4FF'))}">
<span style="cursor: pointer" @click="goOrderdetails(item,4)">{{x.FrID}}</span> <span style="cursor: pointer" @click="goOrderdetails(item,4)">{{x.FrID}}</span>
</div> </div>
</div>
</div>
</div>
</td>
</tr>
</tbody>
<tbody v-if="cancelList&&cancelList.length>0">
<tr>
<td :colspan="11">
<span style="color:red;cursor:pointer;font-weight:bold;" @click='isShowCancel=!isShowCancel'>取消订单</span>
</td>
</tr>
</tbody>
<tbody v-if="cancelList&&cancelList.length>0 && isShowCancel" v-for="(item,index) in cancelList"
:key="index+10000">
<tr>
<td :rowspan="3" style="text-align: left">
<div style="font-size: 18px;color: #2961FE;margin-bottom: 20px;font-weight: bold"
@click="goOrderdetails(item)">{{item.OrderId}}</div>
<div>{{item.EnterName}}</div>
<div style="margin-top: 10px">{{item.CreateTime}}</div>
<template v-if="isShowClass">
<div style="margin-top: 30px;margin-bottom: 10px">班级</div>
<div style="font-weight: bold;color:#2961FE;" @click="getClassInfo(item)">{{item.ClassName}}</div>
</template>
</td>
<td style="border:none">{{item.GuestNum}}人</td>
<td style="border:none">{{item.Class_Price.toFixed(2)}}</td>
<td :style="{color:item.Class_Price!=item.Unit_Price?'#f5576c':'','border':'none'}">
{{item.Unit_Price.toFixed(2)}}
</td>
<td style="border:none">{{item.PreferPrice.toFixed(2)}}</td>
<td style="border:none">{{item.Income.toFixed(2)}}</td>
<td style="color:#f5576c;border:none">{{item.DiscountMoney.toFixed(2)}}</td>
<td style="border:none">{{item.Refund.toFixed(2)}}</td>
<td style="color:#2961FE;border:none">{{item.DueInMoney.toFixed(2)}}</td>
<td style="border:none">
<div style="background: rgba(2, 196, 153, 0.2);width: 80px;border-radius: 2px;text-align: center">
<span style="color: #02C499">{{item.OrderStateName}}</span>
</div>
</td>
<td style="border:none;">
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400;display:none;" label="编辑"
@click="editOrder(item)" />
<q-btn-dropdown flat size="xs" color="dark" label="更多" style="margin-left:10px;display:none;">
<q-list>
<q-item clickable v-close-popup>
<q-item-section @click="gostudent(item)">
<q-item-label>学生名单</q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-btn-dropdown>
</td>
</tr>
<tr>
<td :colspan="11" style="text-align: left">
<div class="row" v-if="item.GuestList.length>0">
学生名单：
<span v-for="(x,j) in item.GuestList" :index="j" v-if="x.GuestState==1"
style="color:#2961FE;margin-right: 5px">{{x.GuestName}} </span>
</div>
<div class="row" v-if=" item.GuestList.length>0&&getTkshow(item.GuestList)">
退课名单：
<span v-for="(x,j) in item.GuestList" :index="j" v-if="x.GuestState==2"
style="color:#f5576c;margin-right: 5px">{{x.GuestName}} </span>
</div>
<span v-if="item.GuestList.length==0">暂无</span>
</td>
</tr>
<tr>
<td :colspan="11" style="height: 168px;text-align: left">
<div class="col row remarks q-gutter-x-md">
<div class="col">
<div>销售备注：</div>
<div class="remarks-b">
<div v-if="item.SaleRemark!=null||item.SaleRemark!=''">
<div>{{item.SaleRemark}}</div>
<div class="remarks-b-b">
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"
v-if="item.SaleRemarkList&&item.SaleRemarkList.length>0"></span>
<q-popup-proxy>
<q-banner>
<div style="width: 500px;">
<div>销售备注</div>
<div v-for="(xq,jq) in item.SaleRemarkList" :index="jq"
style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<div>{{xq.Content}}</div>
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
</div> </div>
</div> </div>
</div> </q-banner>
</td> </q-popup-proxy>
</tr>
</tbody>
<tbody v-if="cancelList&&cancelList.length>0">
<tr>
<td :colspan="11">
<span style="color:red;cursor:pointer;" @click='isShowCancel=!isShowCancel'> 取消订单</span>
</td>
</tr>
</tbody>
<tbody v-if="cancelList&&cancelList.length>0 && isShowCancel" v-for="(item,index) in cancelList" :key="index+10000">
<tr>
<td :rowspan="3" style="text-align: left">
<div style="font-size: 18px;color: #2961FE;margin-bottom: 20px;font-weight: bold" @click="goOrderdetails(item)">{{item.OrderId}}</div>
<div>{{item.EnterName}}</div>
<div style="margin-top: 10px">{{item.CreateTime}}</div>
<div style="margin-top: 30px;margin-bottom: 10px">班级</div>
<div style="font-weight: bold;color:#2961FE;" @click="getClassInfo(item)">{{item.ClassName}}</div>
</td>
<td style="border:none">{{item.GuestNum}}人</td>
<td style="border:none">{{item.Class_Price.toFixed(2)}}</td>
<td :style="{color:item.Class_Price!=item.Unit_Price?'#f5576c':'','border':'none'}">
{{item.Unit_Price.toFixed(2)}}
</td>
<td style="border:none">{{item.PreferPrice.toFixed(2)}}</td>
<td style="border:none">{{item.Income.toFixed(2)}}</td>
<td style="color:#f5576c;border:none">{{item.DiscountMoney.toFixed(2)}}</td>
<td style="border:none">{{item.Refund.toFixed(2)}}</td>
<td style="color:#2961FE;border:none">{{item.DueInMoney.toFixed(2)}}</td>
<td style="border:none">
<div style="background: rgba(2, 196, 153, 0.2);width: 80px;border-radius: 2px;text-align: center">
<span style="color: #02C499">{{item.OrderStateName}}</span>
</div> </div>
</td>
<td style="border:none;">
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400;display:none;" label="编辑" @click="editOrder(item)" />
<q-btn-dropdown flat size="xs" color="dark" label="更多" style="margin-left:10px;display:none;">
<q-list>
<q-item clickable v-close-popup>
<q-item-section @click="gostudent(item)">
<q-item-label>学生名单</q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-btn-dropdown>
</td>
</tr>
<tr>
<td :colspan="11" style="text-align: left">
<div class="row" v-if="item.GuestList.length>0">
学生名单：
<span v-for="(x,j) in item.GuestList" :index="j" v-if="x.GuestState==1" style="color:#2961FE;margin-right: 5px">{{x.GuestName}} </span>
</div> </div>
<div class="row" v-if=" item.GuestList.length>0&&getTkshow(item.GuestList)"> <span v-if="item.SaleRemark==null||item.SaleRemark==''">暂无</span>
退课名单： </div>
<span v-for="(x,j) in item.GuestList" :index="j" v-if="x.GuestState==2" style="color:#f5576c;margin-right: 5px">{{x.GuestName}} </span> </div>
</div> <div class="col">
<span v-if="item.GuestList.length==0">暂无</span> <div>教务备注：</div>
</td> <div class="remarks-b ">
</tr> <div v-if="item.TeacherRemark!=null||item.TeacherRemark!=''">
<tr> <div>{{item.TeacherRemark}}</div>
<td :colspan="11" style="height: 168px;text-align: left"> <div class="remarks-b-b">
<div class="col row remarks q-gutter-x-md"> <span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"
<div class="col"> v-if="item.TeacherRemarkList&&item.TeacherRemarkList.length>0"></span>
<div>销售备注：</div> <q-popup-proxy>
<div class="remarks-b"> <q-banner>
<div v-if="item.SaleRemark!=null||item.SaleRemark!=''"> <div style="width: 500px;">
<div>{{item.SaleRemark}}</div> <div>教务备注</div>
<div class="remarks-b-b"> <div v-for="(xq,jq) in item.TeacherRemarkList" :index="jq"
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px" v-if="item.SaleRemarkList&&item.SaleRemarkList.length>0"></span> style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<q-popup-proxy> <div>{{xq.Content}}</div>
<q-banner> <div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
<div style="width: 500px;">
<div>销售备注</div>
<div v-for="(xq,jq) in item.SaleRemarkList" :index="jq" style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<div>{{xq.Content}}</div>
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
</div>
</div>
</q-banner>
</q-popup-proxy>
</div>
</div>
<span v-if="item.SaleRemark==null||item.SaleRemark==''">暂无</span>
</div>
</div>
<div class="col">
<div>教务备注：</div>
<div class="remarks-b ">
<div v-if="item.TeacherRemark!=null||item.TeacherRemark!=''">
<div>{{item.TeacherRemark}}</div>
<div class="remarks-b-b">
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px" v-if="item.TeacherRemarkList&&item.TeacherRemarkList.length>0"></span>
<q-popup-proxy>
<q-banner>
<div style="width: 500px;">
<div>教务备注</div>
<div v-for="(xq,jq) in item.TeacherRemarkList" :index="jq" style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<div>{{xq.Content}}</div>
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
</div>
</div>
</q-banner>
</q-popup-proxy>
</div>
</div>
<span v-if="item.TeacherRemark==null||item.TeacherRemark==''">暂无</span>
</div>
</div>
<div class="col">
<div>校长备注：</div>
<div class="remarks-b ">
<div v-if="item.RectorRemark!=null ||item.RectorRemark!=''">
<div>{{item.RectorRemark}}</div>
<div class="remarks-b-b">
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px" v-if="item.RectorRemarkList&&item.RectorRemarkList.length>0"></span>
<q-popup-proxy>
<q-banner>
<div style="width: 500px;">
<div>校长备注</div>
<div v-for="(xq,jq) in item.RectorRemarkList" :index="jq" style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<div>{{xq.Content}}</div>
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
</div>
</div>
</q-banner>
</q-popup-proxy>
</div>
</div>
<span v-if="item.RectorRemark==null||item.RectorRemark==''">暂无</span>
</div> </div>
</div> </div>
<div class="col"> </q-banner>
<div>总经理备注：</div> </q-popup-proxy>
<div class="remarks-b "> </div>
<div v-if="item.DirectorRemark!=null||item.DirectorRemark!=''"> </div>
<div>{{item.DirectorRemark}}</div> <span v-if="item.TeacherRemark==null||item.TeacherRemark==''">暂无</span>
<div class="remarks-b-b"> </div>
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px" v-if="item.DirectorRemarkList&&item.DirectorRemarkList.length>0"></span> </div>
<q-popup-proxy> <div class="col">
<q-banner> <div>校长备注：</div>
<div style="width: 500px;"> <div class="remarks-b ">
<div>总经理备注</div> <div v-if="item.RectorRemark!=null ||item.RectorRemark!=''">
<div v-for="(xq,jq) in item.DirectorRemarkList" :index="jq" style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px"> <div>{{item.RectorRemark}}</div>
<div>{{xq.Content}}</div> <div class="remarks-b-b">
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div> <span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"
</div> v-if="item.RectorRemarkList&&item.RectorRemarkList.length>0"></span>
</div> <q-popup-proxy>
</q-banner> <q-banner>
</q-popup-proxy> <div style="width: 500px;">
</div> <div>校长备注</div>
</div> <div v-for="(xq,jq) in item.RectorRemarkList" :index="jq"
<span v-if="item.DirectorRemark==null||item.DirectorRemark==''">暂无</span> style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<div>{{xq.Content}}</div>
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
</div> </div>
</div> </div>
<div class="col"> </q-banner>
<div class="row" style="justify-content: space-between"> </q-popup-proxy>
<span>收款单据：</span> </div>
<q-btn flat size="xs" icon="edit" v-if="isShowClass" style="font-weight:400;color: #02C499" label="修改" @click="chanceType(item,1)" /> </div>
<span v-if="item.RectorRemark==null||item.RectorRemark==''">暂无</span>
</div>
</div>
<div class="col">
<div>总经理备注：</div>
<div class="remarks-b ">
<div v-if="item.DirectorRemark!=null||item.DirectorRemark!=''">
<div>{{item.DirectorRemark}}</div>
<div class="remarks-b-b">
<span class="iconfont icon-xiangxia" style="color: #2961FE;font-size: 10px"
v-if="item.DirectorRemarkList&&item.DirectorRemarkList.length>0"></span>
<q-popup-proxy>
<q-banner>
<div style="width: 500px;">
<div>总经理备注</div>
<div v-for="(xq,jq) in item.DirectorRemarkList" :index="jq"
style=" margin-top: 10px;background: #e6e6e6;padding: 5px;font-size: 12px">
<div>{{xq.Content}}</div>
<div style="text-align: right">{{xq.CreateBy}} {{xq.CreateTime}}</div>
</div> </div>
</div>
<div class="row wrap"> </q-banner>
<div class="finance row" v-for="(x,j) in item.FinanceList" :index="j" :style="{ </q-popup-proxy>
</div>
</div>
<span v-if="item.DirectorRemark==null||item.DirectorRemark==''">暂无</span>
</div>
</div>
<div class="col">
<div class="row" style="justify-content: space-between">
<span>收款单据：</span>
<q-btn flat size="xs" icon="edit" v-if="isShowClass" style="font-weight:400;color: #02C499" label="修改"
@click="chanceType(item,1)" />
</div>
<div class="row wrap">
<div class="finance row" v-for="(x,j) in item.FinanceList" :index="j"
:style="{
background:x.ColorState==1 ? 'rgba(41, 97, 254, 0.2)':(x.ColorState==2 ? 'rgba(2, 196, 153, 0.2)':(x.ColorState==3 ? 'rgba(242, 140, 29, 0.2)':'rgba(63, 196, 255, 0.2)')), background:x.ColorState==1 ? 'rgba(41, 97, 254, 0.2)':(x.ColorState==2 ? 'rgba(2, 196, 153, 0.2)':(x.ColorState==3 ? 'rgba(242, 140, 29, 0.2)':'rgba(63, 196, 255, 0.2)')),
color: x.ColorState==1 ? '#2961FE':(x.ColorState==2 ? '#02C499':(x.ColorState==3 ? '#F28C1D':'#3FC4FF'))}"> color: x.ColorState==1 ? '#2961FE':(x.ColorState==2 ? '#02C499':(x.ColorState==3 ? '#F28C1D':'#3FC4FF'))}">
<span style="cursor: pointer" @click="goOrderdetails(item,4)">{{x.FrID}}</span> <span style="cursor: pointer" @click="goOrderdetails(item,4)">{{x.FrID}}</span>
</div> </div>
</div> </div>
<div class="row" style="justify-content: space-between"> <div class="row" style="justify-content: space-between">
<span>付款单据：</span> <span>付款单据：</span>
<q-btn flat size="xs" icon="edit" v-if="isShowClass" style="font-weight:400;color: #02C499" label="修改" @click="chanceType(item,2)" /> <q-btn flat size="xs" icon="edit" v-if="isShowClass" style="font-weight:400;color: #02C499" label="修改"
</div> @click="chanceType(item,2)" />
<div class="row wrap"> </div>
<div class="finance row" v-for="(x,j) in item.RefundFinanceList" :index="j" :style="{ <div class="row wrap">
<div class="finance row" v-for="(x,j) in item.RefundFinanceList" :index="j"
:style="{
background:x.ColorState==1 ? 'rgba(41, 97, 254, 0.2)':(x.ColorState==2 ? 'rgba(2, 196, 153, 0.2)':(x.ColorState==3 ? 'rgba(242, 140, 29, 0.2)':'rgba(63, 196, 255, 0.2)')), background:x.ColorState==1 ? 'rgba(41, 97, 254, 0.2)':(x.ColorState==2 ? 'rgba(2, 196, 153, 0.2)':(x.ColorState==3 ? 'rgba(242, 140, 29, 0.2)':'rgba(63, 196, 255, 0.2)')),
color: x.ColorState==1 ? '#2961FE':(x.ColorState==2 ? '#02C499':(x.ColorState==3 ? '#F28C1D':'#3FC4FF'))}"> color: x.ColorState==1 ? '#2961FE':(x.ColorState==2 ? '#02C499':(x.ColorState==3 ? '#F28C1D':'#3FC4FF'))}">
<span style="cursor: pointer" @click="goOrderdetails(item,4)">{{x.FrID}}</span> <span style="cursor: pointer" @click="goOrderdetails(item,4)">{{x.FrID}}</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</td> </td>
</tr> </tr>
</tbody> </tbody>
<!--取消订单--> <!--取消订单-->
</table> </table>
<!--修改订单--> <!--修改订单-->
<editorder-form v-if="isShowEditOrderForm" :save-obj="orderObj" @close="closeOrderSaveForm" @success="refreshClassOrder"></editorder-form> <editorder-form v-if="isShowEditOrderForm" :save-obj="orderObj" @close="closeOrderSaveForm"
@success="refreshClassOrder"></editorder-form>
<!--修改订单备注--> <!--修改订单备注-->
<orderremark-form v-if="isShowRemarkOrderForm" :save-obj="orderObj" :remarkType="remarkType" @close="closeRemarkForm" @success="refreshClassOrder"></orderremark-form> <orderremark-form v-if="isShowRemarkOrderForm" :save-obj="orderObj" :remarkType="remarkType"
@close="closeRemarkForm" @success="refreshClassOrder"></orderremark-form>
<!--转交订单--> <!--转交订单-->
<transOrder-form v-if="isShowTransOrderForm" :save-obj="orderObj" :employeeList="EmployeeList" @close="closeTransOrderForm" @success="refreshClassOrder"></transOrder-form> <transOrder-form v-if="isShowTransOrderForm" :save-obj="orderObj" :employeeList="EmployeeList"
@close="closeTransOrderForm" @success="refreshClassOrder"></transOrder-form>
<myOrder-form v-if="isShowmyorderForm" :save-obj="myorderObjOption" @close="closeMOSaveForm"></myOrder-form> <myOrder-form v-if="isShowmyorderForm" :save-obj="myorderObjOption" @close="closeMOSaveForm"></myOrder-form>
<!--班级详情--> <!--班级详情-->
<classinfo-form v-if="isShowClassInfo" :seting-obj="classObjOption" @close="closeClass" @success="refreshClass"> <classinfo-form v-if="isShowClassInfo" :seting-obj="classObjOption" @close="closeClass" @success="refreshClass">
</classinfo-form> </classinfo-form>
<!--退课申请--> <!--退课申请-->
<backclass-form v-if="isShowBackClassForm" :save-obj="orderObj" @close="closeBackClassForm" @success="refreshClassOrder"></backclass-form> <backclass-form v-if="isShowBackClassForm" :save-obj="orderObj" @close="closeBackClassForm"
@success="refreshClassOrder"></backclass-form>
<!-- 修改提成和额外奖励 --> <!-- 修改提成和额外奖励 -->
<money-form v-if="isShowMoney" :data="moneyObj" :type="CommonType" @close="closeMoneyForm" @success="refreshMoney"></money-form> <money-form v-if="isShowMoney" :data="moneyObj" :type="CommonType" @close="closeMoneyForm" @success="refreshMoney">
</div> </money-form>
</div>
</template> </template>
<script> <script>
import editorderForm from '../sale/editorder-form' //修改订单 import editorderForm from '../sale/editorder-form' //修改订单
import orderremarkForm from '../sale/orderremark-form' //订单备注 import orderremarkForm from '../sale/orderremark-form' //订单备注
import transOrderForm from '../sale/transOrder-form' //转交订单 import transOrderForm from '../sale/transOrder-form' //转交订单
import backclassForm from '../sale/backclass-form' //退课申请 import backclassForm from '../sale/backclass-form' //退课申请
import moneyForm from '../sale/money-form' //修改提成和额外奖励 import moneyForm from '../sale/money-form' //修改提成和额外奖励
import { import {
cancelClassOrder, //取消订单 cancelClassOrder, //取消订单
} from '../../api/sale/sale' } from '../../api/sale/sale'
import myOrderForm from '../../components/sale/myOrder-form' import myOrderForm from '../../components/sale/myOrder-form'
import classinfoForm from '../../components/course/classinfo-form'; import classinfoForm from '../../components/course/classinfo-form';
import { import {
queryEmployee //员工列表 queryEmployee //员工列表
} from '../../api/users/user' } from '../../api/users/user'
export default { export default {
components: { components: {
editorderForm, editorderForm,
orderremarkForm, orderremarkForm,
transOrderForm, transOrderForm,
myOrderForm, myOrderForm,
classinfoForm, classinfoForm,
backclassForm, backclassForm,
moneyForm moneyForm
}, },
props: { props: {
//正常订单 //正常订单
dataList: { dataList: {
type: Array, type: Array,
default: null default: null
}, },
//取消订单 //取消订单
cancelList: { cancelList: {
type: Array, type: Array,
default: null default: null
}, },
isShowClass: { isShowClass: {
type: Boolean type: Boolean
}, },
Comtype: { Comtype: {
type:Number type: Number
} }
}, },
data() { data() {
return { return {
isShowEditOrderForm: false, //是否显示订单修改 isShowEditOrderForm: false, //是否显示订单修改
isShowRemarkOrderForm: false, //是否线下修改订单备注 isShowRemarkOrderForm: false, //是否线下修改订单备注
isShowTransOrderForm: false, //是否显示转交订单 isShowTransOrderForm: false, //是否显示转交订单
isShowBackClassForm: false, //是否显示退课申请 isShowBackClassForm: false, //是否显示退课申请
orderObj: {}, //订单信息 isShowContinueClass: false, //是否显示续课申请
isShowCancel: false, //是否显示取消订单 orderObj: {}, //订单信息
remarkType: 0, //备注类型 isShowCancel: false, //是否显示取消订单
isShowmyorderForm: false, //显示详情 remarkType: 0, //备注类型
myorderObjOption: {}, //详情的数据 isShowmyorderForm: false, //显示详情
classObjOption: null, myorderObjOption: {}, //详情的数据
isShowClassInfo: false, //是否显示课程信息 classObjOption: null,
isShowMoney: false, //是否显示修改提成和额外奖励 isShowClassInfo: false, //是否显示课程信息
moneyObj: {}, isShowMoney: false, //是否显示修改提成和额外奖励
CommonType: -1, //用于判断是修改提成还是额外奖励 moneyObj: {},
EmployeeList: [], //员工列表 CommonType: -1, //用于判断是修改提成还是额外奖励
} EmployeeList: [], //员工列表
}
}, },
created() { created() {
this.Employee() this.Employee()
}, },
mounted() {}, mounted() {},
methods: { methods: {
getTkshow(data){ getTkshow(data) {
let Tkshow=false; let Tkshow = false;
if(data.length>0){ if (data.length > 0) {
data.forEach(x=>{ data.forEach(x => {
if(x.GuestState==2){ if (x.GuestState == 2) {
Tkshow=true Tkshow = true
} }
}); });
} }
return Tkshow return Tkshow
}, },
//显示退课申请 //显示续课申请
showBackClassForm(item) { showContinueClass(item) {
this.orderObj = item; this.orderObj = item;
this.isShowBackClassForm = true; this.isShowContinueClass = true;
}, },
//关闭退课申请 //显示退课申请
closeBackClassForm() { showBackClassForm(item) {
this.orderObj = {}; this.orderObj = item;
this.isShowBackClassForm = false; this.isShowBackClassForm = true;
}, },
Employee() { //关闭退课申请
var qMsg = { closeBackClassForm() {
EmployeeName: '' this.orderObj = {};
} this.isShowBackClassForm = false;
queryEmployee(qMsg).then(res => { },
if (res.Code == 1) { Employee() {
this.EmployeeList = res.Data; var qMsg = {
} EmployeeName: ''
}).catch(() => { }
queryEmployee(qMsg).then(res => {
}) if (res.Code == 1) {
}, this.EmployeeList = res.Data;
//获取财务单据 }
getOrderFinanceList(msg, type) { }).catch(() => {
this.apipost('sellorder_post_GetOrderFinanceListForEdu', {
OrderIds: msg })
}, res => { },
if (res.data.resultCode === 1) { //获取财务单据
let data = res.data.data; getOrderFinanceList(msg, type) {
if (type == 1) { this.apipost('sellorder_post_GetOrderFinanceListForEdu', {
if (this.dataList) { OrderIds: msg
this.dataList.forEach(x => { }, res => {
data.forEach(j => { if (res.data.resultCode === 1) {
if (x.OrderId == j.OrderId) { let data = res.data.data;
x.FinanceList = j.FinanceList if (type == 1) {
x.RefundFinanceList = j.RefundFinanceList if (this.dataList) {
} this.dataList.forEach(x => {
}) data.forEach(j => {
}) if (x.OrderId == j.OrderId) {
} x.FinanceList = j.FinanceList
} else if (type == 2) { x.RefundFinanceList = j.RefundFinanceList
if (this.cancelList.length > 0) {
this.cancelList.forEach(x => {
data.forEach(j => {
if (x.OrderId == j.OrderId) {
x.FinanceList = j.FinanceList
x.RefundFinanceList = j.RefundFinanceList
}
})
})
}
} }
this.$forceUpdate() })
} else { })
this.$message.error(res.data.message); }
} } else if (type == 2) {
}, err => {}) if (this.cancelList.length > 0) {
}, this.cancelList.forEach(x => {
goOrderdetails(item, tab) { data.forEach(j => {
item.tab = tab if (x.OrderId == j.OrderId) {
this.myorderObjOption = item; x.FinanceList = j.FinanceList
this.isShowmyorderForm = true; x.RefundFinanceList = j.RefundFinanceList
},
closeMOSaveForm() {
this.isShowmyorderForm = false;
},
//订单转交
transferOrder(item, type) {
item.type = type
this.orderObj = item;
this.isShowTransOrderForm = true;
},
//关闭转订单弹窗
closeTransOrderForm() {
this.isShowTransOrderForm = false;
},
//跳转到学生名单
gostudent(item) {
var tempStr = '/sale/studentList?OrderId=' + item.OrderId + '&ClassId=' + item.ClassId;
this.$router.push({
path: tempStr,
query: {
isShow: this.Comtype
}
});
},
//修改订单备注
editOrderRemark(item, Type) {
this.orderObj = item;
this.remarkType = Type;
this.isShowRemarkOrderForm = true;
},
//关闭备注
closeRemarkForm() {
this.isShowRemarkOrderForm = false;
},
//关闭订单修改
closeOrderSaveForm() {
this.isShowEditOrderForm = false;
},
//显示修改订单
editOrder(item) {
this.orderObj = item;
this.isShowEditOrderForm = true;
},
//刷新页面
refreshClassOrder() {
this.isShowEditOrderForm = false;
//调用父页面成功方法
this.$emit('success');
},
//关闭修改提成和额外奖励
closeMoneyForm() {
this.moneyObj = {};
this.isShowMoney = false;
},
//修改提成和额外奖励后刷新
refreshMoney() {
this.isShowMoney = false;
this.$emit('success');
},
//取消订单
CancelOrder(item) {
let that = this
this.$q.dialog({
title: '提示信息',
message: '<span style="color: #f5576c">是否取消此订单</span>',
cancel: true,
persistent: true,
html: true,
ok: "确定",
cancel: "取消",
}).onOk(() => {
cancelClassOrder({
OrderId: item.OrderId
}).then(res => {
if (res.Code == 1) {
that.$q.notify({
icon: 'iconfont icon-chenggong',
color: 'accent',
timeout: 2000,
message: '操作成功',
position: 'top'
})
//调用父页面成功方法
this.$emit('success');
} }
})
}) })
}).onCancel(() => { }
});
},
chanceType(obj, type) {
let TCIDARR = []
TCIDARR.push(obj.ClassId)
let orderObj = {
OrderID: obj.OrderId,
OrderSource: 17,
Obj: {},
SourceID: 0,
TCIDList: TCIDARR
} }
this.$router.push({ this.$forceUpdate()
path: '/financial/financalDocument/ChoiceAddFinancialDocuments', } else {
query: { this.$message.error(res.data.message);
"Type": type, }
"companyID": obj.ClassSchoolId, }, err => {})
"path": "", },
'blank': 'y', goOrderdetails(item, tab) {
'orderObj': JSON.stringify(orderObj), item.tab = tab
'tradeWay': obj.tradeWay, this.myorderObjOption = item;
} this.isShowmyorderForm = true;
}); },
}, closeMOSaveForm() {
getClassInfo(obj) { //打开班级详情组件 this.isShowmyorderForm = false;
this.classObjOption = obj; },
this.classObjOption.School_Id = this.classObjOption.ClassSchoolId //订单转交
this.isShowClassInfo = true; transferOrder(item, type) {
}, item.type = type
//关闭班级信息弹窗 this.orderObj = item;
closeClass() { this.isShowTransOrderForm = true;
this.isShowClassInfo = false },
}, //关闭转订单弹窗
//刷新 closeTransOrderForm() {
refreshClass() { this.isShowTransOrderForm = false;
},
}, //跳转到学生名单
//修改提成-奖励 gostudent(item) {
upDateMoney(item, type) { var tempStr = '/sale/studentList?OrderId=' + item.OrderId + '&ClassId=' + item.ClassId;
this.moneyObj = item; this.$router.push({
this.CommonType = type; path: tempStr,
this.isShowMoney = true; query: {
isShow: this.Comtype
}
});
},
//修改订单备注
editOrderRemark(item, Type) {
this.orderObj = item;
this.remarkType = Type;
this.isShowRemarkOrderForm = true;
},
//关闭备注
closeRemarkForm() {
this.isShowRemarkOrderForm = false;
},
//关闭订单修改
closeOrderSaveForm() {
this.isShowEditOrderForm = false;
},
//显示修改订单
editOrder(item) {
this.orderObj = item;
this.isShowEditOrderForm = true;
},
//刷新页面
refreshClassOrder() {
this.isShowEditOrderForm = false;
//调用父页面成功方法
this.$emit('success');
},
//关闭修改提成和额外奖励
closeMoneyForm() {
this.moneyObj = {};
this.isShowMoney = false;
},
//修改提成和额外奖励后刷新
refreshMoney() {
this.isShowMoney = false;
this.$emit('success');
},
//取消订单
CancelOrder(item) {
let that = this
this.$q.dialog({
title: '提示信息',
message: '<span style="color: #f5576c">是否取消此订单</span>',
cancel: true,
persistent: true,
html: true,
ok: "确定",
cancel: "取消",
}).onOk(() => {
cancelClassOrder({
OrderId: item.OrderId
}).then(res => {
if (res.Code == 1) {
that.$q.notify({
icon: 'iconfont icon-chenggong',
color: 'accent',
timeout: 2000,
message: '操作成功',
position: 'top'
})
//调用父页面成功方法
this.$emit('success');
}
})
}).onCancel(() => {
});
},
chanceType(obj, type) {
let TCIDARR = []
TCIDARR.push(obj.ClassId)
let orderObj = {
OrderID: obj.OrderId,
OrderSource: 17,
Obj: {},
SourceID: 0,
TCIDList: TCIDARR
} }
this.$router.push({
path: '/financial/financalDocument/ChoiceAddFinancialDocuments',
query: {
"Type": type,
"companyID": obj.ClassSchoolId,
"path": "",
'blank': 'y',
'orderObj': JSON.stringify(orderObj),
'tradeWay': obj.tradeWay,
}
});
},
getClassInfo(obj) { //打开班级详情组件
this.classObjOption = obj;
this.classObjOption.School_Id = this.classObjOption.ClassSchoolId
this.isShowClassInfo = true;
},
//关闭班级信息弹窗
closeClass() {
this.isShowClassInfo = false
},
//刷新
refreshClass() {
},
//修改提成-奖励
upDateMoney(item, type) {
this.moneyObj = item;
this.CommonType = type;
this.isShowMoney = true;
}
} }
} }
</script> </script>
<style> <style>
li { li {
list-style-type: none; list-style-type: none;
} }
.classorder ul { .classorder ul {
padding: 0px padding: 0px
} }
.classorder .price-popup { .classorder .price-popup {
border-radius: 4px; border-radius: 4px;
} }
.classorder .el-range-editor .el-range-input { .classorder .el-range-editor .el-range-input {
background: none; background: none;
} }
.classorder .el-range-editor.el-input__inner { .classorder .el-range-editor.el-input__inner {
background-color: transparent; background-color: transparent;
} }
.classorder .q-mb-md { .classorder .q-mb-md {
margin-bottom: 0; margin-bottom: 0;
} }
.classorder .stics { .classorder .stics {
padding: 10px 20px; padding: 10px 20px;
background: #DDDEE0; background: #DDDEE0;
border-radius: 4px; border-radius: 4px;
font-size: 14px; font-size: 14px;
color: #000000; color: #000000;
font-weight: bold font-weight: bold
} }
.classorder .stics .stics-name { .classorder .stics .stics-name {
color: #2D2D2D; color: #2D2D2D;
font-weight: 600; font-weight: 600;
margin-right: 10px margin-right: 10px
} }
.classorder .tis { .classorder .tis {
margin: 10px 0; margin: 10px 0;
align-items: center align-items: center
} }
.classorder .tis .tis-k { .classorder .tis .tis-k {
width: 10px; width: 10px;
height: 10px; height: 10px;
margin-right: 8px margin-right: 8px
} }
.classorder .tis span { .classorder .tis span {
font-size: 14px; font-size: 14px;
color: #2D2D2D; color: #2D2D2D;
font-weight: 600; font-weight: 600;
margin-right: 20px margin-right: 20px
} }
.classorder table { .classorder table {
padding: 10px 0; padding: 10px 0;
width: 100%; width: 100%;
background-color: #ededed; background-color: #ededed;
border-collapse: collapse; border-collapse: collapse;
border: 1px solid #d2d2d2; border: 1px solid #d2d2d2;
font-size: 12px; font-size: 12px;
} }
.classorder table th { .classorder table th {
background-color: #ededed; background-color: #ededed;
height: 34px; height: 34px;
text-indent: 15px; text-indent: 15px;
} }
.classorder table td { .classorder table td {
background-color: #ffffff; background-color: #ffffff;
padding: 9px 15px; padding: 9px 15px;
color: #333333; color: #333333;
border: 1px solid rgba(138, 138, 138, 0.09); border: 1px solid rgba(138, 138, 138, 0.09);
text-align: center; text-align: center;
} }
.classorder table ._color_666 { .classorder table ._color_666 {
color: #666666; color: #666666;
} }
.classorder table tr._color_666 th { .classorder table tr._color_666 th {
padding: 9px 15px; padding: 9px 15px;
} }
.classorder table th { .classorder table th {
background-color: #ededed; background-color: #ededed;
height: 34px; height: 34px;
text-indent: 15px; text-indent: 15px;
} }
.classorder table td { .classorder table td {
background-color: #ffffff; background-color: #ffffff;
padding: 9px 15px; padding: 9px 15px;
color: #333333; color: #333333;
/*border: 1px solid #d2d2d2;*/ /*border: 1px solid #d2d2d2;*/
} }
.classorder table ._color_666 { .classorder table ._color_666 {
color: #666666; color: #666666;
} }
.classorder table tr._color_666 th { .classorder table tr._color_666 th {
padding: 9px 15px; padding: 9px 15px;
} }
.classorder .enrollTotalSearchTable { .classorder .enrollTotalSearchTable {
width: 100%; width: 100%;
font-size: 14px; font-size: 14px;
color: #333; color: #333;
border-bottom: 1px solid #cccccc; border-bottom: 1px solid #cccccc;
border-right: 1px solid #cccccc; border-right: 1px solid #cccccc;
border-collapse: collapse; border-collapse: collapse;
} }
.classorder .enrollTotalSearchTable tr { .classorder .enrollTotalSearchTable tr {
/* border-bottom: 2px solid #333; */ /* border-bottom: 2px solid #333; */
} }
.classorder .enrollTotalSearchTable tr th { .classorder .enrollTotalSearchTable tr th {
background: #DDDEE0; background: #DDDEE0;
height: 30px; height: 30px;
font-size: 12px; font-size: 12px;
text-align: center; text-align: center;
} }
.classorder .enrollTotalSearchTable tr { .classorder .enrollTotalSearchTable tr {
background: #fff; background: #fff;
text-align: left; text-align: left;
} }
.classorder .enrollTotalSearchTable tbody tr:last-child { .classorder .enrollTotalSearchTable tbody tr:last-child {
border-bottom: 2px solid #333; border-bottom: 2px solid #333;
} }
.classorder .enrollTotalSearchTable tr:first-child td:first-child { .classorder .enrollTotalSearchTable tr:first-child td:first-child {
border-bottom: 2px solid #333; border-bottom: 2px solid #333;
} }
.classorder .enrollTotalSearchTable tr td { .classorder .enrollTotalSearchTable tr td {
height: 66px; height: 66px;
padding: 10px; padding: 10px;
/*border-top: 1px solid #cccccc;*/ /*border-top: 1px solid #cccccc;*/
/*border-left: 1px solid #cccccc;*/ /*border-left: 1px solid #cccccc;*/
} }
.classorder .enrollTotalSearchTable tr td>img { .classorder .enrollTotalSearchTable tr td>img {
width: 32px; width: 32px;
height: 32px; height: 32px;
border-radius: 16px; border-radius: 16px;
vertical-align: middle; vertical-align: middle;
margin-right: 5px; margin-right: 5px;
} }
.classorder .enrollTotalSearchTable tr td p { .classorder .enrollTotalSearchTable tr td p {
line-height: 20px; line-height: 20px;
} }
.classorder .remarks { .classorder .remarks {
font-size: 14px; font-size: 14px;
color: #2D2D2D; color: #2D2D2D;
} }
.classorder .remarks-b { .classorder .remarks-b {
width: 100%; width: 100%;
height: 94px; height: 94px;
background: #F0F5FB; background: #F0F5FB;
...@@ -916,24 +964,25 @@ li { ...@@ -916,24 +964,25 @@ li {
line-height: 20px; line-height: 20px;
-webkit-line-clamp: 4; -webkit-line-clamp: 4;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
} }
.classorder .remarks-b-b { .classorder .remarks-b-b {
text-align: right; text-align: right;
position: absolute; position: absolute;
right: 0px; right: 0px;
bottom: 0px bottom: 0px
} }
.classorder .on-left { .classorder .on-left {
margin-right: 5px; margin-right: 5px;
} }
.classorder .finance { .classorder .finance {
padding: 1px 10px; padding: 1px 10px;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-radius: 4px; border-radius: 4px;
margin: 5px 3px 3px 0; margin: 5px 3px 3px 0;
} }
</style> </style>
src/layouts/MainLayout.vue
View file @ 3f3ad493
<template> <template>
<q-layout view="lHh Lpr lFf"> <q-layout view="lHh Lpr lFf">
<q-header bordered reveal height-hint="98" class="head-bg"> <q-header bordered reveal height-hint="98" class="head-bg">
<q-toolbar style="height:60px;" class="q-pr-lg q-pl-lg"> <q-toolbar style="height:60px;" class="q-pr-lg q-pl-lg">
<q-avatar style="width:38px"> <q-avatar style="width:38px">
<img :src="logo"> <img :src="logo">
</q-avatar> </q-avatar>
<q-toolbar-title style="font-family:perfectFont;margin-right:50px"> <q-toolbar-title style="font-family:perfectFont;margin-right:50px">
{{name}} {{name}}
</q-toolbar-title> </q-toolbar-title>
<q-tabs v-model="tab" @input="changeNavs" inline-label style="margin:0 auto; font-family:perfectFont;height:60px;flex:1;justify-content: left;" class="text-white" shrink stretch v-if="userInfo"> <q-tabs v-model="tab" @input="changeNavs" inline-label
<q-tab v-for="(x, i) in userInfo.MenuList" class="q-mr-md" :key="i" @click="setNavs(i)" :name="`navs_${i}`" :label="x.MenuName" :icon="x.MenuIcon" /> style="margin:0 auto; font-family:perfectFont;height:60px;flex:1;justify-content: left;" class="text-white"
</q-tabs> shrink stretch v-if="userInfo">
<div class="q-pl-lg"> <q-tab v-for="(x, i) in userInfo.MenuList" class="q-mr-md" :key="i" @click="setNavs(i)" :name="`navs_${i}`"
<q-btn-dropdown flat color="primary" size="xs"> :label="x.MenuName" :icon="x.MenuIcon" />
<template v-slot:label> </q-tabs>
<q-icon left name="iconfont icon-message" class="text-white" style="font-size:20px;"> <div class="q-pl-lg">
<q-badge color="negative" floating>4</q-badge> <q-btn-dropdown flat color="primary" size="xs">
</q-icon> <template v-slot:label>
</template> <q-icon left name="iconfont icon-message" class="text-white" style="font-size:20px;">
<q-list bordered padding class="rounded-borders" style="max-width: 350px"> <q-badge color="negative" floating>4</q-badge>
<q-item-label header>Folders</q-item-label> </q-icon>
</template>
<q-item clickable v-ripple> <q-list bordered padding class="rounded-borders" style="max-width: 350px">
<q-item-section avatar top> <q-item-label header>Folders</q-item-label>
<q-avatar icon="folder" color="primary" text-color="white" /> <q-item clickable v-ripple>
</q-item-section> <q-item-section avatar top>
<q-avatar icon="folder" color="primary" text-color="white" />
<q-item-section> </q-item-section>
<q-item-label lines="1">Photos</q-item-label> <q-item-section>
<q-item-label caption>February 22nd, 2019</q-item-label> <q-item-label lines="1">Photos</q-item-label>
</q-item-section> <q-item-label caption>February 22nd, 2019</q-item-label>
</q-item-section>
<q-item-section side> <q-item-section side>
<q-icon name="info" color="green" /> <q-icon name="info" color="green" />
</q-item-section> </q-item-section>
</q-item> </q-item>
<q-item clickable v-ripple>
<q-item clickable v-ripple> <q-item-section avatar top>
<q-item-section avatar top> <q-avatar icon="folder" color="orange" text-color="white" />
<q-avatar icon="folder" color="orange" text-color="white" /> </q-item-section>
</q-item-section> <q-item-section>
<q-item-label lines="1">Movies</q-item-label>
<q-item-section> <q-item-label caption>March 1st, 2019</q-item-label>
<q-item-label lines="1">Movies</q-item-label> </q-item-section>
<q-item-label caption>March 1st, 2019</q-item-label> <q-item-section side>
</q-item-section> <q-icon name="info" />
</q-item-section>
<q-item-section side> </q-item>
<q-icon name="info" /> <q-item clickable v-ripple>
</q-item-section> <q-item-section avatar top>
</q-item> <q-avatar icon="folder" color="teal" text-color="white" />
</q-item-section>
<q-item clickable v-ripple> <q-item-section>
<q-item-section avatar top> <q-item-label lines="1">Photos</q-item-label>
<q-avatar icon="folder" color="teal" text-color="white" /> <q-item-label caption>January 15th, 2019</q-item-label>
</q-item-section> </q-item-section>
<q-item-section side>
<q-item-section> <q-icon name="info" />
<q-item-label lines="1">Photos</q-item-label> </q-item-section>
<q-item-label caption>January 15th, 2019</q-item-label> </q-item>
</q-item-section> <q-separator spaced />
<q-item-label header>Files</q-item-label>
<q-item-section side> <q-item clickable v-ripple>
<q-icon name="info" /> <q-item-section avatar top>
</q-item-section> <q-avatar icon="assignment" color="grey" text-color="white" />
</q-item> </q-item-section>
<q-item-section>
<q-separator spaced /> <q-item-label lines="1">Expenses spreadsheet</q-item-label>
<q-item-label header>Files</q-item-label> <q-item-label caption>March 2nd, 2019</q-item-label>
</q-item-section>
<q-item clickable v-ripple> <q-item-section side>
<q-item-section avatar top> <q-icon name="info" />
<q-avatar icon="assignment" color="grey" text-color="white" /> </q-item-section>
</q-item-section> </q-item>
<q-item clickable v-ripple>
<q-item-section> <q-item-section avatar top>
<q-item-label lines="1">Expenses spreadsheet</q-item-label> <q-avatar icon="place" color="grey" text-color="white" />
<q-item-label caption>March 2nd, 2019</q-item-label> </q-item-section>
</q-item-section> <q-item-section>
<q-item-label lines="1">Places to visit</q-item-label>
<q-item-section side> <q-item-label caption>February 22, 2019</q-item-label>
<q-icon name="info" /> </q-item-section>
</q-item-section> <q-item-section side>
</q-item> <q-icon name="info" color="amber" />
</q-item-section>
<q-item clickable v-ripple> </q-item>
<q-item-section avatar top> <q-item clickable v-ripple>
<q-avatar icon="place" color="grey" text-color="white" /> <q-item-section avatar top>
</q-item-section> <q-avatar icon="library_music" color="grey" text-color="white" />
</q-item-section>
<q-item-section> <q-item-section>
<q-item-label lines="1">Places to visit</q-item-label> <q-item-label lines="1">My favorite song</q-item-label>
<q-item-label caption>February 22, 2019</q-item-label> <q-item-label caption>Singing it all day</q-item-label>
</q-item-section> </q-item-section>
<q-item-section side>
<q-item-section side> <q-icon name="info" />
<q-icon name="info" color="amber" /> </q-item-section>
</q-item-section> </q-item>
</q-item> </q-list>
</q-btn-dropdown>
<q-item clickable v-ripple> <q-btn-dropdown flat color="primary" size="xs" v-if="userInfo">
<q-item-section avatar top> <template v-slot:label>
<q-avatar icon="library_music" color="grey" text-color="white" /> <q-avatar size="28px">
</q-item-section> <img :src="userInfo.UserIcon">
</q-avatar>
<q-item-section> </template>
<q-item-label lines="1">My favorite song</q-item-label> <div class="row no-wrap q-pa-md">
<q-item-label caption>Singing it all day</q-item-label> <div class="column">
</q-item-section> <div class="text-h6 q-mb-md">Settings</div>
<q-toggle label="Use Mobile Data" />
<q-item-section side> <q-toggle label="Bluetooth" />
<q-icon name="info" /> </div>
</q-item-section> <q-separator vertical inset class="q-mx-lg" />
</q-item> <div class="column items-center">
</q-list> <q-avatar size="72px">
</q-btn-dropdown> <img :src="userInfo.UserIcon">
<q-btn-dropdown flat color="primary" size="xs" v-if="userInfo"> </q-avatar>
<template v-slot:label> <div class="text-subtitle1 q-mt-md q-mb-xs">{{userInfo.AccountName}}</div>
<q-avatar size="28px"> <q-btn color="primary" label="登出系统" push size="sm" v-close-popup @click="logout" />
<img :src="userInfo.UserIcon"> </div>
</q-avatar>
</template>
<div class="row no-wrap q-pa-md">
<div class="column">
<div class="text-h6 q-mb-md">Settings</div>
<q-toggle label="Use Mobile Data" />
<q-toggle label="Bluetooth" />
</div>
<q-separator vertical inset class="q-mx-lg" />
<div class="column items-center">
<q-avatar size="72px">
<img :src="userInfo.UserIcon">
</q-avatar>
<div class="text-subtitle1 q-mt-md q-mb-xs">{{userInfo.AccountName}}</div>
<q-btn color="primary" label="登出系统" push size="sm" v-close-popup @click="logout" />
</div>
</div>
</q-btn-dropdown>
</div> </div>
</q-toolbar> </q-btn-dropdown>
</div>
</q-toolbar>
</q-header> </q-header>
<q-page-container class="window-height"> <q-page-container class="window-height">
<div class="row items-stretch full-height"> <div class="row items-stretch full-height">
<div style="box-shadow: 2px 0 10px 0 rgba(237,238,240,0.50);font-family:perfectFont;" class="text-subtitle2 second-menu-bg" :style="{'width':isExpend?'40px':'180px'}" v-if="secondNavs && secondNavs.length>0"> <div style="box-shadow: 2px 0 10px 0 rgba(237,238,240,0.50);font-family:perfectFont;"
<div class="full-width left-menu-box q-pt-md"> class="text-subtitle2 second-menu-bg" :style="{'width':isExpend?'40px':'180px'}"
<q-list style="width:180px;overflow:hidden"> v-if="secondNavs && secondNavs.length>0">
<template v-for="(x,i) in secondNavs"> <div class="full-width left-menu-box q-pt-md">
<q-item :to="x.MenuUrl" clickable v-ripple :active="currentPath==x.MenuUrl" v-if="x.SubList.length==0" :key="i"> <q-list style="width:180px;overflow:hidden">
<q-item-section avatar> <template v-for="(x,i) in secondNavs">
<q-icon :name="x.MenuIcon" size="20px" /> <q-item :to="x.MenuUrl" clickable v-ripple :active="currentPath==x.MenuUrl" v-if="x.SubList.length==0"
</q-item-section> :key="i">
<q-item-section>{{x.MenuName}}</q-item-section> <q-item-section avatar>
</q-item> <q-icon :name="x.MenuIcon" size="20px" />
<q-expansion-item expand-separator v-else :label="x.MenuName"> </q-item-section>
<q-item :to="y.MenuUrl" clickable v-ripple :active="currentPath==y.MenuUrl" v-for="(y, yi) in x.SubList" :key="yi"> <q-item-section>{{x.MenuName}}</q-item-section>
<q-item-section avatar style="padding-right:0;min-width:40px;"> </q-item>
<q-icon :name="y.MenuIcon" size="20px" /> <q-expansion-item expand-separator v-else :label="x.MenuName">
</q-item-section> <q-item :to="y.MenuUrl" clickable v-ripple :active="currentPath==y.MenuUrl"
<q-item-section>{{y.MenuName}}</q-item-section> v-for="(y, yi) in x.SubList" :key="yi">
</q-item> <q-item-section avatar style="padding-right:0;min-width:40px;">
</q-expansion-item> <q-icon :name="y.MenuIcon" size="20px" />
</template> </q-item-section>
</q-list> <q-item-section>{{y.MenuName}}</q-item-section>
</div> </q-item>
</q-expansion-item>
</div> </template>
<div class="col" style="background: #f2f4f7;"> </q-list>
<q-scroll-area class="fit" :thumb-style="thumbStyle" :bar-style="barStyle" visible style=""> </div>
<router-view style="margin:20px" />
</q-scroll-area>
</div>
</div> </div>
<div class="col" style="background: #f2f4f7;">
<q-scroll-area class="fit" :thumb-style="thumbStyle" :bar-style="barStyle" visible style="">
<router-view style="margin:20px" />
</q-scroll-area>
</div>
</div>
</q-page-container> </q-page-container>
</q-layout> </q-layout>
</template> </template>
<script> <script>
import EssentialLink from 'components/EssentialLink.vue' import EssentialLink from 'components/EssentialLink.vue'
import { import {
mapGetters mapGetters
} from 'vuex' } from 'vuex'
import lockr from 'lockr' import lockr from 'lockr'
export default { export default {
name: 'MainLayout', name: 'MainLayout',
components: { components: {
EssentialLink EssentialLink
}, },
data() { data() {
return { return {
leftDrawerOpen: false, leftDrawerOpen: false,
//essentialLinks: linksData //essentialLinks: linksData
tab: "navs_0", tab: "navs_0",
currentPath: "", currentPath: "",
secondNavs: [], secondNavs: [],
thumbStyle: { thumbStyle: {
right: '0px', right: '0px',
borderRadius: '0px', borderRadius: '0px',
backgroundColor: '#1d1d1d', backgroundColor: '#1d1d1d',
width: '6px', width: '6px',
opacity: 1 opacity: 1
}, },
barStyle: { barStyle: {
right: '0px', right: '0px',
borderRadius: '0px', borderRadius: '0px',
backgroundColor: '#999', backgroundColor: '#999',
width: '6px', width: '6px',
opacity: 0.5 opacity: 0.5
}, },
contentStyle2: { contentStyle2: {
backgroundColor: 'rgba(0,0,0,0.02)', backgroundColor: 'rgba(0,0,0,0.02)',
color: '#555' color: '#555'
}, },
isExpend:false, isExpend: false,
contentActiveStyle2: { contentActiveStyle2: {
backgroundColor: '#eee', backgroundColor: '#eee',
color: 'black' color: 'black'
}, },
thumbStyle2: {
thumbStyle2: { right: '0px',
right: '0px', borderRadius: '5px',
borderRadius: '5px', backgroundColor: '#027be3',
backgroundColor: '#027be3', width: '5px',
width: '5px', opacity: 0.75
opacity: 0.75
}
} }
}
}, },
watch: { watch: {
$route: { $route: {
handler: function (route) { handler: function (route) {
this.currentPath = route.path this.currentPath = route.path
},
immediate: true
}, },
userInfo: { immediate: true
handler: function (newVal) { },
let i = this.tab.split('_')[1] userInfo: {
if (newVal && newVal.MenuList) { handler: function (newVal) {
this.secondNavs = newVal.MenuList.length > 0 ? newVal.MenuList[i].SubList : [] let i = this.tab.split('_')[1]
} if (newVal && newVal.MenuList) {
}, this.secondNavs = newVal.MenuList.length > 0 ? newVal.MenuList[i].SubList : []
immediate: true }
} },
immediate: true
}
}, },
computed: { computed: {
...mapGetters([ ...mapGetters([
'userInfo', 'userInfo',
'logo', 'logo',
'name' 'name'
]), ]),
}, },
mounted() { mounted() {
let i = 0 let i = 0
if (sessionStorage.getItem("current_navs")) { if (sessionStorage.getItem("current_navs")) {
i = sessionStorage.getItem("current_navs") i = sessionStorage.getItem("current_navs")
} }
this.tab = `navs_${i}` this.tab = `navs_${i}`
if (this.userInfo && this.userInfo.MenuList) { if (this.userInfo && this.userInfo.MenuList) {
this.secondNavs = this.userInfo.MenuList.length > 0 ? this.userInfo.MenuList[i].SubList : [] this.secondNavs = this.userInfo.MenuList.length > 0 ? this.userInfo.MenuList[i].SubList : []
} }
}, },
methods: { methods: {
logout() { logout() {
this.$store this.$store
.dispatch('LogOut') .dispatch('LogOut')
.then(() => { .then(() => {
this.$router.push('/login') this.$router.push('/login')
}) })
.catch(() => {}) .catch(() => {})
}, },
changeNavs(val) { changeNavs(val) {
let i = val.split('_')[1] let i = val.split('_')[1]
this.secondNavs = this.userInfo.MenuList[i].SubList this.secondNavs = this.userInfo.MenuList[i].SubList
}, },
setNavs(val) { setNavs(val) {
//防止页面数据丢失 //防止页面数据丢失
sessionStorage.setItem("current_navs", val) sessionStorage.setItem("current_navs", val)
this.tab = `navs_${val}` this.tab = `navs_${val}`
this.secondNavs = this.userInfo.MenuList[val].SubList this.secondNavs = this.userInfo.MenuList[val].SubList
this.$router.push({ this.$router.push({
path: this.userInfo.MenuList[val].MenuUrl path: this.userInfo.MenuList[val].MenuUrl
}) })
} }
}, },
} }
</script> </script>
<style> <style>
.full-width { .full-width {
height: 100%; height: 100%;
} }
.head-bg { .head-bg {
background-image: url('~assets/images/page/top.png'); background-image: url('~assets/images/page/top.png');
background-position: right; background-position: right;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: auto 100%; background-size: auto 100%;
} }
.second-menu-bg { .second-menu-bg {
background-image: url('~assets/images/page/left.png'); background-image: url('~assets/images/page/left.png');
background-position: bottom; background-position: bottom;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% auto; background-size: 100% auto;
height:100%; height: 100%;
} }
.hide-scrollbar { .hide-scrollbar {
scrollbar-width: 5px !important; scrollbar-width: 5px !important;
-ms-overflow-style: marquee, panner !important; -ms-overflow-style: marquee, panner !important;
} }
.suojin { .suojin {
height: 40px; height: 40px;
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background: rgba(255, 255, 255, .5); background: rgba(255, 255, 255, .5);
} }
.suojin i{
font-size: 24px; .suojin i {
color:#636363; font-size: 24px;
} color: #636363;
.left-menu-box{ }
overflow-x:hidden ;
overflow-y:auto ; .left-menu-box {
max-height: 100%; overflow-x: hidden;
height: 100%; overflow-y: auto;
background-color: rgba(255, 255, 255, 0.3); max-height: 100%;
} height: 100%;
.left-menu-box::-webkit-scrollbar { background-color: rgba(255, 255, 255, 0.3);
}
.left-menu-box::-webkit-scrollbar {
width: 4px; width: 4px;
height: 4px; height: 4px;
} }
.left-menu-box::-webkit-scrollbar-thumb { .left-menu-box::-webkit-scrollbar-thumb {
border-radius: 4px; border-radius: 4px;
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: #bbb; background: #bbb;
} }
/* .left-menu-box::-webkit-scrollbar-track { /* .left-menu-box::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
border-radius: 10px; border-radius: 10px;
background: #EDEDED; background: #EDEDED;
} */ } */
@keyframes shouqidonghua { @keyframes shouqidonghua {
from { from {
width:180px; width: 180px;
}
to {
width: 60px;
}
} }
to{
width:60px; .changeShowqidonghua {
animation: shouqidonghua 0.5s linear;
width: 60px !important;
overflow-x: hidden;
} }
}
.changeShowqidonghua{ @keyframes shouqidonghua {
animation: shouqidonghua 0.5s linear; from {
width:60px !important; width: 180px;
overflow-x: hidden; }
}
@keyframes shouqidonghua { to {
from { width: 60px;
width:180px; }
} }
to{
width:60px; .changeShowqidonghua {
animation: shouqidonghua 0.5s linear;
width: 60px !important;
overflow-x: hidden;
} }
}
.changeShowqidonghua{
animation: shouqidonghua 0.5s linear;
width:60px !important;
overflow-x: hidden;
}
</style> </style>
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