jsm-mall-h5-front/src/packageAttachment/pages/sparePartsInventory/choosingAccessories.vue

<template>
  <view class="sparePartsInventory" style="width: 100%; height: 100vh">
    <zj-page-container>
      <view class="pv30" style="background: #fff">
        <search-input @search="search" />
      </view>
      <view class="pv30 picker-view-bock" v-if="!option.partsWebsitId && !option.websitId">
        <view class="picker-view">
          <picker
            class="picker-select"
            @change="bindPickerChange"
            :value="index"
            :range="websitList"
            range-key="websitName"
          >
            <view class="picker-select-input">{{ websitList[index] ? websitList[index].websitName : '请选择' }}</view>
          </picker>
          <image class="icon_next" src="/static/images/fittingsManagement/icon_next.png" mode="aspectFill"></image>
        </view>
      </view>
      <zj-page-fill :scroll="false">
        <zj-page-container direction="row">
          <view style="width: 180rpx; height: 100%">
            <zj-page-container>
              <zj-page-fill>
                <view
                  v-for="(item, index) in accessoriesList"
                  :key="index"
                  :class="{ accessories_type_a: true, accessories_selected: accessoriesIndex === index }"
                  @tap.stop="accessoriesIndex = index"
                >
                  <view class="accessories_type_text">
                    {{ item }}
                  </view>
                </view>
              </zj-page-fill>
            </zj-page-container>
          </view>
          <zj-page-fill
            zjPageFillClass="zjPageFillClass"
            @scrolltolower="carScrolltolower"
            @refresherrefresh="carRefresherrefresh"
            @refresherrestore="carRefresherrestore"
            :scrollAttribute="{
              'refresher-enabled': false,
              'refresher-triggered': refresherTriggered
            }"
          >
            <view class="scroll_list_view">
              <block v-for="(item, index) in list" :key="index">
                <accessoriesItem
                  :item="item"
                  :id="selItem.id || ''"
                  @selectItem="
                    itm => {
                      selItem = itm
                    }
                  "
                />
              </block>
            </view>
          </zj-page-fill>
        </zj-page-container>
      </zj-page-fill>
      <view class="bottom-container">
        <u-button type="primary" text="保存" @click="save"></u-button>
      </view>
    </zj-page-container>
  </view>
</template>

<script>
import searchInput from '@/components/searchInput.vue'
import zjPageContainer from '@/components/zj-page-container/zj-page-container.vue'
import zjPageFill from '@/components/zj-page-container/zj-page-fill.vue'
import accessoriesItem from './choosingAccessoriesItem.vue'
import getData from './mixins/getData.js'
export default {
  components: {
    searchInput,
    zjPageContainer,
    zjPageFill,
    accessoriesItem
  },
  mixins: [getData],
  data() {
    return {
      selItem: {}
    }
  },
  methods: {
    save() {
      uni.$emit('getAccessoriesItem', this.selItem)
      uni.navigateBack({
        delta: 1
      })
    }
  }
}
</script>

<style scoped lang="scss">
@import './style/style.scss';
</style>