Authored by 张文文

Merge branch 'develop' of http://git.yoho.cn/fe/xianyu-ufo-app-web into develop

<template>
<div class="count-down-wrapper">
<span></span>
</div>
</template>
<script>
export default {
props: {
leftTime: {
type: Number,
default: 0
}
},
data() {
return {
remainTime: this.props.leftTime,
countDown: "",
timeoutId: null
};
},
mounted() {
this.countDown = this.formatTime();
this.timeoutId = setInterval(() => {
this.remainTime--;
this.countDown = this.formatTime();
}, 1000);
},
destroyed() {
clearInterval(this.timeoutId);
},
computed: {
timeList: function() {}
},
methods: {
formatTime() {
if (this.remainTime < 0) {
return ["00", "00", "00"];
}
let remainTime = this.remainTime;
const hourInSecond = 60 * 60;
const numberOfHours = Math.floor(this.remainTime / hourInSecond);
remainTime = remainTime - numberOfHours * hourInSecond;
const numberOfMinutes = Math.floor(remainTime / 60);
const numberOfSeconds = remainTime - numberOfMinutes * 60;
return [numberOfHour, numberOfMinute, numberOfSeconds].map(time => {
return time < 10 ? `0${time}` : `${time}`;
});
}
}
};
</script>
<style lang="scss" scoped>
.count-down-wrapper {
display: flex;
}
</style>
\ No newline at end of file
... ...
... ... @@ -137,57 +137,7 @@ export default {
default:
return;
}
},
createDialog(options) {
const {
confirmBtn,
cancelBtn,
onConfirm,
onCancle,
content,
...config
} = options;
this.$createDialog(config, createElement => {
return [
createElement(
"a",
{
class: {
"cube-dialog-btn border-top-1px action-confirm": true
},
slot: "btns",
on: {
click: () => {
console.log("--------btn------");
}
}
},
confirmBtn.text
),
createElement(
"a",
{
class: {
"cube-dialog-btn border-top-1px action-cancel": true
},
slot: "btns"
},
cancelBtn.text
),
createElement(
"p",
{
class: {
"action-dialog-content": true
},
slot: "content"
},
content
)
];
}).show();
},
onActionConfirm() {}
}
}
};
</script>
... ...
<template>
<div class="tempty-wrapper">
<i></i>
<p>这里什么都没有...</p>
</div>
</template>
<script>
export default {};
</script>
<style lang="scss" scoped>
.tempty-wrapper {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 170px;
& > i {
width: 280px;
height: 280px;
background: url("~statics/image/order/order-list-empty@3x.png");
display: block;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
& > p {
margin-top: 20px;
font-size: 28px;
color: #ccc;
}
}
</style>
\ No newline at end of file
... ...
<template>
<div class="order-info-wrapper">
<span>订单编号:{{ order.orderCode }}</span>
<span class="status">{{ order.statuStr }}</span>
</div>
</template>
<script>
export default {
props: {
order: {
type: Object,
default: {}
}
}
};
</script>
<style lang="scss" scoped>
.order-info-wrapper {
font-size: 24px;
letter-spacing: 0;
display: flex;
justify-content: space-between;
margin-bottom: 40px;
.status {
font-weight: bold;
}
}
</style>
\ No newline at end of file
... ...
... ... @@ -5,22 +5,29 @@
:options="options"
:data="orderList"
class="order-list-scroll-wrap"
v-show="!isShowEmpty"
>
<ul class="list-wrapper">
<li v-for="order in orderList" :key="order.orderCode">
<order-info :order="order" />
<order-list-item :order="order" />
<!-- 订单操作 -->
<order-actions :order="order" />
</li>
</ul>
</scroll>
<empty-list v-show="isShowEmpty" />
</div>
</template>
<script>
import { Button, Scroll } from "cube-ui";
import { Scroll } from "cube-ui";
import { createNamespacedHelpers } from "vuex";
import OrderListItem from "./components/order-item";
import OrderInfo from "./components/order-info.vue";
import EmptyList from "./components/empty";
import OrderActions from "../components/order-actions";
const { mapActions, mapState, mapGetters } = createNamespacedHelpers(
... ... @@ -29,13 +36,14 @@ const { mapActions, mapState, mapGetters } = createNamespacedHelpers(
export default {
components: {
Button,
Scroll,
OrderListItem,
OrderActions
OrderActions,
OrderInfo,
EmptyList
},
computed: {
...mapState(["entryOrder", "notEntryOrder"]),
...mapState(["entryOrder", "notEntryOrder", "isShowEmpty"]),
...mapGetters(["orderList", "pullUpload"]),
options: function() {
return {
... ...
<template>
<div class="content-wrapper">
<status-nav />
<scroll
@pulling-up="fetchMore"
:options="options"
:data="orderList"
class="order-list-scroll-wrap"
v-show="!isShowEmpty"
>
<ul class="list-wrapper">
<li v-for="order in orderList" :key="order.orderCode">
<order-info :order="order" />
<order-list-item :order="order" />
<!-- 订单操作 -->
<order-actions :order="order" />
</li>
</ul>
<Modal v-model="isShowModal" @on-sure="() => {}"></Modal>
</scroll>
<empty-list v-show="isShowEmpty" />
</div>
</template>
<script>
import { Button, Scroll } from "cube-ui";
import { Scroll } from "cube-ui";
import { createNamespacedHelpers } from "vuex";
import OrderListItem from "./components/order-item";
import StatusNav from "./components/status-nav";
import Modal from "../components/confirm/modal";
import OrderInfo from "./components/order-info.vue";
import EmptyList from "./components/empty";
import OrderActions from "../components/order-actions";
const { mapActions, mapState, mapMutations } = createNamespacedHelpers(
... ... @@ -33,15 +40,15 @@ const { mapActions, mapState, mapMutations } = createNamespacedHelpers(
export default {
components: {
Button,
Scroll,
OrderListItem,
StatusNav,
Modal,
OrderActions
OrderActions,
OrderInfo,
EmptyList
},
computed: {
...mapState(["orderList", "pullUpLoad", "isShowModal"]),
...mapState(["orderList", "pullUpLoad", "isShowEmpty"]),
options: function() {
return {
pullUpLoad: this.pullUpLoad
... ...
... ... @@ -16,6 +16,7 @@ export default function() {
list: [], // 订单列表
pullUpload: true,
},
isShowEmpty: false,
},
mutations: {
setEntryOrder(state, res) {
... ... @@ -33,6 +34,9 @@ export default function() {
setNotEntryOrder(state, res) {
let { page, pagetotal, data = [] } = res;
state.isShowEmpty =
state.entryOrder.list.length === 0 && page === 1 && data.length === 0;
state.notEntryOrder.page = ++page;
state.notEntryOrder.pagetotal = pagetotal;
state.notEntryOrder.list = state.entryOrder.list.concat(data);
... ...
... ... @@ -13,14 +13,13 @@ export default function() {
currentStatus: 1,
routerParam: {},
isShowModal: false,
// 订单操作
isShowEmpty: false,
},
mutations: {
setOrderList(state, res) {
let { page, pagetotal, data = [] } = res;
state.isShowEmpty = page === 1 && data.length === 0;
state.page = ++page;
state.pagetotal = pagetotal;
state.orderList = state.orderList.concat(data);
... ...