Skip to content

上
上药订单生命周期升级
Commit ecc53607 authored by LynnQi's avatar LynnQi
Browse files
Options

Merge branch 'master' of http://gitlab.jiucaiyun.cn/sph/SH_OrderLifeCycleU

parents 525eaaa7 01cf5180
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 2600 additions and 136 deletions
src/assets/styles/variable.scss
View file @ ecc53607
......@@ -29,8 +29,14 @@ $arrowC:#747782;
$txtBlack:#23262A;
$txtGray:#8792A4;
// 线颜色
$line: #eeeeee;
// 文字色
$txtGray9: #999999;
$txtGrayL: #D3D3D3;
//订单状态颜色
$orderReturn:#D9001B;
$orderJm:#02a7f0;
$orderCold:#4b7902;
src/components/MapView.vue
View file @ ecc53607
<template>
<div id="mapView">
<!-- <div id="container" style="width:100%;height:400px"></div> -->
<div class="amap-container">
<el-amap
:plugin="plugin"
:amap-manager="amapManager"
:zoom="zoom"
:center="center"
vid="amapDemo"
ref="reds"
style="width:100vw;height:80vh"
:events="events"
vid="amap-order"
class = "amap-box"
:resizeEnable="mapInfo.resizeEnable"
:amap-manager="mapInfo.amapManager"
:zoom="mapInfo.zoom"
:center="mapInfo.center"
:events="mapInfo.events"
></el-amap>
</div>
</template>
<script>
import {AMapManager} from 'vue-amap'
import VueAMap from 'vue-amap'
// var map = amapManager.getMap();
import AMap from 'AMap'
// 引入高德地图ui组件
import {lazyAMapApiLoaderInstance} from 'vue-amap'
// eslint-disable-next-line import/no-duplicates
// import {lazyAMapApiLoaderInstance} from 'vue-amap'
// eslint-disable-next-line import/no-duplicates
import VueAMap from 'vue-amap'
//
let amapManager = new VueAMap.AMapManager()
export default {
......@@ -33,52 +30,25 @@ export default {
}
},
data() {
let _obj = this
return {
status: this.value,
amapManager,
center: [116.379028, 39.865042],
plugin: [
{
pName: 'Scale',
events: {
init(instance) {
console.log(instance)
}
}
}
],
zoom: 13,
events: {
init(o) {
// _obj.createMap();
o.setMapStyle('amap://styles/macaron') // 自定义的高德地图的样式，我选的是马卡龙
let marker = new AMap.Marker({ // 点图标
position: [116.379028, 39.865042]
})
// o.setZoomAndCenter(16, [116.379028, 39.865042])
marker.setMap(o)
o.plugin(['AMap.Driving'], function () {
var driving = new AMap.Driving({
map: o,
showTraffic: false // 是否显示拥堵状态
mapInfo: {
resizeEnable: true, // 是否监控地图容器尺寸变化
zoom: 13, // 地图缩放
amapManager,
center: [116.379028, 39.865042],
events: {
init(o) {
// lazyAMapApiLoaderInstance.load().then(() => {
//
// })
// eslint-disable-next-line no-undef
let marker = new AMap.Marker({ // 点图标
position: [116.379028, 39.865042]
})
// 地点关键字+ 驾车路线规划
driving.search(new AMap.LngLat(116.379028, 39.865042), new AMap.LngLat(116.427281, 39.903719), function (status, result) {
// result 即是对应的驾车导航信息，相关数据结构文档请参考 https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
if (status === 'complete') {
console.log('绘制驾车路线完成')
} else {
console.log('获取驾车数据失败：' + result)
}
}
)
o.addControl(driving)
})
marker.setMap(o)
}
}
},
marker: {},
map: {} // 保存地图对象
}
}
},
watch: {
......@@ -87,19 +57,8 @@ export default {
}
},
mounted() {
this.createMapOne()
},
methods: {
// 创建地图
createMapOne() {
},
createMap() {
o.setMapStyle('amap://styles/macaron') // 自定义的高德地图的样式，我选的是马卡龙
let marker = new AMap.Marker({ // 点图标
position: [116.379028, 39.865042]
})
},
action() {
this.$emit('action', '')
}
......@@ -107,7 +66,8 @@ export default {
}
</script>
<style lang="scss" scoped>
#MapView {
// height: 44px;
.amap-container {
height: 300px;
width: 100%;
}
</style>
src/components/SearchInConsignor.vue
View file @ ecc53607
......@@ -28,7 +28,7 @@
:error.sync="error"
:offset="10"
@load="onLoad">
<van-radio-group v-model="checked">
<!-- <van-radio-group v-model="checked">
<van-cell-group>
<van-cell :title="titleInitial(item)" clickable @click="itemClick(item,index)" v-for="(item,index) in postDataList"
:key="index">
......@@ -37,7 +37,17 @@
</template>
</van-cell>
</van-cell-group>
</van-radio-group>
</van-radio-group> -->
<van-checkbox-group v-model="checkedList">
<van-cell-group>
<van-cell :title="titleInitial(item)" clickable @click="itemClick(item,index)" v-for="(item,index) in postDataList"
:key="index">
<template #right-icon>
<van-checkbox :name="item.comPartyId" />
</template>
</van-cell>
</van-cell-group>
</van-checkbox-group>
</van-list>
</van-pull-refresh>
</div>
......@@ -71,7 +81,8 @@ export default {
pageSize: 10,
postDataList: [],
checked: '',
choosedPost: {}
checkedList: [],
choosedPost: []
}
},
computed: {
......@@ -85,8 +96,8 @@ export default {
default: false
},
customer: {
type: Object,
default: () => {}
type: Array,
default: () => []
},
chinfo: {
type: Object,
......@@ -103,11 +114,15 @@ export default {
this.postShow = val
if (val) {
this.postDataList = []
this.checkedList = []
this.choosedPost = JSON.parse(JSON.stringify(this.customer))
this.checked = !this.customer.comPartyId ? '' : this.customer.comPartyId
console.log(this.checked)
// this.checked = !this.customer.comPartyId ? '' : this.customer.comPartyId
// console.log(this.checked)
this.customer.forEach((res)=>{
this.checkedList.push(res.comPartyId)
})
this.currentPage = 1
this.onLoad()
this.onRefresh()
}
},
postShow (val) {
......@@ -140,10 +155,11 @@ export default {
},
onCancelClick() {
this.postShow = false
this.checkedList = []
this.$emit('cancleclick')
},
onConfirmClick() {
if (!this.choosedPost.comPartyId) {
if (this.choosedPost.length === 0) {
Dialog.alert({
title: '温馨提示',
message: '请选择选项！'
......@@ -158,8 +174,15 @@ export default {
})
},
itemClick(item, index) {
this.checked = item.comPartyId
this.choosedPost = item
// this.checked = item.comPartyId
// this.choosedPost = item
if(this.checkedList.indexOf(item.comPartyId) > -1) {
this.choosedPost.splice(this.checkedList.indexOf(item.comPartyId),1)
this.checkedList.splice(this.checkedList.indexOf(item.comPartyId),1)
} else {
this.checkedList.push(item.comPartyId)
this.choosedPost.push(item)
}
},
onRefresh() {
// 刷新接口
......
src/main.js
View file @ ecc53607
......@@ -14,7 +14,7 @@ Vue.use(VueAMap)
VueAMap.initAMapApiLoader({
key: '061c2a328572b71e2b26d9dc1a0cc703',
plugin: ['AMap.Scale', 'AMap.OverView', 'AMap.ToolBar', 'AMap.MapType', 'AMap.PlaceSearch', 'AMap.Geolocation', 'AMap.Geocoder'],
v: '1.4.4',
v: '2.0',
uiVersion: '1.0'
})
// import './assets/styles/variable.scss'
......
src/router/index.js
View file @ ecc53607
......@@ -15,7 +15,7 @@ Vue.use(Router)
const routerList = [
{
path: '/',
redirect: '/todo'
redirect: '/myOrder'
},
...todo,
...saleSituation,
......
src/router/myOrder/index.js
View file @ ecc53607
......@@ -34,6 +34,33 @@ const myOrder = [
auth: false
},
component: resolve => require(['@/views/myOrder/detail/logisticsDetail'], resolve)
},
{
path: '/orderInvoice',
name: 'orderInvoice',
meta: {
title: '发票查询',
auth: false
},
component: resolve => require(['@/views/myOrder/orderInvoice'], resolve)
},
{
path: '/orderInvoiecDetail',
name: 'orderInvoiecDetail',
meta: {
title: '发票明细',
auth: false
},
component: resolve => require(['@/views/myOrder/orderInvoice/orderInvoiecDetail'], resolve)
},
{
path: '/clearance',
name: 'clearance',
meta: {
title: '请货单查询',
auth: false
},
component: resolve => require(['@/views/myOrder/clearance'], resolve)
}
]
export default myOrder
src/views/myInvoice/components/HighSearch.vue
View file @ ecc53607
......@@ -18,6 +18,11 @@
<!-- <div contenteditable="true" class="inputInfo">{{orderNo}}</div> -->
<input :value="orderNo" class="input" type="text">
</div>
<div class="high-info">
<div class="title font-bold font-16">发票号</div>
<!-- <div contenteditable="true" class="inputInfo">{{orderNo}}</div> -->
<input :value="invoiceNo" class="input" type="text">
</div>
<div class="high-info" @click="showPost('supplier')">
<div class="title font-bold font-16">供应商</div>
<div contenteditable="true" class="inputInfo">{{supplier}}</div>
......@@ -133,10 +138,11 @@ export default {
},
moreSearchInfo: {
supplier: '', // 供应商
consignor: '', // 货主
consignor: [], // 货主
goods: '', // 商品
client: '', // 客户
orderNo: '', // 订单号
invoiceNo: '', // 发票号
time: {
start: getFormateDate(new Date(), 'yyyy-MM-dd'),
end: getFormateDate(new Date(), 'yyyy-MM-dd')
......@@ -159,8 +165,13 @@ export default {
},
// 货主
consignor () {
if (this.moreSearchInfo.consignor.comPartyId) {
return !this.moreSearchInfo.consignor ? '' : (this.moreSearchInfo.consignor.comPartyId + '/(' + this.moreSearchInfo.consignor.partyOpcode + ')' + this.moreSearchInfo.consignor.partyName)
// if (this.moreSearchInfo.consignor.comPartyId) {
// return !this.moreSearchInfo.consignor ? '' : (this.moreSearchInfo.consignor.comPartyId + '/(' + this.moreSearchInfo.consignor.partyOpcode + ')' + this.moreSearchInfo.consignor.partyName)
// } else {
// return ''
// }
if (this.moreSearchInfo.consignor) {
return this.fieldStitching()
} else {
return ''
}
......@@ -188,6 +199,14 @@ export default {
} else {
return ''
}
},
// 发票号
invoiceNo () {
if (this.moreSearchInfo.invoiceNo) {
return !this.moreSearchInfo.invoiceNo ? '' : this.moreSearchInfo.invoiceNo
} else {
return ''
}
}
},
props: {
......@@ -221,10 +240,11 @@ export default {
onCleanClick() {
this.moreSearchInfo = {
supplier: '', // 供应商
consignor: '', // 货主
consignor: [], // 货主
goods: '', // 商品
client: '', // 客户
orderNo: '',
invoiceNo: '',
time: {
start: getFormateDate(new Date(), 'yyyy-MM-dd'),
end: getFormateDate(new Date(), 'yyyy-MM-dd')
......@@ -271,6 +291,20 @@ export default {
}
this.showPost(data.page);
},
// 字段拼接
fieldStitching() {
let str = ''
if (this.moreSearchInfo.consignor.length === 1) {
str = this.consignorInfoStitching(this.moreSearchInfo.consignor[0])
} else if (this.moreSearchInfo.consignor.length > 1) {
str = this.consignorInfoStitching(this.moreSearchInfo.consignor[0]) + '......'
}
return str
},
// 商品信息拼接
consignorInfoStitching(model) {
return model.comPartyId + '/(' + model.partyOpcode + ')/' + model.partyName
}
}
}
</script>
......
src/views/myInvoice/index.vue
View file @ ecc53607
......@@ -71,7 +71,7 @@ export default {
// console.log()
this.$router.push({
path: '/invoiecDetail',
query: window.location.href.split('?')[1]
query: this.$store.state.linkInfo
});
},
onBrowserBack() {
......
src/views/myOrder/clearance/HighSearch.vue 0 → 100644
View file @ ecc53607
This diff is collapsed.
src/views/myOrder/clearance/clearanceList.vue 0 → 100644
View file @ ecc53607
<template>
<div id="clearanceList">
<div class="content">
<van-pull-refresh class="list" ref="supplierList" v-model="isRefreshing" @refresh="onRefresh">
<van-list
v-model="isLoading"
:finished="finished"
finished-text="没有更多了"
:error.sync="error"
error-text="请求失败，点击重新加载"
@load="onLoad">
<div class="invoiceItem"
v-for="(item, index) in invoiceList"
:key="index">
<clearance-list-item :item="item"/>
</div>
</van-list>
</van-pull-refresh>
</div>
</div>
</template>
<script>
// 引入接口
import { getMyInvoiceList } from '@/api/myInvoice'
import clearanceListItem from './clearanceListItem.vue'
export default {
name: 'ClearanceList',
components: {
clearanceListItem
},
data() {
return {
currentPage: 1,
pageSize: 10,
isRefreshing: false,
isLoading: false,
finished: false,
error: false,
logInfoShow: false,
invoiceList: [],
invoiceItem: {},
sphImage: require('@/assets/img/u48.png'),
}
},
computed: {
linkInfo () {
return this.$store.state.linkInfo
},
routKey() {
return this.$route.path
},
searchTime() {
let time = this.time.start + '/' + this.time.end
return time
}
},
mounted() {
// this.onLoad()
},
methods: {
gotoDetail(model) {
// console.log(model)
this.$emit('gotoDetail', model)
},
onRefresh() {
this.currentPage = 1
this.isRefreshing = true
this.getPostData()
},
onLoad() {
this.isLoading = true
this.getPostData()
},
getPostData() {
let _this = this
let data = {
'dbName': 'erp_test_shaphar-上药控股有限公司-204-23528', // 'erp_ogg_shaphar',
'start': _this.currentPage,
'length': _this.pageSize,
'goods': ''
}
getMyInvoiceList(data).then(rt => {
if (rt.code === 1 || rt.code === '1') {
if (_this.isRefreshing) {
_this.invoiceList = rt.data
} else if (rt.data || rt.data.length > 0) {
_this.invoiceList = _this.invoiceList.concat(rt.data)
}
// 重置刷新提示
_this.isRefreshing = false
// 重置加载更多提示
_this.isLoading = false
if (rt.data.length < 10) {
_this.finished = true
} else {
// 加载成功后下一页自增1
_this.currentPage++
}
} else {
_this.$toast(rt.message)
_this.isRefreshing = false
_this.error = true
_this.finished = false
}
// 加载状态结束
_this.isLoading = false
}).catch(e => {
this.$toast('获取信息失败！')
_this.isRefreshing = false
_this.isLoading = false
_this.error = true
_this.finished = true
})
}
}
}
</script>
<style lang="scss" scoped>
#clearanceList {
height: 100%;
.content{
height: 100%;
overflow-x: hidden;
overflow-y: auto;
padding: 10PX;
.invoiceItem{
// height: 145PX;
background-color: white;
margin-bottom: 10PX;
border-radius: 10PX;
font-size: 14PX;
color: #333333;
padding: 0PX 10PX 10PX 10PX;
}
}
}
</style>
src/views/myOrder/clearance/clearanceListItem.vue 0 → 100644
View file @ ecc53607
<template>
<div id="clearanceListItem">
<div class="clearanceInfo">
<div class="clearanceHead">
<van-image fit="contain" width="50" height="55" :src="sphImage"/>
<div class="num">
<div class="numBer">请货单号：34678649876</div>
</div>
<div class="numType"><van-button class="numBtn" plain size="mini" type="info">药事所</van-button></div>
</div>
<div class="divider"></div>
<div class="orderInfo">
<div class="company">
<span style="width: 83%">药品部</span>
</div>
<div class="info">
<div class="headImage">
<van-image width="55" height="55"
src="https://img01.yzcdn.cn/vant/cat.jpeg"/>
</div>
<div class="details">
<div class="titleInfo">
[132521]阿西匹林/0.25g*s/上海市浦东新区金科路长泰广场负一楼
</div>
</div>
</div>
<div class="goodsNum">
来源商品编码：XN19280003837282
</div>
<div class="quantity">
<div class="clearanceNum">
请货数量：1000
</div>
<div class="billingNum">
开单数量：90
</div>
</div>
<van-divider :style="{ color: '#999999', borderColor: '#999999', margin: '10PX 0 10PX 0'}"/>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'ClearanceListItem',
components: {
},
data() {
return {
sphImage: require('@/assets/img/u48.png'),
}
},
props: {
item: {
type: Object,
default: () => {
return {
}
}
}
},
computed: {
linkInfo () {
return this.$store.state.linkInfo
},
routKey() {
return this.$route.path
},
searchTime() {
let time = this.time.start + '/' + this.time.end
return time
}
},
mounted() {
// this.onLoad()
},
methods: {
onRefresh() {
}
}
}
</script>
<style lang="scss" scoped>
#clearanceListItem {
height: 100%;
.clearanceInfo{
font-size: 15PX;
.clearanceHead{
display: flex;
line-height: 50PX;
height: 50PX;
// margin: 0PX 10PX;
.num{
width: 77%;
padding-left: 5PX;
}
.numBer{
height: 16PX;
// line-height: 15PX;
}
// .numBtn{
// height: 13PX;
// line-height: 13PX;
// min-width: 35PX;
// font-size: 8PX;
// }
.dian{
width: 12PX;
height: 10PX;
border-radius: 10PX;
background-color: red;
margin: auto 5PX
}
.numType{
width: 17%;
text-align: right
}
}
.divider{
width: 100%;
height: 1PX;
background: linear-gradient(to right, #ccc 0%, #ccc 50%, transparent 50%);
background-size: 10PX 1PX;
background-repeat: repeat-x;
}
.orderInfo{
// margin: 0PX 10PX;
// display: flex;
// height: 105PX;
.company {
height: 45PX;
line-height: 45PX;
width: 100%;
display: flex;
font-weight: 600;
font-size: 16PX;
}
.info{
height: 65PX;
display: flex;
.headImage{
// width: 55PX;
padding-right: 10PX;
}
.details{
float: right;
width: calc(100vw - 105PX);
.titleInfo{
width: 100%;
overflow:hidden;
// white-space: nowrap;
text-overflow:ellipsis;
// line-height: 30PX;
}
}
}
.quantity{
display: flex;
height: 30PX;
line-height: 30PX;
.clearanceNum{
width: 50%;
}
.billingNum{
width: 50%;
}
}
}
}
}
</style>
src/views/myOrder/clearance/index.vue 0 → 100644
View file @ ecc53607
<template>
<div id="clearance">
<clearance-list @gotoDetail="gotoDetail"/>
<high-search v-model="moreSearchShow" @onsearch="moreSearchConfirm" @onclean="moreSearchClean"/>
</div>
</template>
<script>
import HighSearch from './HighSearch.vue'
import {getFormateDate} from '@/utils/common'
import clearanceList from './clearanceList.vue'
export default {
name: 'Clearance',
components: {
HighSearch,
clearanceList
},
data() {
return {
tabsTitle: [],
moreSearchShow: false,
activeTab: 'home',
moreSearchInfo: {
//接收搜索更多回传的数据
supplier: { comPartyId: "" }, //供应商ID
goods: { comGoodsId: "" }, //商品ID
orderNo: "", //订单编号
time: {
//起始时间
start: getFormateDate(new Date(), "yyyy-MM-dd"),
end: getFormateDate(new Date(), "yyyy-MM-dd"),
},
},
invoiceList: []
}
},
computed: {
linkInfo () {
return this.$store.state.linkInfo
},
routKey() {
return this.$route.path
},
searchTime() {
let time = this.time.start + '/' + this.time.end
return time
}
},
mounted() {
// 设置标题栏关闭返回按钮
this.$store.commit('setNavBar', {
show: true,
leftArrow: true,
rightIcon: true,
title: '请货单查询',
leftText: '',
leftClick: this.onBrowserBack,
rightClick: this.onMoreSearch
})
// 给window添加一个popstate事件，拦截返回键，执行this.onBrowserBack事件，addEventListener需要指向一个方法
window.addEventListener('popstate', this.onBrowserBack, false)
},
destroyed() {
// 当页面销毁必须要移除这个事件，vue不刷新页面，不移除会重复执行这个事件
window.removeEventListener('popstate', this.onBrowserBack, false)
},
methods: {
// 跳转详情
gotoDetail(model) {
},
onBrowserBack() {
this.$router.go(-1)
},
onSearch() {
},
onMoreSearch() {
this.moreSearchShow = !this.moreSearchShow
if (this.moreSearchShow) {
window.history.pushState(null, null, document.URL)
}
},
// 高级搜索查询
moreSearchConfirm(data) {
console.log('000000000')
},
// 高级搜索取消
moreSearchClean(data) {
this.moreSearchInfo = data;
},
closeAppPage() {
console.log('关闭页面')
bridge.closeWindow_c()
}
}
}
</script>
<style lang="scss" scoped>
#clearance {
height: 100%;
}
</style>
src/views/myOrder/components/HighSearch.vue
View file @ ecc53607
......@@ -133,7 +133,7 @@ export default {
},
moreSearchInfo: {
supplier: '', // 供应商
consignor: '', // 货主
consignor: [], // 货主
goods: '', // 商品
client: '', // 客户
orderNo: '', // 订单号
......@@ -159,8 +159,13 @@ export default {
},
// 货主
consignor () {
if (this.moreSearchInfo.consignor.comPartyId) {
return !this.moreSearchInfo.consignor ? '' : (this.moreSearchInfo.consignor.comPartyId + '/(' + this.moreSearchInfo.consignor.partyOpcode + ')' + this.moreSearchInfo.consignor.partyName)
// if (this.moreSearchInfo.consignor.comPartyId) {
// return !this.moreSearchInfo.consignor ? '' : (this.moreSearchInfo.consignor.comPartyId + '/(' + this.moreSearchInfo.consignor.partyOpcode + ')' + this.moreSearchInfo.consignor.partyName)
// } else {
// return ''
// }
if (this.moreSearchInfo.consignor) {
return this.fieldStitching()
} else {
return ''
}
......@@ -221,7 +226,7 @@ export default {
onCleanClick() {
this.moreSearchInfo = {
supplier: '', // 供应商
consignor: '', // 货主
consignor: [], // 货主
goods: '', // 商品
client: '', // 客户
orderNo: '',
......@@ -271,6 +276,20 @@ export default {
}
this.showPost(data.page);
},
// 字段拼接
fieldStitching() {
let str = ''
if (this.moreSearchInfo.consignor.length === 1) {
str = this.consignorInfoStitching(this.moreSearchInfo.consignor[0])
} else if (this.moreSearchInfo.consignor.length > 1) {
str = this.consignorInfoStitching(this.moreSearchInfo.consignor[0]) + '......'
}
return str
},
// 商品信息拼接
consignorInfoStitching(model) {
return model.comPartyId + '/(' + model.partyOpcode + ')/' + model.partyName
}
}
}
</script>
......
src/views/myOrder/components/logisticsStep.vue 0 → 100644
View file @ ecc53607
<template>
<div id="stepLayout">
<slot></slot>
</div>
</template>
<script>
export default {
name: 'logisticsStep',
props: {
active: {
type: Number,
default: 0
}
},
mounted () {
this.calcStepLine()
},
methods: {
calcStepLine () {
let lineEle = document.getElementsByClassName('state-line')
if (lineEle.length > 0) {
lineEle[lineEle.length - 1].style.width = '0px'
}
}
}
}
</script>
<style lang="scss" scoped>
</style>
src/views/myOrder/components/stepItem.vue 0 → 100644
View file @ ecc53607
<template>
<div class="step-container" :class="'type__'+stepState">
<div class="step-time ">
<div class="step-date">{{stepInfo.date}}</div>
<div class="step-hours">{{stepInfo.hours}}</div>
</div>
<div class="step-tips">
<van-icon class="state-icon" name="smile" />
<div class="state-line" ></div>
</div>
<div class="step-content ">
<div class="step-type">{{stepInfo.type}}</div>
<div class="step-text">{{stepInfo.text}}</div>
</div>
</div>
</template>
<script>
export default {
name: 'stepItem',
data () {
return {
state: 'normal'
}
},
props: {
stepInfo: {
type: Object,
default: () => {
return {
date: '2020-03-10',
hours: '10:08:08',
type: '状态名称',
text: '内容信息'
}
}
}
},
computed: {
stepState: function () {
return this.$parent.$children[0]._uid === this._uid ? 'normal' : 'history'
}
}
}
</script>
<style lang="scss" scoped>
.step-container {
display: flex;
align-items: center;
height:60px;
//border-bottom: 1px solid $line;
/*时间 选中*/
.step-time {
flex: 1.5;
text-align: center;
.step-date {
color: $txtGray9;
}
.step-hours {
font-size: 14px;
font-weight: bold;
color: $txtBlack;
}
}
/*图标 连接线*/
.step-tips {
flex: 0.5;
font-size: 18px;
position:relative;
text-align: center;
margin-top:-12px;
.state-icon{
z-index: 100;
color: $main1
}
.state-line {
position: absolute;
z-index:1;
left: 0;
right: 0;
top: 16px;
width: 2px;
height: 50px;
margin: 0 auto;
background-size: 2px 11px;
background-repeat: repeat-y;
background-image: linear-gradient(
0deg,
$txtGrayL 0%,
$txtGrayL 50%,
transparent 50%
);
}
}
/*内容 选中*/
.step-content {
flex: 5;
margin-left: 2px;
.step-type {
font-weight: bold;
font-size: 15px;
}
.step-text {
font-size: 12px;
color: $txtGray9;
}
}
}
/*非选中 文字颜色*/
.type__history {
.step-time {
.step-date {
color: $txtGrayL;
}
.step-hours {
color: $txtGrayL;
}
}
.step-tips {
.state-icon {
color: $txtGrayL
}
}
.step-content {
.step-type {
color: $txtGrayL;
}
.step-text {
color: $txtGrayL;
}
}
}
</style>
src/views/myOrder/detail/logisticsDetail.vue
View file @ ecc53607
<template>
<div class="logistics-content">
<map-view/>
<div class="logistics-head">
<van-icon :name="icons.logo"/>
<span>承运商: 绥德库</span>
<span>市内</span>
<div class="logistics-header">
<div class="header-title">
<van-icon class="logistic-logo" :name="icons.logo"/>
<span class="logistic-name">承运商: <span class="logistic-values">绥德库</span></span>
<span class="logistic-type">市内</span>
</div>
<div class="header-order-info" style="margin-top: 8px">运单号: <span class="logistic-values">3902202102250062</span></div>
<div class="header-order-info" style="margin-top:2px;margin-bottom:8px">配送人: <span class="logistic-values">罗平行 13300992222</span></div>
</div>
<div class="logistics-step-line">
<logistics-step>
<step-item v-for="(item, index) in stepList" :stepInfo = item :key="index"/>
</logistics-step>
</div>
<div >运单号: 3902202102250062</div>
<div >配送人: 罗平行 13300992222</div>
</div>
</template>
<script>
import MapView from '../../../components/MapView'
import LogisticsStep from '../components/logisticsStep'
import StepItem from '../components/stepItem'
export default {
name: 'logisticsDetail',
components: {MapView},
components: {StepItem, LogisticsStep, MapView},
data () {
return {
icons: {
logo: require('@/assets/img/u48.png')
}
},
stepList: [
{
date: '2020-03-10',
hours: '10:08:12',
type: '已签收',
text: '您的订单已完成签收，期待再次为您服务。'
},
{
date: '2020-03-10',
hours: '10:08:11',
type: '运输中',
text: '乘运商已提货，待运输。'
},
{
date: '2020-03-10',
hours: '10:08:10',
type: '运输中',
text: '您的订单正在配送途中，请耐心等待。'
},
{
date: '2020-03-10',
hours: '10:08:09',
type: '已发货',
text: '正在出库中...'
},
{
date: '2020-03-10',
hours: '10:08:08',
type: '已下单',
text: '正在为您积极打包'
}
]
}
},
mounted() {
......@@ -32,13 +72,57 @@ export default {
rightIcon: false,
title: '',
leftText: '物流详情',
leftClick: null,
leftClick: this.onBrowserBack,
rightClick: null
})
window.addEventListener('popstate', this.onBrowserBack, false)
},
destroyed() {
// 当页面销毁必须要移除这个事件，vue不刷新页面，不移除会重复执行这个事件
window.removeEventListener('popstate', this.onBrowserBack, false)
},
methods: {
onBrowserBack() {
this.$router.go(-1)
}
}
}
</script>
<style lang="scss" scoped>
.logistics-content {
background-color: #fff;
height: calc(100vh - 46px);
overflow: scroll;
.logistics-header {
border-bottom: 1px solid $line;
padding: 10px;
.header-title{
display: flex;
align-items: center;
.logistic-logo {
font-size: 22px;
margin-right: 6px;
}
.logistic-name {
font-size:13px;
font-weight: bold;
flex: 1;
}
.logistic-type {
border: 1px solid $orderJm;
color: $orderJm;
padding: 0 8px;
transform: scale(0.8);
}
}
.header-order-info {
font-size: 13px;
margin-left: 28px;
}
.logistic-values {
margin-left:10px;
}
}
}
</style>
src/views/myOrder/detail/orderDetail.vue
View file @ ecc53607
......@@ -33,7 +33,7 @@
</div>
<!-- 订单物流信息 -->
<div class="order-common order-logistics">
<div class="logistics-content">
<div class="logistics-content" @click="openPager('logisticsDetail')">
<van-icon :name="icons.inDelivery" class="order-icon logistics-icon"/>
<div class="logistics-text">
<div style="display:flex">
......@@ -54,7 +54,7 @@
</div>
<!-- 订单商品 -->
<div class="order-common order-goods">
<div class="goods-all">
<div class="goods-all" @click="openPager('goodsInfo')">
<span class="all-title">商品信息</span>
全部
<van-icon class="title-arrow" name="arrow"/>
......@@ -64,7 +64,7 @@
</div>
<!-- 订单发票信息 -->
<div class="order-common order-invoice">
<div class="invoice-all">
<div class="invoice-all" @click="openPager('myInvoice')">
<span class="all-title">发票信息</span>
全部
<van-icon class="title-arrow" name="arrow"/>
......@@ -99,11 +99,29 @@ export default {
rightIcon: false,
title: '',
leftText: '订单详情',
leftClick: null,
leftClick: this.onBrowserBack,
rightClick: null
})
window.addEventListener('popstate', this.onBrowserBack, false)
},
methods: {}
destroyed() {
// 当页面销毁必须要移除这个事件，vue不刷新页面，不移除会重复执行这个事件
window.removeEventListener('popstate', this.onBrowserBack, false)
},
methods: {
onBrowserBack() {
this.$router.go(-1)
},
openPager(path) {
this.$router.push({
path: path,
query: this.$store.state.linkInfo
})
},
openLogistics() {
this.openPager('logisticsDetail')
}
}
}
</script>
......
src/views/myOrder/index.vue
View file @ ecc53607
......@@ -22,7 +22,7 @@
v-for="(item, index) in tabsTitle"
:key="index"
:title="item.title">
<my-order-list/>
<my-order-list @orderItemAction="orderItemAction"/>
</van-tab>
</van-tabs>
<high-search v-model="moreSearchShow" @onsearch="moreSearchConfirm" @onclean="moreSearchClean"/>
......@@ -51,15 +51,15 @@ export default {
moreSearchShow: false,
activeTab: 'home',
moreSearchInfo: {
//接收搜索更多回传的数据
supplier: { comPartyId: "" }, //供应商ID
goods: { comGoodsId: "" }, //商品ID
orderNo: "", //订单编号
// 接收搜索更多回传的数据
supplier: { comPartyId: '' }, // 供应商ID
goods: { comGoodsId: '' }, // 商品ID
orderNo: '', // 订单编号
time: {
//起始时间
start: getFormateDate(new Date(), "yyyy-MM-dd"),
end: getFormateDate(new Date(), "yyyy-MM-dd"),
},
// 起始时间
start: getFormateDate(new Date(), 'yyyy-MM-dd'),
end: getFormateDate(new Date(), 'yyyy-MM-dd')
}
}
}
},
......@@ -95,6 +95,49 @@ export default {
window.removeEventListener('popstate', this.onBrowserBack, false)
},
methods: {
// 单个发票点击事件
orderItemAction(model) {
console.log(model)
switch (true) {
case model.actionType === 'invoice':
// 查看发票
this.gotoOrderInvoice(model)
break
case model.actionType === 'logistics':
// 查看物流
break
case model.actionType === 'clearance':
// 清货单
this.gotoOrderClearance(model)
break
case model.actionType === 'details':
// 订单详情
this.gotoOrderDetail(model)
break
}
},
// 查看订单详情
gotoOrderDetail (model) {
this.$router.push({
path: '/orderDetail',
query: this.$store.state.linkInfo
})
},
// 查看发票
gotoOrderInvoice (model) {
// console.log(window.location.href.split('?')[1])
this.$router.push({
path: '/orderInvoice',
query: this.$store.state.linkInfo
})
},
// 查看 清货单
gotoOrderClearance(model) {
this.$router.push({
path: '/clearance',
query: this.$store.state.linkInfo
})
},
onBrowserBack() {
if (this.moreSearchShow) {
this.moreSearchShow = false
......@@ -117,7 +160,7 @@ export default {
},
// 高级搜索取消
moreSearchClean(data) {
this.moreSearchInfo = data;
this.moreSearchInfo = data
},
addNextTab(pos) {
// 加载下一个页面
......
src/views/myOrder/myOrderList.vue
View file @ ecc53607
......@@ -12,7 +12,7 @@
<div class="orderItem"
v-for="(item, index) in orderList"
:key="index">
<order-list-item :item="item"/>
<order-list-item @orderItemAction="orderItemAction" :item="item"/>
<!-- <div class="itemInfo">
<div class="orderNum">
<van-image fit="contain" width="45" height="45" :src="sphImage"/>
......@@ -101,6 +101,10 @@ export default {
// this.onLoad()
},
methods: {
// 单个发票点击事件
orderItemAction(model) {
this.$emit('orderItemAction', model)
},
onRefresh() {
this.currentPage = 1
this.isRefreshing = true
......@@ -164,12 +168,13 @@ export default {
overflow-y: auto;
padding: 10PX;
.orderItem{
height: 250PX;
// height: 250PX;
background-color: white;
margin-bottom: 10PX;
border-radius: 10PX;
font-size: 14PX;
font-size: 14px;
color: #333333;
padding: 0PX 10PX 10PX 10PX;
}
}
}
......
src/views/myOrder/orderInvoice/components/HighSearch.vue 0 → 100644
View file @ ecc53607
This diff is collapsed.
src/views/myOrder/orderInvoice/index.vue 0 → 100644
View file @ ecc53607
<template>
<div id="orderInvoice">
<order-invoice-list @gotoDetail="gotoDetail"/>
<high-search v-model="moreSearchShow" @onsearch="moreSearchConfirm" @onclean="moreSearchClean"/>
</div>
</template>
<script>
import HighSearch from './components/HighSearch.vue'
import {getFormateDate} from '@/utils/common'
import orderInvoiceList from './orderInvoiceList.vue'
export default {
name: 'OrderInvoice',
components: {
HighSearch,
orderInvoiceList
},
data() {
return {
tabsTitle: [],
moreSearchShow: false,
activeTab: 'home',
moreSearchInfo: {
//接收搜索更多回传的数据
supplier: { comPartyId: "" }, //供应商ID
goods: { comGoodsId: "" }, //商品ID
orderNo: "", //订单编号
time: {
//起始时间
start: getFormateDate(new Date(), "yyyy-MM-dd"),
end: getFormateDate(new Date(), "yyyy-MM-dd"),
},
},
invoiceList: []
}
},
computed: {
linkInfo () {
return this.$store.state.linkInfo
},
routKey() {
return this.$route.path
},
searchTime() {
let time = this.time.start + '/' + this.time.end
return time
}
},
mounted() {
// 设置标题栏关闭返回按钮
this.$store.commit('setNavBar', {
show: true,
leftArrow: true,
rightIcon: true,
title: '发票',
leftText: '',
leftClick: this.onBrowserBack,
rightClick: this.onMoreSearch
})
// 给window添加一个popstate事件，拦截返回键，执行this.onBrowserBack事件，addEventListener需要指向一个方法
window.addEventListener('popstate', this.onBrowserBack, false)
},
destroyed() {
// 当页面销毁必须要移除这个事件，vue不刷新页面，不移除会重复执行这个事件
window.removeEventListener('popstate', this.onBrowserBack, false)
},
methods: {
// 跳转发票详情
gotoDetail(model) {
// console.log()
this.$router.push({
path: '/orderInvoiecDetail',
query: this.$store.state.linkInfo
});
},
onBrowserBack() {
this.$router.go(-1)
},
onSearch() {
},
onMoreSearch() {
this.moreSearchShow = !this.moreSearchShow
if (this.moreSearchShow) {
window.history.pushState(null, null, document.URL)
}
},
// 高级搜索查询
moreSearchConfirm(data) {
console.log('000000000')
},
// 高级搜索取消
moreSearchClean(data) {
this.moreSearchInfo = data;
},
closeAppPage() {
console.log('关闭页面')
bridge.closeWindow_c()
}
}
}
</script>
<style lang="scss" scoped>
#orderInvoice {
height: 100%;
}
</style>
src/views/myOrder/orderInvoice/invoiecDetail/orderInvoiecDetailList.vue 0 → 100644
View file @ ecc53607
<template>
<div id="orderInvoiecDetailList">
<div class="content">
<van-pull-refresh class="list" ref="supplierList" v-model="isRefreshing" @refresh="onRefresh">
<van-list
v-model="isLoading"
:finished="finished"
finished-text="没有更多了"
:error.sync="error"
error-text="请求失败，点击重新加载"
@load="onLoad">
<div class="invoiceItem" @click="gotoDetail(item)"
v-for="(item, index) in invoiceList"
:key="index">
<order-invoiec-list-item :item="item"/>
</div>
</van-list>
</van-pull-refresh>
</div>
</div>
</template>
<script>
// 引入接口
import { getMyInvoiceList } from '@/api/myInvoice'
import orderInvoiecListItem from './orderInvoiecListItem.vue'
export default {
name: 'OrderInvoiecDetailList',
components: {
orderInvoiecListItem
},
data() {
return {
currentPage: 1,
pageSize: 10,
isRefreshing: false,
isLoading: false,
finished: false,
error: false,
logInfoShow: false,
invoiceList: [],
invoiceItem: {},
sphImage: require('@/assets/img/u48.png'),
}
},
computed: {
linkInfo () {
return this.$store.state.linkInfo
},
routKey() {
return this.$route.path
},
searchTime() {
let time = this.time.start + '/' + this.time.end
return time
}
},
mounted() {
// this.onLoad()
},
methods: {
gotoDetail(model) {
// console.log(model)
this.$emit('gotoDetail', model)
},
onRefresh() {
this.currentPage = 1
this.isRefreshing = true
this.getPostData()
},
onLoad() {
this.isLoading = true
this.getPostData()
},
getPostData() {
let _this = this
let data = {
'dbName': 'erp_test_shaphar-上药控股有限公司-204-23528', // 'erp_ogg_shaphar',
'start': _this.currentPage,
'length': _this.pageSize,
'goods': ''
}
getMyInvoiceList(data).then(rt => {
if (rt.code === 1 || rt.code === '1') {
if (_this.isRefreshing) {
_this.invoiceList = rt.data
} else if (rt.data || rt.data.length > 0) {
_this.invoiceList = _this.invoiceList.concat(rt.data)
}
// 重置刷新提示
_this.isRefreshing = false
// 重置加载更多提示
_this.isLoading = false
if (rt.data.length < 10) {
_this.finished = true
} else {
// 加载成功后下一页自增1
_this.currentPage++
}
} else {
_this.$toast(rt.message)
_this.isRefreshing = false
_this.error = true
_this.finished = false
}
// 加载状态结束
_this.isLoading = false
}).catch(e => {
this.$toast('获取信息失败！')
_this.isRefreshing = false
_this.isLoading = false
_this.error = true
_this.finished = true
})
}
}
}
</script>
<style lang="scss" scoped>
#orderInvoiecDetailList {
height: 100%;
.content{
height: 100%;
overflow-x: hidden;
overflow-y: auto;
margin: 10PX;
.invoiceItem{
height: 230PX;
background-color: white;
margin-bottom: 10PX;
border-radius: 10PX;
font-size: 14PX;
color: #333333;
}
}
}
</style>
src/views/myOrder/orderInvoice/invoiecDetail/orderInvoiecHead.vue 0 → 100644
View file @ ecc53607
<template>
<div id="invoiecHead">
<div class="content">
<div class="taxIncluded">
<div class="taxAmount">￥377,898.00</div>
<div class="taxAmountSub">含税金额</div>
</div>
<div class="noTaxInfo">
<div class="noTax">
<div class="noTaxAmount">￥377,000.00</div>
<div class="noTaxAmountSub">无税金额</div>
</div>
<div class="taxNumber">
<div class="tax">￥377,000.00</div>
<div class="taxSub">无税金额</div>
</div>
</div>
<van-divider :style="{ color: '#FFFFFF', borderColor: '#FFFFFF', margin: '10PX 0 10PX 0'}"/>
<div class="invoiecInfo">
<div class="cellInfo">
<div class="title">发票号：</div>
<div class="info">837418787438178</div>
</div>
<!-- <div class="cellInfo">
<div class="title">发票代码：</div>
<div class="info">837418787438178</div>
</div> -->
<div class="cellInfo">
<div class="title">发票日期：</div>
<div class="info">2020-11-13 09:00</div>
</div>
</div>
</div>
</div>
</template>
<script>
import {getFormateDate} from '@/utils/common'
export default {
name: 'InvoiecHead',
components: {
},
data() {
return {
tabsTitle: [],
moreSearchShow: false,
activeTab: 'home',
moreSearchInfo: {
//接收搜索更多回传的数据
supplier: { comPartyId: "" }, //供应商ID
goods: { comGoodsId: "" }, //商品ID
orderNo: "", //订单编号
time: {
//起始时间
start: getFormateDate(new Date(), "yyyy-MM-dd"),
end: getFormateDate(new Date(), "yyyy-MM-dd"),
},
},
invoiceList: []
}
},
computed: {
linkInfo () {
return this.$store.state.linkInfo
},
routKey() {
return this.$route.path
},
searchTime() {
let time = this.time.start + '/' + this.time.end
return time
}
},
mounted() {
},
methods: {
onBrowserBack() {
this.$router.go(-1)
},
onSearch() {
},
}
}
</script>
<style lang="scss" scoped>
#invoiecHead {
.content{
height: 250PX;
width: 100%;
background-color: $main1;
padding: 10pX;
color: white;
.taxIncluded{
text-align: center;
margin-bottom: 10PX;
.taxAmount{
font-size: 26PX;
font-weight: 550;
line-height: 40px;
height: 40PX
}
.taxAmountSub{
font-size: 16PX;
line-height: 30px;
height: 30PX
}
}
.noTaxInfo{
display: flex;
text-align: center;
font-size: 16PX;
line-height: 25PX;
.noTax{
width: 50%;
border-right:1px solid #ffffff;
.noTaxAmount{
font-weight: 550;
}
}
.taxNumber{
width: 50%;
.tax{
font-weight: 550;
}
}
}
.invoiecInfo{
font-size: 15PX;
.cellInfo{
display: flex;
line-height: 24PX;
.title{
width: 25%;
text-align: right;
}
.info{
width: 60%;
.price{
font-size: 16PX;
font-weight: 600;
color: red;
}
}
.btn {
width: 10%;
}
}
}
}
}
</style>
src/views/myOrder/orderInvoice/invoiecDetail/orderInvoiecListItem.vue 0 → 100644
View file @ ecc53607
<template>
<div id="orderInvoiecListItem">
<div class="itemInfo">
<div class="orderNum">
<van-image fit="contain" width="45" height="50" :src="sphImage"/>
<div class="num">订单号：34678649876</div>
<van-button style="margin: auto;" class="numBtn" round plain size="mini" type="info">复制</van-button>
</div>
<div class="divider"></div>
<div class="invoiecInfo">
<div class="name">[132521] 阿西匹林/0.25g*200s/浙江恒瑞制药有限公司</div>
<div class="cellInfo">
<div class="batch">开票数量：4809</div>
<!-- <div class="numBer"> 开票数量：480</div> -->
</div>
<van-divider :style="{ color: '#999999', borderColor: '#999999', margin: '5PX 0 5PX 0'}"/>
<div class="cellInfo">
<div class="leftInfo">
<div class="title">无税单价：</div>
<div class="value">7.52</div>
</div>
<div class="rightInfo">
<div class="title">单品无税金额：</div>
<div class="value"> 3616.00</div>
</div>
</div>
<div class="cellInfo">
<div class="leftInfo">
<div class="title">含税单价：</div>
<div class="value">7.52</div>
</div>
<div class="rightInfo">
<div class="title">单品含税金额：</div>
<div class="value"> 3616.00</div>
</div>
</div>
<div class="cellInfo">
<div class="leftInfo">
<div class="title">税率：</div>
<div class="value">7.52</div>
</div>
<div class="rightInfo">
<div class="title">税额：</div>
<div class="value"> 3616.00</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'OrderInvoiecListItem',
components: {
},
data() {
return {
sphImage: require('@/assets/img/u48.png'),
}
},
props: {
item: {
type: Object,
default: () => {
return {
}
}
}
},
computed: {
linkInfo () {
return this.$store.state.linkInfo
},
routKey() {
return this.$route.path
},
searchTime() {
let time = this.time.start + '/' + this.time.end
return time
}
},
mounted() {
// this.onLoad()
},
methods: {
onRefresh() {
}
}
}
</script>
<style lang="scss" scoped>
#orderInvoiecListItem {
.itemInfo{
.divider{
width: 100%;
height: 1PX;
background: linear-gradient(to right, #ccc 0%, #ccc 50%, transparent 50%);
background-size: 10PX 1PX;
background-repeat: repeat-x;
}
.orderNum{
display: flex;
line-height: 50PX;
height: 50PX;
margin: 0PX 10PX;
.num{
width: 80%;
padding-left: 5PX;
}
}
.invoiecInfo{
margin: 0PX 10PX;
// display: flex;
.name {
margin-top: 10PX;
height: 50PX;
width: 100%;
font-weight: 600;
white-space: pre-line;
word-break: break-all;
word-wrap: break-word;
}
.cellInfo{
display: flex;
line-height: 25PX;
.batch{
width: 50%;
}
.numBer{
width: 50%;
text-align: right;
}
.leftInfo{
width: 50%;
display: flex;
.title{
width: 45%;
text-align: right;
}
.value{
width: 55%;
text-align: left;
}
}
.rightInfo{
width: 50%;
display: flex;
.title{
width: 65%;
text-align: right;
}
.value{
width: 35%;
text-align: left;
}
}
}
}
}
}
</style>
src/views/myOrder/orderInvoice/orderInvoiceList.vue 0 → 100644
View file @ ecc53607
<template>
<div id="orderInvoiceList">
<div class="content">
<van-pull-refresh class="list" ref="supplierList" v-model="isRefreshing" @refresh="onRefresh">
<van-list
v-model="isLoading"
:finished="finished"
finished-text="没有更多了"
:error.sync="error"
error-text="请求失败，点击重新加载"
@load="onLoad">
<div class="invoiceItem" @click="gotoDetail(item)"
v-for="(item, index) in invoiceList"
:key="index">
<order-invoiec-list-item :item="item"/>
</div>
</van-list>
</van-pull-refresh>
</div>
</div>
</template>
<script>
// 引入接口
import { getMyInvoiceList } from '@/api/myInvoice'
import orderInvoiecListItem from './orderInvoiecListItem.vue'
export default {
name: 'OrderInvoiceList',
components: {
orderInvoiecListItem
},
data() {
return {
currentPage: 1,
pageSize: 10,
isRefreshing: false,
isLoading: false,
finished: false,
error: false,
logInfoShow: false,
invoiceList: [],
invoiceItem: {},
sphImage: require('@/assets/img/u48.png'),
}
},
computed: {
linkInfo () {
return this.$store.state.linkInfo
},
routKey() {
return this.$route.path
},
searchTime() {
let time = this.time.start + '/' + this.time.end
return time
}
},
mounted() {
// this.onLoad()
},
methods: {
gotoDetail(model) {
// console.log(model)
this.$emit('gotoDetail', model)
},
onRefresh() {
this.currentPage = 1
this.isRefreshing = true
this.getPostData()
},
onLoad() {
this.isLoading = true
this.getPostData()
},
getPostData() {
let _this = this
let data = {
'dbName': 'erp_test_shaphar-上药控股有限公司-204-23528', // 'erp_ogg_shaphar',
'start': _this.currentPage,
'length': _this.pageSize,
'goods': ''
}
getMyInvoiceList(data).then(rt => {
if (rt.code === 1 || rt.code === '1') {
if (_this.isRefreshing) {
_this.invoiceList = rt.data
} else if (rt.data || rt.data.length > 0) {
_this.invoiceList = _this.invoiceList.concat(rt.data)
}
// 重置刷新提示
_this.isRefreshing = false
// 重置加载更多提示
_this.isLoading = false
if (rt.data.length < 10) {
_this.finished = true
} else {
// 加载成功后下一页自增1
_this.currentPage++
}
} else {
_this.$toast(rt.message)
_this.isRefreshing = false
_this.error = true
_this.finished = false
}
// 加载状态结束
_this.isLoading = false
}).catch(e => {
this.$toast('获取信息失败！')
_this.isRefreshing = false
_this.isLoading = false
_this.error = true
_this.finished = true
})
}
}
}
</script>
<style lang="scss" scoped>
#orderInvoiceList {
height: 100%;
.content{
height: 100%;
overflow-x: hidden;
overflow-y: auto;
padding: 10PX;
.invoiceItem{
// height: 145PX;
background-color: white;
margin-bottom: 10PX;
border-radius: 10PX;
font-size: 14PX;
color: #333333;
padding: 5PX 0PX;
}
}
}
</style>
src/views/myOrder/orderInvoice/orderInvoiecDetail.vue 0 → 100644
View file @ ecc53607
<template>
<div id="orderInvoiecDetail">
<div class="content">
<order-invoiec-head/>
</div>
<div class="list">
<order-invoiec-detail-list/>
</div>
<!-- <high-search v-model="moreSearchShow" @onsearch="moreSearchConfirm" @onclean="moreSearchClean"/> -->
</div>
</template>
<script>
import {getFormateDate} from '@/utils/common'
import orderInvoiecHead from './invoiecDetail/orderInvoiecHead.vue'
import orderInvoiecDetailList from './invoiecDetail/orderInvoiecDetailList.vue'
export default {
name: 'OrderInvoiecDetail',
components: {
orderInvoiecHead,
orderInvoiecDetailList
},
data() {
return {
tabsTitle: [],
moreSearchShow: false,
activeTab: 'home',
moreSearchInfo: {
//接收搜索更多回传的数据
supplier: { comPartyId: "" }, //供应商ID
goods: { comGoodsId: "" }, //商品ID
orderNo: "", //订单编号
time: {
//起始时间
start: getFormateDate(new Date(), "yyyy-MM-dd"),
end: getFormateDate(new Date(), "yyyy-MM-dd"),
},
},
invoiceList: []
}
},
computed: {
linkInfo () {
return this.$store.state.linkInfo
},
routKey() {
return this.$route.path
},
searchTime() {
let time = this.time.start + '/' + this.time.end
return time
}
},
mounted() {
// 设置标题栏关闭返回按钮
this.$store.commit('setNavBar', {
show: true,
leftArrow: true,
rightIcon: false,
title: '',
leftText: '发票明细',
leftClick: this.onBrowserBack,
rightClick: this.onMoreSearch
})
// 给window添加一个popstate事件，拦截返回键，执行this.onBrowserBack事件，addEventListener需要指向一个方法
window.addEventListener('popstate', this.onBrowserBack, false)
},
destroyed() {
// 当页面销毁必须要移除这个事件，vue不刷新页面，不移除会重复执行这个事件
window.removeEventListener('popstate', this.onBrowserBack, false)
},
methods: {
onBrowserBack() {
this.$router.go(-1)
},
onSearch() {
},
onMoreSearch() {
this.moreSearchShow = !this.moreSearchShow
if (this.moreSearchShow) {
window.history.pushState(null, null, document.URL)
}
},
// 高级搜索查询
moreSearchConfirm(data) {
console.log('000000000')
},
// 高级搜索取消
moreSearchClean(data) {
this.moreSearchInfo = data;
},
closeAppPage() {
console.log('关闭页面')
bridge.closeWindow_c()
}
}
}
</script>
<style lang="scss" scoped>
#orderInvoiecDetail {
height: 100%;
width: 100%;
.list{
height: calc(100vh - 245PX);
margin-top: -40PX;
}
}
</style>
src/views/myOrder/orderInvoice/orderInvoiecListItem.vue 0 → 100644
View file @ ecc53607
<template>
<div id="invoiecListItem">
<div class="invoiecrInfo">
<div class="cellInfo">
<div class="title">发票号：</div>
<div class="info">XS837418787438178</div>
</div>
<div class="cellInfo">
<div class="title">发票日期：</div>
<div class="info">2021-03-08</div>
</div>
<div class="cellInfo">
<div class="title">发票金额：</div>
<div class="info" style="font-weight: 600;font-size: 16PX;">￥<span class="price">377,899.00</span></div>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'InvoiecListItem',
components: {
},
data() {
return {
sphImage: require('@/assets/img/u48.png'),
}
},
props: {
item: {
type: Object,
default: () => {
return {
}
}
}
},
computed: {
linkInfo () {
return this.$store.state.linkInfo
},
routKey() {
return this.$route.path
},
searchTime() {
let time = this.time.start + '/' + this.time.end
return time
}
},
mounted() {
// this.onLoad()
},
methods: {
onRefresh() {
}
}
}
</script>
<style lang="scss" scoped>
#invoiecListItem {
height: 100%;
.invoiecrInfo{
font-size: 15PX;
.cellInfo{
display: flex;
line-height: 30PX;
.title{
width: 25%;
text-align: right;
}
.info{
width: 60%;
}
}
}
}
</style>
src/views/myOrder/orderListItem.vue
View file @ ecc53607
......@@ -2,19 +2,24 @@
<div id="orderListItem">
<div class="itemInfo">
<div class="orderNum">
<van-image fit="contain" width="45" height="50" :src="sphImage"/>
<div class="num">订单号：34678649876</div>
<van-image fit="contain" width="50" height="55" :src="sphImage"/>
<div class="num">
<div class="numBer">订单号：34678649876</div>
<van-button color="#D9001B" class="numBtn" round plain size="mini" type="info">退</van-button>
<van-button color="#4b7902" class="numBtn" round plain size="mini" type="info">冷</van-button>
<van-button color="#02a7f0" class="numBtn" round plain size="mini" type="info">精麻</van-button>
</div>
<div class="dian"></div>
<div class="numType"><span>已开单</span></div>
</div>
<div class="divider"></div>
<div class="orderInfo">
<div class="company">
<div class="company" @click="btnAction('details')">
<span style="width: 83%">上药控股有限公司</span>
<span style="margin-right: 5PX;">共8件</span>
<van-icon style="margin: auto 0;" color="#1989fa" name="arrow" />
</div>
<div class="info">
<div class="info" @click="btnAction('details')">
<div class="headImage">
<van-image width="55" height="55"
src="https://img01.yzcdn.cn/vant/cat.jpeg"/>
......@@ -29,16 +34,16 @@
</div>
</div>
</div>
<div class="orderTime">
<div class="orderTime" @click="btnAction('details')">
<van-icon size="20" style="margin: auto 0; width: 7%;" name="clock-o" />
<span style="width: 50%;">2020-11-10 18:09:33</span>
<div class="price">总计：￥<span style="color:red;">10.5</span></div>
</div>
<van-divider :style="{ color: '#999999', borderColor: '#999999', margin: '15PX 0 10PX 0'}"/>
<van-divider :style="{ color: '#999999', borderColor: '#999999', margin: '10PX 0 10PX 0'}"/>
<div class="btnInfo" style="text-align: right;">
<van-button plain size="small" type="info">产看发票</van-button>
<van-button plain size="small" type="info">查看物流</van-button>
<van-button plain size="small" type="info">清货单</van-button>
<van-button @click="btnAction('invoice')" style="border-radius: 5PX;" plain size="small" type="info">查看发票</van-button>
<van-button @click="btnAction('logistics')" style="border-radius: 5PX;" plain size="small" type="info">查看物流</van-button>
<van-button @click="btnAction('clearance')" style="border-radius: 5PX;" plain size="small" type="info">清货单</van-button>
</div>
</div>
</div>
......@@ -81,6 +86,11 @@ export default {
},
methods: {
onRefresh() {
},
// 查看发票 查看物流 清货单
btnAction (type) {
this.item.actionType = type
this.$emit('orderItemAction', this.item)
}
}
}
......@@ -100,11 +110,21 @@ export default {
display: flex;
line-height: 50PX;
height: 50PX;
margin: 0PX 10PX;
// margin: 0PX 10PX;
.num{
width: 77%;
padding-left: 5PX;
}
.numBer{
height: 16PX;
// line-height: 15PX;
}
.numBtn{
height: 13PX;
line-height: 13PX;
min-width: 35PX;
font-size: 8PX;
}
.dian{
width: 12PX;
height: 10PX;
......@@ -118,9 +138,9 @@ export default {
}
}
.orderInfo{
margin: 0PX 10PX;
// margin: 0PX 10PX;
// display: flex;
height: 105PX;
// height: 105PX;
.company {
height: 35PX;
line-height: 35PX;
......@@ -129,7 +149,7 @@ export default {
font-weight: 600;
}
.info{
height: 80PX;
height: 65PX;
display: flex;
.headImage{
// width: 55PX;
......
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