新建订单

li-guang

2020-12-16 6f4ca57f606bf886c9d996c077dbe0fcff6df54b

新建订单

 hive-app/common/styles/index.css

@@ -138,6 +138,9 @@
.justify-start{
    justify-content: flex-start;
}
.justify-end{
    justify-content: flex-end;
}
.justify-around{
    justify-content: space-around;
}

 hive-app/pages.json

@@ -68,6 +68,39 @@
                    "scrollIndicator": "none"
                }
            }
        },
        {
            "path": "pages/workbench/orderList",
            "style": {
                "navigationBarTitleText": "订单列表",
                "navigationBarBackgroundColor":"#FFFFFF",
                "navigationBarTextStyle":"black",
                "app-plus":{ 
                    "scrollIndicator": "none",
                    "titleNView": {
                        "buttons": [
                            {
                                "text": "\ue600",
                                "fontSrc": "/static/iconfont/iconfont.ttf",
                                "fontSize": "18px",
                                "width":"25px",
                                "float":"right"
                            }
                        ]
                    }
                }
            }
        },
        {
            "path": "pages/workbench/selectCustomer",
            "style": {
                "navigationBarTitleText": "选择客户",
                "navigationBarBackgroundColor":"#FFFFFF",
                "navigationBarTextStyle":"black",
                "app-plus":{ 
                    "scrollIndicator": "none"
                }
            }
        }
    ],
    "globalStyle": {

 hive-app/pages/workbench/index.vue

@@ -47,7 +47,7 @@
                    <image class="content-icon" src="../../static/images/order1.png"></image>
                    <text class="font-12 mt-10 font-dark">新建订单</text>
                </view>
                <view class="flex flex-v align-center list-item">
                <view class="flex flex-v align-center list-item" @click="linkTo('./orderList')">
                    <image class="content-icon" src="../../static/images/order2.png"></image>
                    <text class="font-12 mt-10 font-dark">代付款</text>
                </view>
@@ -165,6 +165,11 @@
        methods:{
            appear(){
                
            },
            linkTo(val){
                uni.navigateTo({
                    url:val
                })
            }
        }
    }

 hive-app/pages/workbench/orderList.vue

New file
@@ -0,0 +1,130 @@
<template>
    <!-- 订单列表 -->
    <view>
        <!-- #ifndef H5 -->
        <view class="status_bar"></view>
        <!-- #endif -->
        <view class="input-box">
            <view class="input-icon iconfont iconsousuo"></view>
            <input placeholder="输入会员姓名;手机号;编号查询" class="input" placeholder-class="input-text"/>
        </view>
        <view>
            <h-tabs
                class="tab"
                :tabData="tabs" 
                :config="{
                    color: '#abb1cc',
                    activeColor: '#518EFF',
                    underLineColor: '#518EFF',
                    underLineHeight: 4,
                    fontSize: '30px',
                    itemWidth: 80,
                    underLineWidth: 60,
                }"
            />
            <view class="order">
                <view class="flex justify-between order-number">
                    <text class="font-14">订单号: N202012123556</text>
                    <text class="font-14 blue">待付款</text>
                </view>
                <view class="flex justify-between order-content">
                    <view class="flex flex-v">
                        <text class="font-12">李某某</text>
                        <text class="font-12 gray mt-10">2020-12-15 18:11:01</text>
                    </view>
                    <view class="flex flex-v">
                        <text class="font-12">应付金额</text>
                        <text class="font-12 mt-10">实付金额</text>
                        <text class="font-12 mt-10">欠款总额</text>
                    </view>
                    <view class="flex flex-v">
                        <text class="font-12">$ 8000.00</text>
                        <text class="font-12 mt-10">$ 0.00</text>
                        <text class="font-12 mt-10">$ 8000.00</text>
                    </view>
                </view>
                <view class="flex justify-end">
                    <button class="blue-btn small-btn">取消订单</button>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    import HTabs from "@/components/liuyuno-tabs/liuyuno-tabs.vue";
    export default {
        components: {
            HTabs
        },
        data() {
          return {
            tabs:[
                {
                    state: 1,
                    name: '全部'
                },
                {
                    state: 2,
                    name: '代付款'
                },
                {
                    state: 3,
                    name: '已付款'
                },
                {
                    state: 4,
                    name: '欠款'
                },
            ],
          }  
        }
    }
</script>

<style>
    .input-box{
        margin: 0 15px;
        background: #F8F8F8;
        border-radius: 25px;
        display: flex;
        align-items: center;
        padding: 10px 0;
    }
    .input-icon{
        font-size: 20px;
        margin: 0 16px;
    }
    .input{
        flex: 1;
        font-size: 14px;
    }
    .input-text{
        color: #ABB1CC;
    }
    .tab{
        border-bottom: 1px solid #EDEAF4;
        border-radius: 4px;
        box-shadow:0 6px 6px rgba(237,234,244,0.5);
    }
    .order{
        border: 1px solid #EDEAF4;
        border-radius: 4px;
        box-shadow:0 6px 6px rgba(237,234,244,0.5);
        margin: 10px;
        padding: 0 6px;
    }
    .order-number{
        padding: 10px 6px;
        border-bottom: 1px solid #EDEAF4;
    }
    .order-content{
        padding: 15px 6px;
        border-bottom: 1px solid #EDEAF4;
    }
    .small-btn{
        width: 100px;
        margin: 10px 0;
        line-height: 30px;
    }
</style>

 hive-app/pages/workbench/selectCustomer.vue

New file
@@ -0,0 +1,12 @@
<template>
    <!-- 选择客户 -->
    <view>
		
    </view>
</template>

<script>
</script>

<style>
</style>

 hive-app/static/iconfont/iconfont.css

@@ -1,11 +1,11 @@
@font-face {
  font-family: 'iconfont';  /* project id 2263696 */
  src: url('https://at.alicdn.com/t/font_2263696_mnf8362pruj.eot');
  src: url('https://at.alicdn.com/t/font_2263696_mnf8362pruj.eot?#iefix') format('embedded-opentype'),
  url('https://at.alicdn.com/t/font_2263696_mnf8362pruj.woff2') format('woff2'),
  url('https://at.alicdn.com/t/font_2263696_mnf8362pruj.woff') format('woff'),
  url('https://at.alicdn.com/t/font_2263696_mnf8362pruj.ttf') format('truetype'),
  url('https://at.alicdn.com/t/font_2263696_mnf8362pruj.svg#iconfont') format('svg');
  src: url('https://at.alicdn.com/t/font_2263696_9yynz69zizb.eot');
  src: url('https://at.alicdn.com/t/font_2263696_9yynz69zizb.eot?#iefix') format('embedded-opentype'),
  url('https://at.alicdn.com/t/font_2263696_9yynz69zizb.woff2') format('woff2'),
  url('https://at.alicdn.com/t/font_2263696_9yynz69zizb.woff') format('woff'),
  url('https://at.alicdn.com/t/font_2263696_9yynz69zizb.ttf') format('truetype'),
  url('https://at.alicdn.com/t/font_2263696_9yynz69zizb.svg#iconfont') format('svg');
}

.iconfont {
@@ -16,6 +16,30 @@
  -moz-osx-font-smoothing: grayscale;
}

.iconyanjing:before {
  content: "\e62f";
}

.iconyanjing1:before {
  content: "\e672";
}

.iconshaixuan:before {
  content: "\e75e";
}

.icongouxuan:before {
  content: "\e619";
}

.icondianhua:before {
  content: "\e615";
}

.iconxinxiduanxinsixinduihua:before {
  content: "\e616";
}

.iconarrow-backimg:before {
  content: "\e601";
}

 hive-app/static/iconfont/iconfont.ttf

Binary files differ