小程序

Mr.Zhang

2023-09-12 041c81a20c93a6b8238e810fe9a1adfee9c9d86f

 h5_standard/src/components/common/Access.vue

@@ -1,299 +1,308 @@
<template>
    <van-popup
        v-model:show="props.show"
        position="bottom"
        :style="{ height: '100%' }">
        <div class="title">
            <div class="close" @click="close"><van-icon name="arrow-down" size="30" color="#ffffff" /></div>
        </div>
        <div class="content">
            <!-- <div :class="{ 'content_top': status }" class="content_search">
  <van-popup v-model:show="props.show" position="bottom" :style="{ height: '100%' }">
    <div class="title">
      <div class="close" @click="close"><van-icon name="arrow-down" size="30" color="#ffffff" /></div>
    </div>
    <div class="content">
      <!-- <div :class="{ 'content_top': status }" class="content_search">
                <v-Search ref="V" @searchInput="searchInput" @submit="submit" :isShow="false" placeholder="搜索工装编码"></v-Search>
            </div>
            <div class="content_total">共{{form.total}}条数据</div> -->
            <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
                <van-list
                    v-model:loading="loading"
                    :finished="finished"
                    finished-text="没有更多了~"
                    @load="onLoad">
                    <div class="content_list">
                        <div class="content_list_item" v-for="(item, i) in list" :key="i" @click="jump(item, i)">
                            <div class="wl">
                                <div class="content_list_item_name">{{item.locationName}}</div>
                                <!-- <div class="content_list_item_status green" v-if="item.smodelLabel === Attribute.HG">[{{item.smodelCode}}]</div>
      <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
        <van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了~" @load="onLoad">
          <div class="content_list">
            <div class="content_list_item" v-for="(item, i) in list" :key="i" @click="jump(item, i)">
              <div class="wl">
                <div class="content_list_item_name">{{ item.locationName }}</div>
                <!-- <div class="content_list_item_status green" v-if="item.smodelLabel === Attribute.HG">[{{item.smodelCode}}]</div>
                                <div class="content_list_item_status yellow" v-else-if="item.smodelLabel === Attribute.BL">[{{item.smodelCode}}]</div>
                                <div class="content_list_item_status red" v-else-if="item.smodelLabel === Attribute.BF">[{{item.smodelCode}}]</div>
                                <div class="content_list_item_status black" v-else-if="item.smodelLabel === Attribute.HH">[{{item.smodelCode}}]</div>
                                <div class="content_list_item_name">{{item.categoryBigName ? item.categoryBigName : ''}}{{item.categoryMiddleName ? item.categoryMiddleName : ''}}{{item.categorySmallName ? item.categorySmallName : ''}}-{{item.code}}</div> -->
                            </div>
                            <div class="sx">
                                <span>{{item.materialName ? item.materialName : '-'}} | {{item.materialCode ? item.materialCode : '-'}} | {{item.num}}{{item.umodelName}}</span>
                            </div>
                            <div class="zl">
                                <span>
                                    <span class="green" v-if="item.qualityType == 0">合格</span>
                                    <span class="yellow" v-if="item.qualityType == 1">不良</span>
                                    <span class="red" v-if="item.qualityType == 2">报废</span>
                                    &nbsp;/&nbsp;{{item.pmodelName ? item.pmodelName : '-'}}&nbsp;/&nbsp;{{item.batch ? item.batch : '-'}}
                                </span>
                            </div>
                        </div>
                    </div>
                </van-list>
            </van-pull-refresh>
        </div>
    </van-popup>
              </div>
              <div class="sx">
                <span>{{ item.materialName ? item.materialName : '-' }} | {{ item.materialCode ? item.materialCode : '-' }} |
                  {{ item.num }}{{ item.umodelName }}</span>
              </div>
              <div class="zl">
                <span>
                  <span class="green" v-if="item.qualityType == 0">合格</span>
                  <span class="yellow" v-if="item.qualityType == 1">不良</span>
                  <span class="red" v-if="item.qualityType == 2">报废</span>
                  &nbsp;/&nbsp;{{ item.pmodelName ? item.pmodelName : '-' }}&nbsp;/&nbsp;{{ item.batch ? item.batch : '-' }}
                </span>
              </div>
            </div>
          </div>
        </van-list>
      </van-pull-refresh>
    </div>
  </van-popup>
</template>

<script lang="ts" setup>
    import { defineProps, defineEmits, onMounted, ref, reactive, watch } from 'vue'
    import { checkAllList, toolingList } from '@/apis/WorkOrderAPI'
    // import { findListPageForManual } from '@/apis/agencyAPI'
    import { choiceStockPageByTransfer } from '@/apis/ExWarehouse'
    import { model } from '@/interface'
    import { Attribute } from '@/enum'
    import { judgmentPlatform } from "@/utils/utils"
    import vSearch from '@/components/common/Search.vue'
    import vLableSelection from '@/components/common/LabelSelection.vue'
import { defineProps, defineEmits, onMounted, ref, reactive, watch } from 'vue'
import { checkAllList, toolingList } from '@/apis/WorkOrderAPI'
// import { findListPageForManual } from '@/apis/agencyAPI'
import { choiceStockPageByTransfer } from '@/apis/ExWarehouse'
import { model } from '@/interface'
import { Attribute } from '@/enum'
import { judgmentPlatform } from "@/utils/utils"
import vSearch from '@/components/common/Search.vue'
import vLableSelection from '@/components/common/LabelSelection.vue'

    // 搜索数据接口
    interface form extends model {
        total: number,
        smodelLabel: string,
        categoryId: string
    }
// 搜索数据接口
interface form extends model {
  total: number,
  smodelLabel: string,
  categoryId: string
}

    const form = reactive<form>({
        capacity: 50,
        page: 0,
        total: 0,
        smodelLabel: '',
        categoryId: ''
    })
const form = reactive<form>({
  capacity: 50,
  page: 0,
  total: 0,
  smodelLabel: '',
  categoryId: ''
})

    // 列表数据
    const list: any = ref([]);
    const loading = ref(false);
    const finished = ref(false);
    const refreshing = ref(false)
    let isOne = ref<boolean>(true)
    // const V = ref(null)
    let isOpen = ref<boolean>(true)
// 列表数据
const list: any = ref([]);
const loading = ref(false);
const finished = ref(false);
const refreshing = ref(false)
let isOne = ref<boolean>(true)
// const V = ref(null)
let isOpen = ref<boolean>(true)

    const test = () => {
        // const { text }: any = V.value
        form.smodelLabel = ''
        // V.value.text = ''
    }
const test = () => {
  // const { text }: any = V.value
  form.smodelLabel = ''
  // V.value.text = ''
}

    const clickTag = (tag: string): void => {
        form.categoryId = tag
const clickTag = (tag: string): void => {
  form.categoryId = tag
  list.value = []
  finished.value = false
  form.page = 0
  form.total = 0
  onLoad()
}

// 搜索框
const searchInput = (data: any) => {
  console.log(data)
  form.page = 0
  finished.value = false
  list.value = []
  form.smodelLabel = data
  onLoad()
}

// 搜索提交
const submit = (): void => {
  form.page = 0
  finished.value = false
  list.value = []
  onLoad()
}

// 返回上一页带参数
const jump = (item: any, i: number): void => {
  list.value.splice(i, 1)
  emit('value', item, list.value.length)
}

// 获取工单列表数据
const onLoad = async () => {
  // if (isOne.value) await checkAllLists()
  if (!finished.value) {
    loading.value = true;
    form.page = form.page + 1
    choiceStockPageByTransfer({
      capacity: form.capacity,
      page: form.page,
      model: {
        transferId: props.transferId,
        warehouseId: props.warehouseId
      }
    }).then(res => {
      if (refreshing.value) {
        list.value = []
        finished.value = false
        form.page = 0
        form.total = 0
        onLoad()
    }

    // 搜索框
    const searchInput = (data: any) => {
        console.log(data)
        form.page = 0
        finished.value = false
        refreshing.value = false;
      }
      loading.value = false;
      if (res.code === 200 && res.data.records && res.data.records.length !== 0) {
        form.total = res.data.total
        list.value.push(...res.data.records)
      } else {
        finished.value = true;
      }
    }).catch((err: any) => {
      loading.value = false;
      finished.value = true;
      if (refreshing.value) {
        list.value = []
        form.smodelLabel = data
        onLoad()
    }

    // 搜索提交
    const submit = (): void => {
        form.page = 0
        finished.value = false
        list.value = []
        onLoad()
    }

    // 返回上一页带参数
    const jump = (item: any, i: number): void => {
        list.value.splice(i, 1)
        emit('value', item, list.value.length)
    }

    // 获取工单列表数据
    const onLoad = async () => {
        // if (isOne.value) await checkAllLists()
        if (!finished.value) {
            loading.value = true;
            form.page = form.page + 1
            choiceStockPageByTransfer({
                capacity: form.capacity,
                page: form.page,
                model: {
                    transferId: props.transferId,
                    warehouseId: props.warehouseId
                }
            }).then(res => {
                if (refreshing.value) {
                    list.value = []
                    refreshing.value = false;
                }
                loading.value = false;
                if (res.code === 200 && res.data.records && res.data.records.length !== 0) {
                    form.total = res.data.total
                    list.value.push(...res.data.records)
                } else {
                    finished.value = true;
                }
            }).catch((err: any) => {
                loading.value = false;
                finished.value = true;
                if (refreshing.value) {
                    list.value = []
                    refreshing.value = false;
                }
            })
        }
    }

    // 下拉刷新优化页面
    const onRefresh = () => {
        finished.value = false;
        form.page = 0
        loading.value = true;
        onLoad()
    }

    let status = ref<boolean>(false)

    const props = defineProps({
        show: {     // 是否显示
            type: Boolean,
            required: true
        },
        transferId: {   // 转库单id
            type: String,
            required: false
        },
        warehouseId: {   // 仓库编码
            type: String,
            required: false
        }
        refreshing.value = false;
      }
    })
  }
}

    const emit = defineEmits(['close', 'value'])
// 下拉刷新优化页面
const onRefresh = () => {
  finished.value = false;
  form.page = 0
  loading.value = true;
  onLoad()
}

    // 关闭回调
    const close = () => {
        emit('close')
let status = ref<boolean>(false)

const props = defineProps({
  show: {     // 是否显示
    type: Boolean,
    required: true
  },
  transferId: {   // 转库单id
    type: String,
    required: false
  },
  warehouseId: {   // 仓库编码
    type: String,
    required: false
  }
})

const emit = defineEmits(['close', 'value'])

// 关闭回调
const close = () => {
  emit('close')
}

watch(() => props.show, (news) => {
  if (!news) {
    test()
  } else {
    if (!isOpen.value) {
      list.value = []
      finished.value = false;
      form.page = 0
      loading.value = true;
      onLoad()
    }
    isOpen.value = false
  }
})

    watch(() => props.show, (news) => {
        if (!news) {
            test()
        } else {
            if (!isOpen.value) {
                list.value = []
                finished.value = false;
                form.page = 0
                loading.value = true;
                onLoad()
            }
            isOpen.value = false
        }
    })

    onMounted(() => {
        status.value = judgmentPlatform()
    })
onMounted(() => {
  status.value = judgmentPlatform()
})
</script>

<style lang="scss" scoped>
    .title {
        position: fixed;
        right: 50px;
        bottom: 100px;
        z-index: 9;
        .close {
            width: 80px;
            height: 80px;
            border-radius: 50%;
            background: #999999;
            display: flex;
            align-items: center;
            justify-content: center;
        }
.title {
  position: fixed;
  right: 50px;
  bottom: 100px;
  z-index: 9;

  .close {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #999999;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

.content {
  .content_code {
    position: fixed;
    right: 30px;
    bottom: 100px;

    img {
      width: 138px;
      height: 138px;
    }
    .content {
        .content_code {
            position: fixed;
            right: 30px;
            bottom: 100px;
            img {
                width: 138px;
                height: 138px;
            }
        }
        .content_top {
            top: 0 !important;
        }
        .content_search {
            padding: 30px;
            background: white;
            position: sticky;
            top: 88px;
            z-index: 9;
            .content_search_x {
                height: 24px;
            }
        }
        .content_total {
            padding: 24px 30px;
            background: #F7F7F7;
            font-size: 24px;
            font-weight: 400;
            color: #666666;
        }
        .content_list {
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
            .content_list_item {
                padding: 30px;
                display: flex;
                flex-direction: column;
                border-bottom: 1px solid #ececec;
                .wl {
                    display: flex;
                    align-items: center;
                    .content_list_item_status {
                        font-size: 28px;
                        margin-right: 10px;
                    }
                    .content_list_item_name {
                        font-size: 30px;
                        font-weight: 500;
                        color: #111111;
                    }
                }
                .sx {
                    margin-top: 15px;
                    span {
                        font-size: 26px;
                        font-weight: 400;
                        color: #444444;
                    }
                }
                .zl {
                    margin-top: 15px;
                    span {
                        font-size: 24px;
                        font-weight: 400;
                        color: #666666;
                    }
                }
            }
        }
  }

  .content_top {
    top: 0 !important;
  }

  .content_search {
    padding: 30px;
    background: white;
    position: sticky;
    top: 88px;
    z-index: 9;

    .content_search_x {
      height: 24px;
    }
</style>
  }

  .content_total {
    padding: 24px 30px;
    background: #F7F7F7;
    font-size: 24px;
    font-weight: 400;
    color: #666666;
  }

  .content_list {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;

    .content_list_item {
      padding: 30px;
      display: flex;
      flex-direction: column;
      border-bottom: 1px solid #ececec;

      .wl {
        display: flex;
        align-items: center;

        .content_list_item_status {
          font-size: 28px;
          margin-right: 10px;
        }

        .content_list_item_name {
          font-size: 30px;
          font-weight: 500;
          color: #111111;
        }
      }

      .sx {
        margin-top: 15px;

        span {
          font-size: 26px;
          font-weight: 400;
          color: #444444;
        }
      }

      .zl {
        margin-top: 15px;

        span {
          font-size: 24px;
          font-weight: 400;
          color: #666666;
        }
      }
    }
  }
}</style>