Skip to content

W
welfare
Commit c90f3a24 by 黑潮
Options

update: 样式优化

parent 7474d0c8
Showing with 84 additions and 85 deletions
src/assets/styles/component.scss
......@@ -501,27 +501,39 @@ p.cell-time {
height: 100%;
display: flex;
img {
width: 62px;
height: 62px;
width: 60px;
height: 60px;
border: 1px solid rgba(241, 243, 247, 1);
border-radius: 5px;
}
.goods-text {
margin-left: 18px;
font-size: 13px;
font-size: 14px;
color: #303133;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.goods-text-info {
color: #909399;
color: #303133;
font-size: 12px;
line-height: 16px;
}
.goods-text-name {
margin-bottom: 5px;
line-height: 16px;
line-height: 22px;
}
.goods-sku {
margin-top: 3px;
color: #909399;
}
}
.more-detail {
color: #606266;
cursor: pointer;
}
.more-detail:hover {
color: #2f54eb;
}
// 通用title
......@@ -564,4 +576,4 @@ p.cell-time {
display: flex;
justify-content: center;
align-items: center;
}
\ No newline at end of file
}
src/views/performance-manage/components/bulk-delivery-dialog.vue
<template>
<div>
<el-dialog :visible.sync="visible" title="批量发货" width="510px" @closed="$emit('close')">
<el-dialog :visible.sync="visible" title="批量发货" width="510px" @closed="onClose">
<div style="display:flex;position:relative">
<span style="flex-shrink:0;margin-top:10px"><span style="color:#FF5152;margin-right:5px">*</span>导入文件：</span>
<span style="flex-shrink:0;margin-top:10px;color:#303133"><span style="color:#FF5152;margin-right:5px">*</span>导入文件：</span>
<dm-upload-file
class="ml10 upload"
action="/api-welfare/delivery-order/batch-delivering"
:file-list="fileList"
:on-success="onSuccess"
:limit="1"
width="auto"
accept=".xls,.xlsx"
with-credentials
:headers="uploadHeader"
......@@ -16,9 +17,9 @@
<span slot="tip"></span>
<el-button icon="iconfont-components4 icon-cp-shangc upload-icon">上传</el-button>
</dm-upload-file>
<el-button class="ml20" style="position:absolute;right:20px;top:10px" type="text" @click="downloadFile">下载批量发货的模版</el-button>
<el-button type="text" @click="downloadFile">下载批量发货的模版</el-button>
</div>
<div class="mt10" style="margin-left:90px">
<div v-if="showTip" class="mt10" style="margin-left:90px">
成功<span style="color:#2f54eb">{{successCount}}</span>条，失败<span style="color:#F5222d">{{failedCount}}</span>条
<el-button class="ml10" type="text" @click="errorInfoDialog.visible = true">查看详情</el-button>
</div>
......@@ -61,6 +62,7 @@ export default {
visible: false
},
errorInfos: [],
showTip: false
};
},
mounted() {
......@@ -87,8 +89,13 @@ export default {
this.successCount = result.success;
this.failedCount = result.failure;
this.errorInfos = result.errorInfos || [];
this.showTip = true;
this.$emit('refresh');
},
onClose() {
this.$emit('close');
this.showTip = false;
}
}
};
</script>
......@@ -96,6 +103,8 @@ export default {
/deep/ .el-divider--horizontal {
margin: 16px 0;
margin-top: 20px;
border-bottom: 1px dashed #DCDFE6;
background-color: transparent;
}
.upload {
/deep/ .el-button {
......
src/views/performance-manage/components/cancel-order-dialog.vue
......@@ -6,7 +6,7 @@
<div class="ml20" style="font-size:16px;color:#303133">确认关闭发货单吗？</div>
</div>
<div style="margin-left:50px;color:#303133;margin-top:10px">将恢复礼品的库存，若存在销售单请至商城应用查看退款。</div>
<dm-input class="mt20" type="textarea" placeholder="请输入关闭原因（必填）" :maxlength="50" :rows="5" show-word-limit v-model="reason"></dm-input>
<dm-input class="mt20" type="textarea" placeholder="请输入关闭原因（必填）" :maxlength="240" :rows="5" show-word-limit v-model="reason"></dm-input>
</div>
<div slot="footer">
<el-button @click="visible = false">取消</el-button>
......
src/views/performance-manage/components/logistics-detail-dialog.vue
......@@ -67,7 +67,11 @@ export default {
.empty_block::after {
content: '暂无物流信息';
}
.empty_block {
margin-top: 20px;
}
.logistics-info {
color: #303133;
display: flex;
&>div {
flex: 1;
......
src/views/performance-manage/components/logistics-info-dialog.vue
......@@ -22,7 +22,7 @@
</div>
<div v-else class="fr pt10">
<el-button type="text" @click="handleSave">保存</el-button>
<el-button type="text" @click="isEditing = false">取消</el-button>
<el-button type="text" style="color:#606266" @click="isEditing = false">取消</el-button>
</div>
</template>
</div>
......
src/views/performance-manage/delivery-detail.vue
......@@ -53,22 +53,22 @@
发货单信息
</p>
<ul v-if="deliveryInfo.deliveryFlag==1" class="order-info">
<li>发货单号：{{deliveryInfo.deliveryId}}</li>
<li>履约单号：{{deliveryInfo.orderId}}</li>
<li>会员姓名：{{deliveryInfo.memberName}}</li>
<li>会员卡号：{{deliveryInfo.memberCardNo}}</li>
<li>发货单号：{{deliveryInfo.deliveryId || '--'}}</li>
<li>履约单号：{{deliveryInfo.orderId || '--'}}</li>
<li>会员姓名：{{deliveryInfo.memberName || '--'}}</li>
<li>会员卡号：{{deliveryInfo.memberCardNo || '--'}}</li>
<li>配货方式：物流发货</li>
<li>收货信息：{{deliveryInfo.consignee}} {{deliveryInfo.consigneePhone}} {{deliveryInfo.consigneeAddress}}</li>
</ul>
<ul v-else class="order-info">
<li>发货单号：{{deliveryInfo.deliveryId}}</li>
<li>履约单号：{{deliveryInfo.orderId}}</li>
<li>会员姓名：{{deliveryInfo.memberName}}</li>
<li>会员卡号：{{deliveryInfo.memberCardNo}}</li>
<li>发货单号：{{deliveryInfo.deliveryId || '--'}}</li>
<li>履约单号：{{deliveryInfo.orderId || '--'}}</li>
<li>会员姓名：{{deliveryInfo.memberName || '--'}}</li>
<li>会员卡号：{{deliveryInfo.memberCardNo || '--'}}</li>
<li>配货方式：上门自提</li>
<li>提货信息：{{deliveryInfo.consignee}} {{deliveryInfo.consigneePhone}}</li>
<li>自提点：{{deliveryInfo.pickUpPointAddress}}</li>
<li>提货地址：{{deliveryInfo.pickUpPointName}}</li>
<li>自提点：{{deliveryInfo.pickUpPointAddress || '--'}}</li>
<li>提货地址：{{deliveryInfo.pickUpPointName || '--'}}</li>
<li>提货时间：{{deliveryInfo.pickUpStartTime | formatDate}} - {{deliveryInfo.pickUpStopTime | formatDate}}</li>
</ul>
<el-table :data="giftList">
......@@ -85,7 +85,7 @@
<span v-for="(item, i) in JSON.parse(row.giftSkuStrand || '[]')" :key="i">{{ item.specStandardName }}：{{ item.specStandardValueName }} &nbsp;&nbsp;</span>
</div>
<span v-else>- -</span>
<div>SKU编码：{{ row.giftSkuCode }}</div>
<div class="goods-sku">SKU编码：{{ row.giftSkuCode }}</div>
</div>
</div>
</div>
......@@ -94,9 +94,9 @@
<el-table-column label="礼品编码" prop="giftId"></el-table-column>
<el-table-column label="成本（元）" prop="costPrice"></el-table-column>
<el-table-column label="数量" prop="exchangeQuantity"></el-table-column>
<el-table-column label="物流公司 | 运单号">
<el-table-column label="物流信息">
<template slot-scope="{ row }">
<div v-if="row.logisticsNo">
<div v-if="row.logisticsNo && row.deliveryFlag !== 2">
<p>{{ row.logisticsCompanyName || '--' }}<el-divider direction="vertical"></el-divider>{{ row.logisticsNo || '--' }}</p>
<p><el-button type="text" @click="openDialog('LogisticsDetail')">查看物流</el-button></p>
</div>
......@@ -185,6 +185,7 @@ export default {
margin: 20px 0;
display: flex;
flex-wrap: wrap;
color: #303133;
li {
width: 33%;
margin: 10px 0
......
src/views/performance-manage/delivery-list.vue
......@@ -23,7 +23,7 @@
<el-date-picker class="w400 ml10" v-model="daterange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" @change="handleSearch"></el-date-picker>
<div class="mt20">
<el-button type="primary" @click="openDialog('BulkDelivery')">批量发货</el-button>
<el-button icon="el-icon-download" @click="exportConfig.exportVisible = true">导出</el-button>
<el-button icon="iconfont-welfare4 icon-xiazai mr5" @click="exportConfig.exportVisible = true">导出</el-button>
</div>
</header>
......@@ -41,7 +41,7 @@
<span v-for="(item, i) in JSON.parse(row.giftSkuStrand || '[]')" :key="i">{{ item.specStandardName }}：{{ item.specStandardValueName }} &nbsp;&nbsp;</span>
</div>
<span v-else>- -</span>
<div>SKU编码：{{ row.giftSkuCode }}</div>
<div class="goods-sku">SKU编码：{{ row.giftSkuCode }}</div>
</div>
</div>
</div>
......@@ -61,10 +61,10 @@
placement="bottom-end"
width="300"
trigger="hover">
<i class="iconfont-welfare4 icon-gengduo2 ml5" slot="reference"></i>
<i class="iconfont-welfare4 icon-gengduo2 more-detail ml5" slot="reference"></i>
<div class="performance-order-info">
<div><span>发货单来源：</span><span>{{row.appName}}</span></div>
<div class="mt10"><span>履约单号：</span><span>{{row.orderId}}</span></div>
<div><span>发货单来源：</span><span>{{row.appName || '--'}}</span></div>
<div class="mt10"><span>履约单号：</span><span>{{row.orderId || '--'}}</span></div>
<template v-if="row.deliveryType === 1 && row.deliveryFlag === 0">
<div class="mt10"><span>收货信息：</span><span>{{row.consignee}} {{row.consigneePhone}} {{row.consigneeAddress}}</span></div>
</template>
......@@ -80,12 +80,12 @@
<template v-else-if="row.deliveryType === 2 && row.deliveryFlag === 1">
<div class="mt10"><span>自提信息：</span><span>{{row.consignee}} {{row.consigneePhone}}</span></div>
<div class="mt10"><span>完成时间：</span><span>{{row.deliveryTime | formatDate('dateTime')}}</span></div>
<div class="mt10"><span>核销门店：</span><span>{{row.pickUpPointName}}</span></div>
<div class="mt10"><span>操作人：</span><span>{{row.pickUpPointName}}</span></div>
<div class="mt10"><span>核销门店：</span><span>{{row.pickUpPointName || '--'}}</span></div>
<div class="mt10"><span>操作人：</span><span>{{row.pickUpPointName || '--'}}</span></div>
</template>
<template v-else-if="row.deliveryFlag === 2">
<div class="mt10"><span>关闭时间：</span><span>{{row.cancelTime | formatDate('dateTime')}}</span></div>
<div class="mt10"><span>关闭原因：</span><span>{{row.cancelReason}}</span></div>
<div class="mt10"><span>关闭原因：</span><span>{{row.cancelReason || '--'}}</span></div>
</template>
</div>
</el-popover>
......@@ -341,30 +341,4 @@ export default {
</script>
<style lang="scss" scoped>
.goods-info {
height: 100%;
display: flex;
img {
width: 62px;
height: 62px;
border: 1px solid rgba(241, 243, 247, 1);
border-radius: 5px;
}
.goods-text {
margin-left: 18px;
font-size: 13px;
color: #303133;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.goods-text-info {
color: #909399;
font-size: 12px;
}
.goods-text-name {
margin-bottom: 5px;
line-height: 16px;
}
}
</style>
src/views/performance-manage/delivery.vue
......@@ -3,7 +3,7 @@
<el-tab-pane label="全部" :name="''">
<delivery-list :type="''"></delivery-list>
</el-tab-pane>
<el-tab-pane :label="`待发货（${count}）`" :name="0">
<el-tab-pane :label="`待发货(${count})`" :name="0">
<delivery-list :type="0" @count="setCount"></delivery-list>
</el-tab-pane>
<el-tab-pane label="已发货" :name="1">
......
src/views/performance-manage/record.vue
<template>
<div class="p20" v-loading="loading">
<header>
<el-select clas="w160" v-model="query.appCode" placeholder="请选择来源" @change="handleSearch" clearable>
<el-select clas="w160" v-model="query.appCode" placeholder="所有应用来源" @change="handleSearch" clearable>
<el-option v-for="item in appList" :key="item.appCode" :label="item.appName" :value="item.appCode"></el-option>
</el-select>
<el-select class="w160 ml10" placeholder="配货方式" v-model="query.deliveryType" @change="handleSearch" clearable>
<el-select class="w160 ml10" placeholder="所有配货方式" v-model="query.deliveryType" @change="handleSearch" clearable>
<el-option label="物流发货" :value="1"></el-option>
<el-option label="门店自提" :value="2"></el-option>
<el-option label="文本券码" :value="3"></el-option>
</el-select>
<el-select class="w160 ml10" placeholder="履约状态" v-model="query.orderFlag" @change="handleSearch" clearable>
<el-select class="w160 ml10" placeholder="所有履约状态" v-model="query.orderFlag" @change="handleSearch" clearable>
<el-option label="待履约" :value="0"></el-option>
<el-option label="已履约" :value="1"></el-option>
<el-option label="已关闭" :value="2"></el-option>
......@@ -26,7 +26,7 @@
</el-input>
<div class="clearfix mt20" style="margin-top:20px">
<el-date-picker class="w400 fl" v-model="daterange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" @change="handleSearch"></el-date-picker>
<el-button class="fr" icon="el-icon-download" type="primary" @click="exportConfig.exportVisible = true">导出</el-button>
<el-button class="fr" icon="iconfont-welfare4 icon-xiazai mr5" type="primary" @click="exportConfig.exportVisible = true">导出</el-button>
</div>
</header>
......@@ -44,7 +44,7 @@
<span v-for="(item, i) in JSON.parse(row.giftSkuStrand || '[]')" :key="i">{{ item.specStandardName }}：{{ item.specStandardValueName }} &nbsp;&nbsp;</span>
</div>
<span v-else>- -</span>
<div>SKU编码：{{ row.giftSkuCode }}</div>
<div class="goods-sku">SKU编码：{{ row.giftSkuCode }}</div>
</div>
</div>
</div>
......@@ -64,7 +64,7 @@
placement="bottom-end"
width="300"
trigger="hover">
<i class="iconfont-welfare4 icon-gengduo2" slot="reference"></i>
<i class="iconfont-welfare4 icon-gengduo2 more-detail" slot="reference"></i>
<div>
应用单号：{{row.businessId}}
</div>
......
src/views/performance-manage/refund.vue
......@@ -27,7 +27,7 @@
</el-input>
<el-date-picker class="w400 ml10" v-model="daterange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" @change="handleSearch"></el-date-picker>
<div class="mt20">
<el-button type="primary" icon="el-icon-download" @click="exportConfig.exportVisible = true">导出</el-button>
<el-button type="primary" icon="iconfont-welfare4 icon-xiazai mr5" @click="exportConfig.exportVisible = true">导出</el-button>
</div>
</header>
......@@ -45,7 +45,7 @@
<span v-for="(item, i) in JSON.parse(row.giftSkuStandard || '[]')" :key="i">{{ item.specStandardName }}：{{ item.specStandardValueName }} &nbsp;&nbsp;</span>
</div>
<span v-else>- -</span>
<div>SKU编码：{{ row.giftSkuCode }}</div>
<div class="goods-sku">SKU编码：{{ row.giftSkuCode }}</div>
</div>
</div>
</div>
......@@ -65,31 +65,31 @@
placement="bottom-end"
width="300"
trigger="hover">
<i class="iconfont-welfare4 icon-gengduo2" slot="reference"></i>
<i class="iconfont-welfare4 icon-gengduo2 more-detail" slot="reference"></i>
<div class="performance-order-info">
<div><span>退货单来源：</span><span>{{row.appName}}</span></div>
<div class="mt10"><span>履约单号：</span><span>{{row.orderId}}</span></div>
<div><span>退货单来源：</span><span>{{row.appName || '--'}}</span></div>
<div class="mt10"><span>履约单号：</span><span>{{row.orderId || '--'}}</span></div>
<template v-if="row.refundFlag === 0 && !row.refundLogisticsNo">
<div class="mt10"><span>退货原因：</span><span>{{row.refundReason}}</span></div>
<div class="mt10"><span>退货说明：</span><span>{{row.refundRemark}}</span></div>
<div class="mt10"><span>退货原因：</span><span>{{row.refundReason || '--'}}</span></div>
<div class="mt10"><span>退货说明：</span><span>{{row.refundRemark || '--'}}</span></div>
</template>
<template v-else-if="row.refundFlag === 0 && row.refundLogisticsNo">
<div class="mt10"><span>寄回时间：</span><span>{{row.deliveryTime | formatDate('dateTime')}}</span></div>
<div class="mt10"><span>退货原因：</span><span>{{row.refundReason}}</span></div>
<div class="mt10"><span>退货说明：</span><span>{{row.refundRemark}}</span></div>
<div class="mt10"><span>退货原因：</span><span>{{row.refundReason || '--'}}</span></div>
<div class="mt10"><span>退货说明：</span><span>{{row.refundRemark || '--'}}</span></div>
</template>
<template v-else-if="row.refundFlag === 1">
<div class="mt10"><span>操作人：</span><span>{{row.refundUserName}}</span></div>
<div class="mt10"><span>操作人：</span><span>{{row.refundUserName || '--'}}</span></div>
<div class="mt10"><span>操作时间：</span><span>{{row.processTime | formatDate('dateTime')}}</span></div>
<div class="mt10"><span>退货原因：</span><span>{{row.refundReason}}</span></div>
<div class="mt10"><span>退货说明：</span><span>{{row.refundRemark}}</span></div>
<div class="mt10"><span>退货原因：</span><span>{{row.refundReason || '--'}}</span></div>
<div class="mt10"><span>退货说明：</span><span>{{row.refundRemark || '--'}}</span></div>
</template>
<template v-else-if="row.refundFlag === 2">
<div class="mt10"><span>操作人：</span><span>{{row.refundUserName}}</span></div>
<div class="mt10"><span>操作人：</span><span>{{row.refundUserName || '--'}}</span></div>
<div class="mt10"><span>操作时间：</span><span>{{row.processTime | formatDate('dateTime')}}</span></div>
<div class="mt10"><span>拒绝原因：</span><span>{{row.refuseReason}}</span></div>
<div class="mt10"><span>退货原因：</span><span>{{row.refundReason}}</span></div>
<div class="mt10"><span>退货说明：</span><span>{{row.refundRemark}}</span></div>
<div class="mt10"><span>拒绝原因：</span><span>{{row.refuseReason || '--'}}</span></div>
<div class="mt10"><span>退货原因：</span><span>{{row.refundReason || '--'}}</span></div>
<div class="mt10"><span>退货说明：</span><span>{{row.refundRemark || '--'}}</span></div>
</template>
<template v-else-if="row.refundFlag === 3">
<div class="mt10"><span>关闭时间：</span><span>{{row.cancelTime | formatDate('dateTime')}}</span></div>
......@@ -254,7 +254,7 @@ export default {
searchType: 'refundId',
searchValue: '',
query: {
refundFlag: '',
refundFlag: 0,
appCode: '',
startTime: '',
endTime: '',
......
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