feat: ✨ 提取公共的产品代码

src/api/storehouse/index.ts

@@ -59,6 +59,8 @@ export const Storehouse_IotCard_Del = (params: any) => $http.post('/api/storage/
  */
 // 合同列表
 export const Storehouse_Contract_List = (params: any) => $http.post('/api/storage/Contract/List', params)
+// 生成合同编号
+export const Storehouse_Contract_Gen_Number = (params: any) => $http.post('/api/storage/Contract/Gen_Number', params)
 // 合同-销售
 export const Storehouse_Contract_User_List = (params: any) => $http.post('/api/storage/Contract/User_List', params)
 // 详情

src/views/storehouse/inventory/InStorageForm.vue

@@ -8,7 +8,7 @@ import { InStoreageFormType } from '@/hooks/useDepot'
 import InStorageProduct from './InStorageProduct.vue'
 import type { FormInstance, FormRules } from 'element-plus'
 import { Delete, CirclePlus } from '@element-plus/icons-vue'
-import { Storehouse_StockIn_Add, Storehouse_ProductClass_List } from '@/api/storehouse/index'
+import { Storehouse_StockIn_Add } from '@/api/storehouse/index'
 import ImageCom from '@/components/Image/index.vue'
 
 const tableData = ref<any[]>([])
@@ -18,7 +18,6 @@ const ruleFormRef = ref<FormInstance>()
 const drawerRef = ref<InstanceType<typeof Drawer> | null>(null)
 const drawerSnRef = ref<InstanceType<typeof InStorageSn> | null>(null)
 const drawerProductRef = ref<InstanceType<typeof InStorageProduct> | null>(null)
-const classOptions = ref<any[]>([])
 
 const form = reactive<InStoreageFormType>({
   T_number: '',
@@ -146,19 +145,9 @@ const resetForm = (formEl: FormInstance | undefined) => {
 }
 
 /**
- * 获取产品分类
- */
-const getProductClassList = async () => {
-  const res: any = await Storehouse_ProductClass_List({ page: 1, page_z: 999 })
-  classOptions.value = res.Data.Data
-}
-/**
  * 添加产品
  */
-const AddProductionDetailed = () => {
-  !classOptions.value.length && getProductClassList()
-  drawerProductRef.value?.openDrawer()
-}
+const AddProductionDetailed = () => drawerProductRef.value?.openDrawer()
 /**
  * 产品选择 是否
  */

src/views/storehouse/inventory/InStorageProduct.vue

@@ -94,11 +94,19 @@ const getNameAsync = async (str: string): Promise<any> => {
     }
   })
 }
-
+// 获取产品的列表
 const getProductList = async () => {
   const res: any = await Storehouse_Product_List({ ...initParam, T_name: autoSelect.value })
   tableProductData.value.push(...res.Data.Data)
   total = res.Data.Num
+  if (selectProductData.value?.length) {
+    // 设置产品的选中
+    tableProductData.value.forEach((row: any) => {
+      const matchedIndex = selectProductData.value?.findIndex((item: any) => item.Id == row.Id)
+      console.log(matchedIndex)
+      selectTable.value?.toggleRowSelection(row, matchedIndex != -1)
+    })
+  }
 }
 
 // 获取产品分类
@@ -124,12 +132,20 @@ const productColumns = [
 ]
 
 const openDrawer = () => drawerProductRef.value?.openDrawer()
-const clearSelection = () => selectTable.value?.clearSelection()
+const clearSelection = () => {
+  initParam.page = 1
+  tableProductData.value = []
+  selectTable.value?.clearSelection()
+}
 const selectTableChange = (row: any) => {
   nextTick(() => {
     selectTable.value?.toggleRowSelection(row, false)
   })
 }
+
+// props
+const props = defineProps<{ selectProductData?: any[] }>()
+const selectProductData = ref(props.selectProductData)
 const emit = defineEmits<{ (event: 'ontableData', value: any): void; (event: 'ontableDataAll', value: any[]): void }>()
 
 defineExpose({

src/views/storehouse/sales/ContractForm.vue

@@ -7,17 +7,14 @@ import { GlobalStore } from '@/stores/index'
 import Upload from '@/components/Upload/index.vue'
 import {
   Storehouse_Contract_Add,
-  Storehouse_Product_List,
   Storehouse_Contract_Edit,
-  Storehouse_ProductClass_List,
-  Storehouse_Product_Model_List,
-  Storehouse_Product_Name_List,
   Storehouse_Contract_Product_List
 } from '@/api/storehouse/index'
 import { ElMessage } from 'element-plus'
-import { default as vElTableInfiniteScroll } from 'el-table-infinite-scroll'
 import ImageCom from '@/components/Image/index.vue'
+import InStorageProduct from '@/views/storehouse/inventory/InStorageProduct.vue'
 
+const isProduct = ref(false)
 let selectProductData: any[] = []
 const isNew = ref(true)
 const globalStore = GlobalStore()
@@ -25,8 +22,6 @@ const formLabelWidth = ref('120px')
 const ruleFormRef = ref<FormInstance>()
 const drawerRef = ref<InstanceType<typeof Drawer> | null>(null)
 const uploadRef = ref<InstanceType<typeof Upload> | null>(null)
-const selectTable = ref()
-const drawerProductRef = ref<InstanceType<typeof Drawer> | null>(null)
 
 const validate_T_product = (rule: any, value: any, callback: any) => {
   if (form.T_type === 1 && value === '') {
@@ -47,16 +42,14 @@ const rules = reactive<FormRules>({
   T_date: [{ required: true, message: '请选择业务日期', trigger: 'blur' }]
 })
 
-const callbackDrawer = (done: Fn) => {
+const callbackDrawer = (done: () => void) => {
   resetForm(ruleFormRef.value)
   isNew.value = true
-  initParam.T_class = ''
-  initParam.T_model = ''
-  initParam.T_name = ''
-  tableProductData.value = []
+  selectProductData = []
+  drawerProductRef.value?.clearSelection()
+  isProduct.value = false
   done()
 }
-const callbackProductDrawer = (done: Fn) => done()
 
 const resetForm = (formEl: FormInstance | undefined) => {
   if (!formEl) return
@@ -78,7 +71,7 @@ interface FormType {
   T_remark: string
   T_pdf: string
 }
-type Fn = () => void
+// type Fn = () => void
 const form = reactive<FormType>({
   T_number: '',
   T_customer: '',
@@ -141,7 +134,7 @@ const deleteProduct = (row: any) => {
   tableData.value = tableData.value.filter(item => item.Id !== row.Id)
 
   // 设置产品的选中
-  selectTable.value?.toggleRowSelection(row, false)
+  drawerProductRef.value?.selectTableChange(row)
 }
 
 const AddContract = (formEl: FormInstance | undefined) => {
@@ -181,88 +174,6 @@ const AddContract = (formEl: FormInstance | undefined) => {
   })
 }
 
-// 增加产品
-// dialog
-const initParam = reactive({
-  User_tokey: globalStore.GET_User_tokey,
-  T_name: '',
-  T_model: '',
-  T_class: '',
-  page: 0,
-  page_z: 20
-})
-const NameOptions = ref<any[]>([])
-const classOptions = ref<any[]>([])
-const modelOptions = ref<any[]>([])
-// 获取产品分类
-const getProductClassList = async () => {
-  const res: any = await Storehouse_ProductClass_List({ page: 1, page_z: 999 })
-  classOptions.value = res.Data.Data
-}
-// 获取产品型号
-const getProductModelList = async () => {
-  const res: any = await Storehouse_Product_Model_List({ T_name: initParam.T_name })
-  modelOptions.value = res.Data.map((item: any, index: number) => {
-    return {
-      value: item,
-      index: index
-    }
-  })
-}
-const AddProductionDetailed = () => {
-  !classOptions.value.length && getProductClassList()
-  drawerProductRef.value?.openDrawer()
-  !tableProductData.value.length && getProductList()
-}
-
-// 搜索模型
-const searchModelHandle = () => {
-  total = 0
-  initParam.page = 1
-  tableProductData.value = []
-  getProductList()
-}
-// 保存选中的数据id,row-key就是要指定一个key标识这一行的数据
-const getRowKey = (row: any) => {
-  return row.Id
-}
-// 选中的产品
-const ProductselectionChange = (row: any[]) => {
-  if (!isNew.value) {
-    const newProduct = row.find(
-      (product: any) => tableData.value.findIndex((item: any) => item.Id === product.Id) === -1
-    )
-    newProduct && tableData.value.push({ ...newProduct })
-  } else {
-    tableData.value = row
-  }
-}
-
-// 加载第二个抽屉数据
-const load = () => {
-  if (initParam.page && total === tableProductData.value.length) {
-    ElMessage.warning('没有更多数据了！！')
-    return
-  }
-  initParam.page++
-  getProductList()
-}
-let total = 0
-const tableProductData = ref<any[]>([])
-const getProductList = async () => {
-  const res: any = await Storehouse_Product_List({ ...initParam })
-  tableProductData.value.push(...res.Data.Data)
-  total = res.Data.Num
-  if (!isNew.value) {
-    // 设置产品的选中
-    tableProductData.value.forEach((row: any) => {
-      const matchedIndex = selectProductData.findIndex((item: any) => item.Id == row.Id)
-
-      selectTable.value?.toggleRowSelection(row, matchedIndex != -1)
-    })
-  }
-}
-
 const tableData = ref<any[]>([])
 const columns = [
   { type: 'index', label: '序号', width: 80, align: 'center ' },
@@ -276,46 +187,35 @@ const columns = [
   { prop: 'operation', label: '操作', width: 80, fixed: 'right' }
 ]
 
-const productColumns = [
-  { type: 'selection', width: 80 },
-  { prop: 'T_img', label: '产品图片', name: 'T_img' },
-  { prop: 'T_name', label: '产品名称' },
-  { prop: 'T_class_name', label: '产品分类' },
-  { prop: 'T_model', label: '产品型号', ellipsis: true },
-  { prop: 'T_spec', label: '产品规格' },
-  { prop: 'T_relation_sn', label: '关联SN', name: 'T_relation_sn' },
-  { prop: 'T_remark', label: '备注', ellipsis: true }
-]
-
-// 自动搜索
-const loading = ref(false)
-const querySearchAsync = async (queryString: string) => {
-  if (queryString) {
-    loading.value = true
-    globalStore.SET_isloading(true)
-    const results = await getNameAsync(queryString)
-    NameOptions.value = results
-    globalStore.SET_isloading(false)
-    loading.value = false
-  }
-}
-
-const getNameAsync = async (str: string): Promise<any> => {
-  const res: any = await Storehouse_Product_Name_List({ T_name: str, T_class: initParam.T_class })
-  if (!res.Data) return
-  return res.Data.map((item: any, index: number) => {
-    return {
-      value: item,
-      index: index
-    }
+const drawerProductRef = ref<InstanceType<typeof InStorageProduct> | null>(null)
+/**
+ * 添加产品
+ */
+const AddProductionDetailed = () => {
+  isProduct.value = true
+  console.log(selectProductData)
+  nextTick(() => {
+    drawerProductRef.value?.openDrawer()
   })
 }
-
-const handleSelect = (item: any) => {
-  initParam.T_name = item
-  getProductModelList()
+/**
+ * 产品选择 是否
+ */
+const ProductselectionChange = (row: any) => {
+  const index = tableData.value.findIndex((item: any) => item.Id === row.Id)
+  if (index === -1) {
+    row.count = ''
+    tableData.value.push(row)
+  } else {
+    tableData.value.splice(index, 1)
+  }
+}
+/**
+ * 全选
+ */
+const ProductSelectionAllChange = (selection: any[]) => {
+  tableData.value = selection
 }
-
 defineExpose({
   openDrawer
 })
@@ -441,104 +341,15 @@ defineExpose({
             <el-button v-else color="#626aef" @click="AddContract(ruleFormRef)">修改</el-button>
           </el-divider>
         </div>
-        <Drawer ref="drawerProductRef" :handleClose="callbackProductDrawer" size="70%">
-          <template #header="{ params }">
-            <h4 :id="params.titleId" :class="params.titleClass">选择产品</h4>
-          </template>
-          <el-card class="box-card" shadow="never">
-            <template #header>
-              <div class="input-suffix">
-                <el-row :gutter="20" style="margin-bottom: 0">
-                  <el-col :xl="5" :lg="8" :md="10" class="d-flex">
-                    <span class="inline-flex items-center">产品分类：</span>
-                    <el-select v-model="initParam.T_class" clearable placeholder="请选择分类~">
-                      <el-option v-for="item in classOptions" :key="item.Id" :label="item.T_name" :value="item.Id" />
-                    </el-select>
-                  </el-col>
-                  <el-col :xl="7" :lg="8" :md="10" class="d-flex">
-                    <span class="inline-flex items-center">产品名称：</span>
-                    <el-select
-                      v-model="initParam.T_name"
-                      filterable
-                      remote
-                      reserve-keyword
-                      placeholder="按产品名称搜索"
-                      remote-show-suffix
-                      :remote-method="querySearchAsync"
-                      :loading="loading"
-                      @change="handleSelect"
-                    >
-                      <el-option
-                        v-for="item in NameOptions"
-                        :key="item.value"
-                        :label="item.value"
-                        :value="item.value"
-                      />
-                    </el-select>
-                  </el-col>
-                  <el-col :xl="7" :lg="8" :md="12" class="d-flex">
-                    <span class="inline-flex items-center">产品型号：</span>
-                    <el-select v-model="initParam.T_model" clearable placeholder="请选择型号~">
-                      <el-option
-                        v-for="item in modelOptions"
-                        :key="item.index"
-                        :label="item.value"
-                        :value="item.value"
-                      />
-                    </el-select>
-                    <el-button type="primary" @click="searchModelHandle">搜索</el-button>
-                  </el-col>
-                </el-row>
-              </div>
-            </template>
-            <el-table
-              ref="selectTable"
-              :row-key="getRowKey"
-              :data="tableProductData"
-              style="width: 100%; height: 99%"
-              v-el-table-infinite-scroll="load"
-              :infinite-scroll-immediate="false"
-              :header-cell-style="{ background: '#dedfe0', height: '50px' }"
-              @selection-change="ProductselectionChange"
-            >
-              <template v-for="item in productColumns" :key="item">
-                <el-table-column
-                  v-if="item.type === 'index' || item.type === 'selection'"
-                  align="center"
-                  v-bind="item"
-                />
-                <el-table-column v-if="!item.ellipsis && item.prop" v-bind="item">
-                  <template #default="{ row }">
-                    <span v-if="item.prop === 'T_relation_sn'">
-                      <el-tag v-if="row.T_relation_sn === 1" effect="dark">是</el-tag>
-                      <el-tag v-else type="success" effect="dark">否</el-tag>
-                    </span>
-                    <ImageCom v-if="item.prop === 'T_img'" :src="row.T_img" />
-                  </template>
-                </el-table-column>
-                <el-table-column v-if="item.ellipsis && item.prop === 'T_model'" align="center" v-bind="item">
-                  <template #default="{ row }">
-                    <el-tooltip effect="dark" :content="row.T_model" placement="bottom">
-                      {{ row.T_model }}
-                    </el-tooltip>
-                  </template>
-                </el-table-column>
-                <el-table-column v-if="item.ellipsis && item.prop === 'T_remark'" align="center" v-bind="item">
-                  <template #default="{ row }">
-                    <el-tooltip effect="customized" placement="left">
-                      <template #content>
-                        <div class="tooltip-content">{{ row.T_remark }}</div>
-                      </template>
-                      {{ row.T_remark }}
-                    </el-tooltip>
-                  </template>
-                </el-table-column>
-              </template>
-            </el-table>
-          </el-card>
-        </Drawer>
       </el-form>
     </Drawer>
+    <InStorageProduct
+      v-if="isProduct"
+      ref="drawerProductRef"
+      :selectProductData="selectProductData"
+      @ontableData="ProductselectionChange"
+      @ontableDataAll="ProductSelectionAllChange"
+    ></InStorageProduct>
   </div>
 </template>
 
@@ -573,14 +384,5 @@ defineExpose({
   .w-50 {
     width: 21.5rem;
   }
-  .input-suffix {
-    width: 100%;
-    .inline-flex {
-      white-space: nowrap;
-    }
-    .d-flex {
-      display: flex;
-    }
-  }
 }
 </style>