<template>
  <view>
    <up-popup :show="addConfigShow" round="10" @close="addConfigShow = false">
      <view class="text-center">标准物质选择</view>
      <view class="x-bc mt8">
        <up-button size="small" style="width: 60px" text="取消" @click="handleCancel"></up-button>
        <up-button size="small" style="width: 60px" type="primary" text="确认" @click="handleAdd"></up-button>
      </view>
      <scroll-view style="height: 60vh" scroll-y scroll-with-animation class="mt16 pl16">
        <template v-if="standardList.length > 0">
          <u-checkbox-group placement="column" v-model="selectRows">
            <view v-for="(item, index) in standardList">
              <u-checkbox :name="item.id">
                <template #label>
                  <view class="x-f p8 border-b">
                    <view>{{ item.name }}</view>
                    <view class="pl16 pr16">{{ item.code }}</view>
                    <view class="pl16 pr16">{{ item.modelNo }}</view>
                  </view>
                </template>
              </u-checkbox>
            </view>
          </u-checkbox-group>
        </template>
        <up-empty v-else text="暂无数据" mode="list"> </up-empty>
      </scroll-view>
    </up-popup>
  </view>
</template>

<script setup>
import { ref, computed } from 'vue'
import nx from '@/nx'

let emits = defineEmits(['confirm'])
const addConfigShow = ref(false)
function show() {
  addConfigShow.value = true
  selectRows.value = []
  current.value = undefined
  getList()
}
const standardList = ref([])
const current = ref(undefined)
const getList = async () => {
  standardList.value = []
  const param = {
    standardMaterialFlag: 1,
    pageNo: 1,
    pageSize: 1000
  }
  const { list } = await nx.$api.material.queryMaterialInformation(param)
  standardList.value = list
}
function handleCancel() {
  addConfigShow.value = false
}
const selectRows = ref([])
function handleAdd() {
  if (selectRows.value.length === 0) {
    return uni.showToast({
      title: '请选择标准物质',
      icon: 'none'
    })
  }
  let list = standardList.value.filter(item => selectRows.value.includes(item.id))
  emits('confirm', list)
  addConfigShow.value = false
}

defineExpose({
  show
})
</script>

<style lang="scss" scoped>
:deep(.u-checkbox__label-wrap) {
  width: 100%;
}
</style>
