1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495 |
- <template>
- <view >
- <!-- 我的库存 -->
- <view class="content-top">
- <u-navbar :background="background" back-icon-color="#ffffff" is-fixed>
- <u-search placeholder="请输入轮胎规格" :show-action="false" v-model="keyword" style="margin-right: 26rpx;" @change="handleSearch"></u-search>
- </u-navbar>
- <u-tabs ref="tabs" :list="list" bg-color="#0094FE" active-color="#ffffff" inactive-color="#ffffff" font-size="30" :current="current" @change="handleFilterBrand"></u-tabs>
- </view>
- <view class="content-center">
- <view class="list-row u-flex list-title">
- <view class="list-left">轮胎规格</view>
- <view class="list-right">库存</view>
- </view>
- <view class="list-row u-flex">
- <view class="list-left">赛轮 12R22.5 152/149K 18PR S838</view>
- <view class="list-right">160</view>
- </view>
- <view class="list-row u-flex">
- <view class="list-left">赛轮 12R22.5 152/149K 18PR S838</view>
- <view class="list-right">160</view>
- </view>
- </view>
- </view>
- </template>
- <script>
- export default {
- data() {
- return {
- background: {
- backgroundColor: "#0291FD",
- },
- keyword: "",
- current: 0,
- list: [{
- name: "全部"
- },{
- name: "黑骑士"
- },{
- name: "路极"
- },{
- name: "黑盾"
- },{
- name: "赛轮"
- }]
- }
- },
- methods: {
- handleSearch: function(v){
- console.log(v)
- },
- handleFilterBrand: function(v2){
- this.current = v2
- console.log(arguments);
- console.log(v2)
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- .content-top{
- background-color: #0094FE;
- padding-bottom: 119rpx;
- }
- .content-center{
- width: 712rpx;
- margin: -106rpx auto 0 auto;
- border-radius: 20rpx;
- background-color: #FFFFFF;
- height: 335rpx;
- padding: 26rpx;
- .list-row{
- justify-content: space-between;
- border-bottom: 1px solid #E8E8E8;
- padding: 32rpx 0;
- .list-right{
- color: #149EE2;
- text-decoration: underline;
- }
- }
- .list-row.list-title{
- padding-top: 0;
- font-weight: 600;
- .list-right{
- color: #4D4D4D;
- font-weight: 400;
- text-decoration: none;
- }
- }
-
- }
-
- </style>
|