提交客户管家代码

fhKeeper/formulahousekeeper/customerBuler-crm/src/components/relatedProducts/relatedProducts.vue

@@ -114,9 +114,12 @@ function deteleTableItem(index: number) {
 function returnData() {
     let jsonstr = JSON.stringify(productTable.value)
     let json = '[{"index":0}]'
-    if(jsonstr == json) {
+    if (jsonstr == json) {
         return false
     }
+    productTable.value.forEach(item => {
+        delete item.index
+    });
     return productTable.value
 }
 

fhKeeper/formulahousekeeper/customerBuler-crm/src/pages/order/api.ts

@@ -5,7 +5,9 @@ export const GETSYSFILED = "/sys-dict/getListByCode";
 export const GETPERSONNEL = "/user/getSimpleActiveUserList";
 export const GETGENERATEFOEM = `/sys-form/getListByCode${MOD}`
 export const GETALLPRODUCT = `/sys-form/getListByCode/Order`
+export const GETTABLELISTPRODUCT = `/product/list`
 export const GETTABLELIST = `${MOD}/list`
+export const URL_OEDERUPDATE = `${MOD}/addOrUpdate`
 
 export const tableColumns: TableColumn[] = [
     { prop: 'orderCode', label: '订单编号', event: 'toDetali', width: '150' },

fhKeeper/formulahousekeeper/customerBuler-crm/src/pages/order/index.vue

@@ -36,7 +36,7 @@
       <div class="bg-white w-full h-full p-3 shadow-md rounded-md flex flex-col">
         <div class="flex justify-end pb-3">
           <!-- 操作按钮 -->
-          <el-button v-permission="['aabbc']" type="primary">新建订单</el-button>
+          <el-button type="primary" @click="editOrder(false)">新建订单</el-button>
           <el-button type="primary">批量转移</el-button>
           <el-button type="primary">批量删除</el-button>
           <el-button type="primary">回收站</el-button>
@@ -58,7 +58,7 @@
             </el-table-column>
             <el-table-column :label="'操作'" :width="'200px'" fixed="right">
               <template #default="scope">
-                <el-button link type="primary" size="large">编辑</el-button>
+                <el-button link type="primary" size="large" @click="editOrder(scope.row)">编辑</el-button>
                 <el-button link type="primary" size="large">新建任务</el-button>
                 <el-button link type="danger" size="large">删除</el-button>
               </template>
@@ -72,19 +72,43 @@
         </div>
       </div>
     </div>
+
+    <!-- 弹窗 -->
+    <el-dialog v-model="allVisible.editOrderVisible" width="1000" :show-close="false" top="10vh">
+      <template #header="{ close, titleId, titleClass }">
+        <div class="flex justify-between items-center border-b pb-3 dialog-header">
+          <h4 :id="titleId">{{ allText.orderEditText }}</h4>
+          <div>
+            <el-button type="primary" :loading="allLoading.editSaveLading" @click="saveOrder(true)">保存并新建</el-button>
+            <el-button type="primary" :loading="allLoading.editSaveLading" @click="saveOrder(false)">保存</el-button>
+            <el-button @click="closeVisible('editOrderVisible')">取消</el-button>
+          </div>
+        </div>
+      </template>
+      <div class="h-[60vh] overflow-y-auto scroll-bar pt-3" v-loading="allLoading.orderTemplateLoadinng">
+        <GenerateForm ref="orderTemplateRef" :data="orderTemplate" :value="orderTemplateValue" />
+        <div>相关产品</div>
+        <RelatedProducts ref="relatedProductsRef" :productTableList="productTableList" />
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script lang="ts" setup>
 import { ref, reactive, onMounted, inject, defineExpose } from "vue";
-import { getAllListByCode, getFromValue, resetFromValue, getFirstDayOfMonth, getLastDayOfMonth, formatDate } from '@/utils/tools'
+import { getAllListByCode, getFromValue, resetFromValue, getFirstDayOfMonth, getLastDayOfMonth, formatDate, getTemplateKey } from '@/utils/tools'
 import { post, get } from "@/utils/request";
-import { tableColumns, GETSYSFILED, GETPERSONNEL, GETGENERATEFOEM, MOD, GETTABLELIST, GETALLPRODUCT } from "./api";
+import { tableColumns, GETSYSFILED, GETPERSONNEL, GETGENERATEFOEM, MOD, GETTABLELIST, GETALLPRODUCT, GETTABLELISTPRODUCT, URL_OEDERUPDATE } from "./api";
 import { useRouter, useRoute } from "vue-router";
+import { GenerateForm } from '@zmjs/form-design';
 import { URL_FETALL } from "../customer/api";
 
-const router = useRouter()
+import RelatedProducts from '@/components/relatedProducts/relatedProducts.vue'
+import TaskModal from '@/components/TaskModal/index.vue'
+import { formatDateTime } from "@/utils/times";
 
+const router = useRouter()
+const globalPopup = inject<GlobalPopup>('globalPopup')
 const filterForm = reactive<FilterForm>({ // 筛选条件 Value
   contactPerson: "",
   customerId: "",
@@ -102,19 +126,82 @@ const selectData = reactive({ // 下拉数据
   RemittanceStatus: [{ id: 0, name: '已回款' }, { id: 1, name: '未回款' }, { id: 2, name: '已完全回款' }] as any[], // 回款状态
   AllProduct: [] as any[] // 所有产品
 })
-const filterItems = ref<FilterItem[]>([]) // 渲染筛选条件
 const formTablePaging = reactive({ // 分页条件
   currentPage: 1,
   pageSize: 10,
   total: 0,
 })
-const formTable = ref([]) // 表格数据
 const allLoading = reactive({ // 按钮加载 Loading
   formTableLading: false,
+  editSaveLading: false,
+  orderTemplateLoadinng: false
 })
 const allVisible = reactive({
-
+  editOrderVisible: false
 })
+const allText = reactive({
+  orderEditText: '新建订单'
+})
+const orderTemplate = ref({
+  list: [],
+  config: {}
+})
+const orderTemplateValue = ref({})
+const orderTemplateKey = ref(1)
+const orderTemplateRef = ref<typeof GenerateForm>()
+const relatedProductsRef = ref<typeof RelatedProducts>()
+const filterItems = ref<FilterItem[]>([]) // 渲染筛选条件
+const formTable = ref([]) // 表格数据
+const productTableList = ref([])
+
+function saveOrder(flag: boolean) {
+  orderTemplateRef.value?.getData().then((res: any) => {
+    let productTableListData = relatedProductsRef?.value?.returnData()
+    const produt = productTableListData ? JSON.stringify(productTableListData) : []
+    allLoading.editSaveLading = true
+    post(URL_OEDERUPDATE, { 
+      ...res, 
+      orderEndDate: res.orderEndDate ? formatDate(res.orderEndDate) : '',
+      orderStartDate: res.orderStartDate ? formatDate(res.orderStartDate) : '',
+      orderProductDetailString: produt
+    }).then((_res) => {
+      allVisible.editOrderVisible = flag
+      globalPopup?.showSuccess('保存成功')
+      if (flag) {
+        orderTemplateRef.value?.reset()
+      }
+      getTableList()
+    }).finally(() => {
+      allLoading.editSaveLading = false
+    })
+  }).catch((_err: any) => {
+    console.log(_err)
+    globalPopup?.showError('请填写完整')
+  })
+}
+
+function editOrder(item: any) {
+  showVisible('editOrderVisible')
+  allLoading.orderTemplateLoadinng = true
+  if (item) {
+    const templateKey = getTemplateKey(orderTemplate.value.list)
+    let formVal: templateKey = {}
+    for (let i = 0; i < orderTemplate.value.list.length; i++) {
+      const key = templateKey[i]
+      formVal[key] = item[key]
+    }
+    orderTemplateValue.value = JSON.parse(JSON.stringify(item))
+    allText.orderEditText = '编辑订单'
+  }
+  if (!item) {
+    orderTemplateValue.value = {}
+  }
+  setTimeout(() => {
+    orderTemplateRef.value && orderTemplateRef.value.reset()
+    orderTemplateKey.value++
+    allLoading.orderTemplateLoadinng = false
+  }, 500)
+}
 
 function toDetali(row: any) {
   router.push({
@@ -171,12 +258,20 @@ async function getSystemField() {
     const { id, customName } = item
     return { id, name: customName }
   })
-  // const res = await get(GETGENERATEFOEM)
-  // generateFormData.value = JSON.parse(res.data[0].config)
+  const res = await get(GETGENERATEFOEM)
+  orderTemplate.value = JSON.parse(res.data[0].config)
 
   setFilterItems()
 }
 
+function showVisible(type: keyof typeof allVisible) { // 显示弹窗
+  allVisible[type] = true
+}
+
+function closeVisible(type: keyof typeof allVisible) {
+  allVisible[type] = false
+}
+
 function setFilterItems() {
   filterItems.value = [
     { label: '订单编号', key: 'orderCode', type: 'input' },
@@ -190,10 +285,37 @@ function setFilterItems() {
   ]
 }
 
+function getProductTableList() {
+  post(GETTABLELISTPRODUCT, { pageIndex: -1, pageSize: -1 }).then((res) => {
+    if (res.code == 'ok') {
+      const { record, total } = res.data
+      productTableList.value = record.map((item: any) => {
+        const { id, productName, productCode, unit, unitName, typeName, type, price, inventory } = item
+        return {
+          id,
+          productId: id,
+          productName,
+          productCode,
+          unit,
+          unitName,
+          price,
+          type,
+          typeName,
+          inventory,
+          quantity: '',
+          discount: '',
+          totalPrice: ''
+        }
+      })
+    }
+  })
+}
+
 onMounted(() => {
   getSystemField()
   getAllProduct()
   getTableList()
+  getProductTableList()
 })
 </script>