|  | @@ -1,340 +0,0 @@
 | 
	
		
			
				|  |  | -<template>
 | 
	
		
			
				|  |  | -    <a-modal
 | 
	
		
			
				|  |  | -      title="选择产品(select product)"
 | 
	
		
			
				|  |  | -      width="95%"
 | 
	
		
			
				|  |  | -      :visible="visible"
 | 
	
		
			
				|  |  | -      :maskClosable="false"
 | 
	
		
			
				|  |  | -      switchFullscreen
 | 
	
		
			
				|  |  | -      @ok = "handleOk"
 | 
	
		
			
				|  |  | -      @cancel="handleCancel">
 | 
	
		
			
				|  |  | -        <div>
 | 
	
		
			
				|  |  | -          <a-card  :body-style="{ padding: '10px' }" :bordered="false" style="margin: 10px;">
 | 
	
		
			
				|  |  | -            <div class="table-page-search-wrapper">
 | 
	
		
			
				|  |  | -                <a-form :model="queryParams" :label-col="labelCol" :wrapper-col="wrapperCol" @keyup.enter.native="searchQuery">
 | 
	
		
			
				|  |  | -                <a-row :gutter="24">
 | 
	
		
			
				|  |  | -                    <a-col :md="6" :sm="8">
 | 
	
		
			
				|  |  | -                        <a-form-item label="分类(class)">
 | 
	
		
			
				|  |  | -                            <!-- <a-input placeholder="请输入" v-model:value="queryParams.classId"></a-input> -->
 | 
	
		
			
				|  |  | -                            <JSelectInput   v-model:value="queryParams.classId"  placeholder="请选择" :options="classOption" ></JSelectInput>
 | 
	
		
			
				|  |  | -                        </a-form-item>
 | 
	
		
			
				|  |  | -                    </a-col>
 | 
	
		
			
				|  |  | -                    <a-col :md="6" :sm="8">
 | 
	
		
			
				|  |  | -                        <a-form-item label="编码(code)">
 | 
	
		
			
				|  |  | -                            <a-input placeholder="请输入" v-model:value="queryParams.code"></a-input>
 | 
	
		
			
				|  |  | -                        </a-form-item>
 | 
	
		
			
				|  |  | -                    </a-col>
 | 
	
		
			
				|  |  | -                    <a-col :md="6" :sm="8">
 | 
	
		
			
				|  |  | -                        <a-form-item label="中文名(Chinese name)">
 | 
	
		
			
				|  |  | -                            <a-input placeholder="请输入" v-model:value="queryParams.chineseName"></a-input>
 | 
	
		
			
				|  |  | -                        </a-form-item>
 | 
	
		
			
				|  |  | -                    </a-col>
 | 
	
		
			
				|  |  | -                    <template v-if="toggleSearchStatus">
 | 
	
		
			
				|  |  | -                        <a-col :md="6" :sm="8">
 | 
	
		
			
				|  |  | -                            <a-form-item label="英文名(English name)">
 | 
	
		
			
				|  |  | -                                <a-input placeholder="请输入" v-model:value="queryParams.englishName"></a-input>
 | 
	
		
			
				|  |  | -                            </a-form-item>
 | 
	
		
			
				|  |  | -                        </a-col>
 | 
	
		
			
				|  |  | -                        <!-- <a-col :md="6" :sm="8">
 | 
	
		
			
				|  |  | -                            <a-form-item label="规格(specifications)">
 | 
	
		
			
				|  |  | -                                <a-input placeholder="请输入" v-model:value="queryParams.specifications"></a-input>
 | 
	
		
			
				|  |  | -                            </a-form-item>
 | 
	
		
			
				|  |  | -                        </a-col> -->
 | 
	
		
			
				|  |  | -                        <a-col :md="6" :sm="8">
 | 
	
		
			
				|  |  | -                            <a-form-item label="型号(model)">
 | 
	
		
			
				|  |  | -                                <a-input placeholder="请输入" v-model:value="queryParams.model"></a-input>
 | 
	
		
			
				|  |  | -                            </a-form-item>
 | 
	
		
			
				|  |  | -                        </a-col>
 | 
	
		
			
				|  |  | -                        <a-col :md="6" :sm="8">
 | 
	
		
			
				|  |  | -                            <a-form-item label="虚拟产品(virtual product)" :label-col="labelCol1" :wrapper-col="wrapperCol1">
 | 
	
		
			
				|  |  | -                                <JDictSelectTag v-model:value="queryParams.virtualProduct" placeholder="请选择" dictCode="yes_or_no"/>
 | 
	
		
			
				|  |  | -                            </a-form-item>
 | 
	
		
			
				|  |  | -                        </a-col>
 | 
	
		
			
				|  |  | -                        <a-col :md="6" :sm="8">
 | 
	
		
			
				|  |  | -                            <a-form-item label="有害物质(harmful substances)" :label-col="labelCol1" :wrapper-col="wrapperCol1">
 | 
	
		
			
				|  |  | -                                <JDictSelectTag v-model:value="queryParams.harmfulSubstances" placeholder="请选择" dictCode="yes_or_no"/>
 | 
	
		
			
				|  |  | -                            </a-form-item>
 | 
	
		
			
				|  |  | -                        </a-col>
 | 
	
		
			
				|  |  | -                    </template>
 | 
	
		
			
				|  |  | -                    <a-col :md="6" :sm="8">
 | 
	
		
			
				|  |  | -                        <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
 | 
	
		
			
				|  |  | -                            <a-button type="primary" @click="searchQuery" >查询(search)</a-button>
 | 
	
		
			
				|  |  | -                            <a-button type="primary" @click="searchReset"  style="margin-left: 8px">重置(reset)</a-button>
 | 
	
		
			
				|  |  | -                            <a @click="handleToggleSearch" style="margin-left: 8px">
 | 
	
		
			
				|  |  | -                            {{ toggleSearchStatus ? '收起' : '展开' }}
 | 
	
		
			
				|  |  | -                            <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
 | 
	
		
			
				|  |  | -                            </a>
 | 
	
		
			
				|  |  | -                        </span>
 | 
	
		
			
				|  |  | -                    </a-col>
 | 
	
		
			
				|  |  | -                </a-row>
 | 
	
		
			
				|  |  | -            </a-form>
 | 
	
		
			
				|  |  | -           </div>
 | 
	
		
			
				|  |  | -        </a-card>
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -        <a-card  :body-style="{ padding: '10px' }" :bordered="false" style="margin: 10px;">
 | 
	
		
			
				|  |  | -            <a-alert type="info" show-icon class="alert" style="margin-bottom: 8px">
 | 
	
		
			
				|  |  | -            <template #message>
 | 
	
		
			
				|  |  | -                <template v-if="selectedRowKeys.length > 0">
 | 
	
		
			
				|  |  | -                <span>已选中 {{ selectedRowKeys.length }} 条记录</span>
 | 
	
		
			
				|  |  | -                <a-divider type="vertical" />
 | 
	
		
			
				|  |  | -                <a @click="selectedRowKeys = []">清空</a>
 | 
	
		
			
				|  |  | -                </template>
 | 
	
		
			
				|  |  | -                <template v-else>
 | 
	
		
			
				|  |  | -                <span>未选中任何数据</span>
 | 
	
		
			
				|  |  | -                </template>
 | 
	
		
			
				|  |  | -            </template>
 | 
	
		
			
				|  |  | -            </a-alert>
 | 
	
		
			
				|  |  | -            <a-table
 | 
	
		
			
				|  |  | -                :columns="columns"
 | 
	
		
			
				|  |  | -                :row-key="record => record.id"
 | 
	
		
			
				|  |  | -                :data-source="dataSource"
 | 
	
		
			
				|  |  | -                bordered
 | 
	
		
			
				|  |  | -                size="small"
 | 
	
		
			
				|  |  | -                @change="handleTableChange"
 | 
	
		
			
				|  |  | -                :pagination="pagination"
 | 
	
		
			
				|  |  | -                :scroll="{ x: 2500, y: 300 }"
 | 
	
		
			
				|  |  | -                :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
 | 
	
		
			
				|  |  | -            >
 | 
	
		
			
				|  |  | -            </a-table>
 | 
	
		
			
				|  |  | -        </a-card>
 | 
	
		
			
				|  |  | -      </div>
 | 
	
		
			
				|  |  | -    </a-modal>
 | 
	
		
			
				|  |  | -</template>
 | 
	
		
			
				|  |  | -<script lang="ts" setup>
 | 
	
		
			
				|  |  | -    import {ref} from 'vue';
 | 
	
		
			
				|  |  | -    import { defHttp } from '/@/utils/http/axios';
 | 
	
		
			
				|  |  | -    import { message } from 'ant-design-vue';
 | 
	
		
			
				|  |  | -    import { filterObj} from '/@/utils/common/compUtils';
 | 
	
		
			
				|  |  | -    import { JDictSelectTag} from '/@/components/Form';
 | 
	
		
			
				|  |  | -    import JSelectInput from '/@/components/Form/src/jeecg/components/JSelectInput.vue';
 | 
	
		
			
				|  |  | -    const emit = defineEmits([ 'selectProduct']); //定义emit
 | 
	
		
			
				|  |  | -    let classOption = ref([])
 | 
	
		
			
				|  |  | -    var visible = ref(false)
 | 
	
		
			
				|  |  | -    const columns = [
 | 
	
		
			
				|  |  | -        {
 | 
	
		
			
				|  |  | -            title: '分类(class)',
 | 
	
		
			
				|  |  | -            dataIndex: 'classId_dictText',
 | 
	
		
			
				|  |  | -            key: 'classId_dictText',
 | 
	
		
			
				|  |  | -            align:"center"
 | 
	
		
			
				|  |  | -        },
 | 
	
		
			
				|  |  | -        {
 | 
	
		
			
				|  |  | -            title: '编码(code)',
 | 
	
		
			
				|  |  | -            dataIndex: 'code',
 | 
	
		
			
				|  |  | -            key: 'code',
 | 
	
		
			
				|  |  | -            align:"center"
 | 
	
		
			
				|  |  | -        },
 | 
	
		
			
				|  |  | -        {
 | 
	
		
			
				|  |  | -            title: '中文名(Chinese name)',
 | 
	
		
			
				|  |  | -            dataIndex: 'chineseName',
 | 
	
		
			
				|  |  | -            key: 'chineseName',
 | 
	
		
			
				|  |  | -            align:"center",
 | 
	
		
			
				|  |  | -            width:200
 | 
	
		
			
				|  |  | -        },
 | 
	
		
			
				|  |  | -        {
 | 
	
		
			
				|  |  | -            title: '英文名(English name)',
 | 
	
		
			
				|  |  | -            key: 'englishName',
 | 
	
		
			
				|  |  | -            dataIndex: 'englishName',
 | 
	
		
			
				|  |  | -            align:"center"
 | 
	
		
			
				|  |  | -        },
 | 
	
		
			
				|  |  | -        // {
 | 
	
		
			
				|  |  | -        //     title: '规格(specifications)',
 | 
	
		
			
				|  |  | -        //     key: 'specifications',
 | 
	
		
			
				|  |  | -        //     dataIndex: 'specifications',
 | 
	
		
			
				|  |  | -        //     align:"center"
 | 
	
		
			
				|  |  | -        // },
 | 
	
		
			
				|  |  | -        {
 | 
	
		
			
				|  |  | -            title: '型号(model)',
 | 
	
		
			
				|  |  | -            key: 'model',
 | 
	
		
			
				|  |  | -            dataIndex: 'model',
 | 
	
		
			
				|  |  | -            align:"center"
 | 
	
		
			
				|  |  | -        },
 | 
	
		
			
				|  |  | -        {
 | 
	
		
			
				|  |  | -            title: '计量单位(measurement unit)',
 | 
	
		
			
				|  |  | -            key: 'measurementUnit',
 | 
	
		
			
				|  |  | -            dataIndex: 'measurementUnit',
 | 
	
		
			
				|  |  | -            align:"center",
 | 
	
		
			
				|  |  | -            width:250
 | 
	
		
			
				|  |  | -        },
 | 
	
		
			
				|  |  | -        {
 | 
	
		
			
				|  |  | -            title: '虚拟产品(virtual product)',
 | 
	
		
			
				|  |  | -            key: 'virtualProduct',
 | 
	
		
			
				|  |  | -            dataIndex: 'virtualProduct',
 | 
	
		
			
				|  |  | -            align:"center",
 | 
	
		
			
				|  |  | -            customRender:function (t, r, index) {
 | 
	
		
			
				|  |  | -              if(t.text==1){
 | 
	
		
			
				|  |  | -                return '是(yes)'
 | 
	
		
			
				|  |  | -              }else if(t.text==0){
 | 
	
		
			
				|  |  | -                return '否(no)'
 | 
	
		
			
				|  |  | -              }else{
 | 
	
		
			
				|  |  | -                return ''
 | 
	
		
			
				|  |  | -              } 
 | 
	
		
			
				|  |  | -            }
 | 
	
		
			
				|  |  | -        },
 | 
	
		
			
				|  |  | -        {
 | 
	
		
			
				|  |  | -            title: '有害物质(harmful substances)',
 | 
	
		
			
				|  |  | -            key: 'harmfulSubstances',
 | 
	
		
			
				|  |  | -            dataIndex: 'harmfulSubstances',
 | 
	
		
			
				|  |  | -            align:"center",
 | 
	
		
			
				|  |  | -            width:250,
 | 
	
		
			
				|  |  | -            customRender:function (t, r, index) {
 | 
	
		
			
				|  |  | -              if(t.text==1){
 | 
	
		
			
				|  |  | -                return '是(yes)'
 | 
	
		
			
				|  |  | -              }else if(t.text==0){
 | 
	
		
			
				|  |  | -                return '否(no)'
 | 
	
		
			
				|  |  | -              }else{
 | 
	
		
			
				|  |  | -                return ''
 | 
	
		
			
				|  |  | -              } 
 | 
	
		
			
				|  |  | -            }
 | 
	
		
			
				|  |  | -        },
 | 
	
		
			
				|  |  | -    ];
 | 
	
		
			
				|  |  | -    const labelCol = ref({
 | 
	
		
			
				|  |  | -    xs: { span: 24 },
 | 
	
		
			
				|  |  | -    sm: { span: 9 },
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -    const wrapperCol = ref({
 | 
	
		
			
				|  |  | -        xs: { span: 24 },
 | 
	
		
			
				|  |  | -        sm: { span: 15 },
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -    const labelCol1 = ref({
 | 
	
		
			
				|  |  | -    xs: { span: 24 },
 | 
	
		
			
				|  |  | -    sm: { span: 12 },
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -    const wrapperCol1 = ref({
 | 
	
		
			
				|  |  | -        xs: { span: 24 },
 | 
	
		
			
				|  |  | -        sm: { span: 12 },
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -    const dataSource =ref([]);
 | 
	
		
			
				|  |  | -    let selectedRowKeys = ref([]);
 | 
	
		
			
				|  |  | -    let selectedRows = ref([]);
 | 
	
		
			
				|  |  | -    const toggleSearchStatus = ref(false);
 | 
	
		
			
				|  |  | -    const queryParams = ref({
 | 
	
		
			
				|  |  | -        classId:'',
 | 
	
		
			
				|  |  | -        code:'',
 | 
	
		
			
				|  |  | -        chineseName:'',
 | 
	
		
			
				|  |  | -        englishName:'',
 | 
	
		
			
				|  |  | -        specifications:'',
 | 
	
		
			
				|  |  | -        model:'',
 | 
	
		
			
				|  |  | -        chineseAlias:'',
 | 
	
		
			
				|  |  | -        englishAlias:'',
 | 
	
		
			
				|  |  | -        status:'',
 | 
	
		
			
				|  |  | -        virtualProduct:'',
 | 
	
		
			
				|  |  | -        harmfulSubstances:'',
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -    let pagination = ref({
 | 
	
		
			
				|  |  | -      current: 1,
 | 
	
		
			
				|  |  | -      pageSize: 10,
 | 
	
		
			
				|  |  | -      total: '', // 假设总共有100条数据
 | 
	
		
			
				|  |  | -      showSizeChanger: true,
 | 
	
		
			
				|  |  | -      showQuickJumper: true,
 | 
	
		
			
				|  |  | -      showTotal: (total, range) => {
 | 
	
		
			
				|  |  | -          return range[0] + "-" + range[1] + " 共" + total + "条"
 | 
	
		
			
				|  |  | -      },
 | 
	
		
			
				|  |  | -      size:'small'
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -    function loadData(){
 | 
	
		
			
				|  |  | -        let params = getQueryParams();
 | 
	
		
			
				|  |  | -        defHttp
 | 
	
		
			
				|  |  | -        .get({ url: '/baseCode/baseProductArchive/list',params}, { isTransformResponse: false })
 | 
	
		
			
				|  |  | -        .then((res) => {
 | 
	
		
			
				|  |  | -            if (res.success) {
 | 
	
		
			
				|  |  | -                dataSource.value = res.result.records;
 | 
	
		
			
				|  |  | -                pagination.value.total = res.result.total;
 | 
	
		
			
				|  |  | -                pagination.value.current = res.result.current;
 | 
	
		
			
				|  |  | -                pagination.value.pageSize = res.result.size;                
 | 
	
		
			
				|  |  | -            } else {
 | 
	
		
			
				|  |  | -                message.error(res.message);
 | 
	
		
			
				|  |  | -            }
 | 
	
		
			
				|  |  | -        })
 | 
	
		
			
				|  |  | -        .finally(() => {
 | 
	
		
			
				|  |  | -            // loading.value = false;
 | 
	
		
			
				|  |  | -        });
 | 
	
		
			
				|  |  | -    }
 | 
	
		
			
				|  |  | -    function getQueryParams(){
 | 
	
		
			
				|  |  | -        let params = Object.assign(queryParams.value);
 | 
	
		
			
				|  |  | -        params.pageNo = pagination.value.current;
 | 
	
		
			
				|  |  | -        params.pageSize = pagination.value.pageSize;
 | 
	
		
			
				|  |  | -        return filterObj(params);
 | 
	
		
			
				|  |  | -    }
 | 
	
		
			
				|  |  | -    function handleTableChange(paginations, filters, sorter){
 | 
	
		
			
				|  |  | -        pagination.value.total = paginations.total;
 | 
	
		
			
				|  |  | -        pagination.value.current = paginations.current;
 | 
	
		
			
				|  |  | -        pagination.value.pageSize = paginations.pageSize;
 | 
	
		
			
				|  |  | -        loadData()
 | 
	
		
			
				|  |  | -    };
 | 
	
		
			
				|  |  | -    function getOptiom(){
 | 
	
		
			
				|  |  | -    defHttp
 | 
	
		
			
				|  |  | -        .get({ url: 'baseCode/baseProductClass/list'}, { isTransformResponse: false })
 | 
	
		
			
				|  |  | -        .then((res) => {
 | 
	
		
			
				|  |  | -            if (res.success) {
 | 
	
		
			
				|  |  | -              classOption.value = []
 | 
	
		
			
				|  |  | -              res.result.records.forEach(element => {
 | 
	
		
			
				|  |  | -                  var obj = {
 | 
	
		
			
				|  |  | -                    label: element.name?element.name:'无名称请维护',
 | 
	
		
			
				|  |  | -                    value: element.id?element.id:''
 | 
	
		
			
				|  |  | -                  };
 | 
	
		
			
				|  |  | -                  classOption.value.push( obj)
 | 
	
		
			
				|  |  | -              });    
 | 
	
		
			
				|  |  | -            }
 | 
	
		
			
				|  |  | -        })
 | 
	
		
			
				|  |  | -        .finally(() => {
 | 
	
		
			
				|  |  | -            // loading.value = false;
 | 
	
		
			
				|  |  | -        });
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -    function searchQuery(){
 | 
	
		
			
				|  |  | -        loadData();
 | 
	
		
			
				|  |  | -    }
 | 
	
		
			
				|  |  | -    function searchReset(){
 | 
	
		
			
				|  |  | -        queryParams.value = {
 | 
	
		
			
				|  |  | -            classId:'',
 | 
	
		
			
				|  |  | -            code:'',
 | 
	
		
			
				|  |  | -            chineseName:'',
 | 
	
		
			
				|  |  | -            englishName:'',
 | 
	
		
			
				|  |  | -            specifications:'',
 | 
	
		
			
				|  |  | -            model:'',
 | 
	
		
			
				|  |  | -            chineseAlias:'',
 | 
	
		
			
				|  |  | -            englishAlias:'',
 | 
	
		
			
				|  |  | -            status:'',
 | 
	
		
			
				|  |  | -            virtualProduct:'',
 | 
	
		
			
				|  |  | -            harmfulSubstances:'',
 | 
	
		
			
				|  |  | -        }
 | 
	
		
			
				|  |  | -        pagination.value.current =1;
 | 
	
		
			
				|  |  | -        pagination.value.pageSize = 10; 
 | 
	
		
			
				|  |  | -        loadData();
 | 
	
		
			
				|  |  | -    }
 | 
	
		
			
				|  |  | -    function handleToggleSearch(){
 | 
	
		
			
				|  |  | -        toggleSearchStatus.value = !toggleSearchStatus.value;
 | 
	
		
			
				|  |  | -    }
 | 
	
		
			
				|  |  | -    function onSelectChange(keys,rows){
 | 
	
		
			
				|  |  | -        selectedRowKeys.value = keys
 | 
	
		
			
				|  |  | -        selectedRows.value = rows
 | 
	
		
			
				|  |  | -    }
 | 
	
		
			
				|  |  | -    function handleOk(){
 | 
	
		
			
				|  |  | -      if(selectedRowKeys.value.length==0){
 | 
	
		
			
				|  |  | -        message.error('请勾选数据');
 | 
	
		
			
				|  |  | -      }else{
 | 
	
		
			
				|  |  | -        emit('selectProduct', selectedRows.value)
 | 
	
		
			
				|  |  | -        handleCancel()
 | 
	
		
			
				|  |  | -      }
 | 
	
		
			
				|  |  | -    }
 | 
	
		
			
				|  |  | -    function handleCancel(){
 | 
	
		
			
				|  |  | -      visible.value = false
 | 
	
		
			
				|  |  | -      selectedRowKeys.value = []
 | 
	
		
			
				|  |  | -      selectedRows.value=[]
 | 
	
		
			
				|  |  | -    }
 | 
	
		
			
				|  |  | -    function getTable(){
 | 
	
		
			
				|  |  | -        visible.value = true
 | 
	
		
			
				|  |  | -        loadData()
 | 
	
		
			
				|  |  | -        getOptiom()
 | 
	
		
			
				|  |  | -    }
 | 
	
		
			
				|  |  | -    defineExpose({
 | 
	
		
			
				|  |  | -      getTable
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -</script>
 | 
	
		
			
				|  |  | -<style scoped lang="less">
 | 
	
		
			
				|  |  | -/deep/.ant-form-item{
 | 
	
		
			
				|  |  | -    margin-bottom: 8px !important;
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | -// /deep/.ant-table-wrapper .ant-table-thead > tr > th, .ant-table-wrapper .ant-table-thead > tr > td{
 | 
	
		
			
				|  |  | -//     padding: 8px !important;
 | 
	
		
			
				|  |  | -// }
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -</style>
 |