form表单升级

src/components/testForm/index.vue

@@ -344,19 +344,35 @@
         </div>
       </van-cell-group>
       <!-- 循环业务数据 -->
-      <van-collapse v-model="listActiaveName">
+      <van-collapse v-model="listActiaveName" v-if="btnConfigCopy.isShowFold">
         <van-cell-group
           inset
           v-for="(item, index) in formData[btnConfigCopy.prop]"
           :key="index"
         >
-          <van-collapse-item
-            :title="
-              (btnConfigCopy.listTitle ? btnConfigCopy.listTitle : '明细') +
-              (index + 1)
-            "
-            :name="btnConfigCopy.prop + (index + 1)"
-          >
+          <van-collapse-item :name="btnConfigCopy.prop + (index + 1)">
+            <template #title>
+              <div>
+                <div
+                  v-if="route.query && route.query.flowKey == 'wdly_purchase'"
+                >
+                  <div>物品名称：{{ item.productName }}</div>
+                  <span style="margin-right: 5px">
+                    本次采购：{{ item.count }}</span
+                  >
+                  <span style="margin-right: 5px"> 单价：{{ item.price }}</span>
+                  金额：{{ item.amount }}
+                </div>
+                <div v-else>
+                  {{
+                    (btnConfigCopy.listTitle
+                      ? btnConfigCopy.listTitle
+                      : "明细") +
+                    (index + 1)
+                  }}
+                </div>
+              </div>
+            </template>
             <div class="row">
               <div>{{ btnConfigCopy.listTitle || "明细" }}{{ index + 1 }}</div>
               <van-button
@@ -445,6 +461,96 @@
           </van-collapse-item>
         </van-cell-group>
       </van-collapse>
+
+      <van-cell-group
+        inset
+        v-for="(item, index) in formData[btnConfigCopy.prop]"
+        :key="index"
+        v-else
+      >
+        <div class="row">
+          <div>{{ btnConfigCopy.listTitle || "明细" }}{{ index + 1 }}</div>
+          <van-button
+            plain
+            type="primary"
+            @click="handleRemove(index, btnConfigCopy)"
+            size="mini"
+            style="border: none; background: #ecebeb"
+            :disabled="formOption.readonly"
+            v-if="
+              formOption.btnConfig !== undefined && formOption.btnConfig.isNeed
+            "
+            >删除</van-button
+          >
+        </div>
+        <!-- 循环表单数据 -->
+        <div v-for="(i, sonIndex) in btnConfigCopy.listConfig" :key="i.prop">
+          <van-field
+            v-if="i.type == 'input'"
+            v-model="formData[btnConfigCopy.prop][index][i.prop]"
+            :label="i.label"
+            :name="i.prop"
+            :type="i.itemType ? i.itemType : 'text'"
+            :placeholder="i.placeholder ? i.placeholder : '请输入'"
+            :clearable="i.clearable ? i.clearable : false"
+            :readonly="getFieldReadonly(i)"
+            :rules="getRules(i)"
+            :required="getRequired(i)"
+            @change="
+              (val) => {
+                return i.changeFn ? i.changeFn(index, val) : () => {};
+              }
+            "
+          >
+          </van-field>
+          <!-- 单选 -->
+          <van-field
+            v-if="i.type == 'picker' && i.itemType == 'onePicker'"
+            :label="i.label"
+            :name="i.prop"
+            v-model="formData[btnConfigCopy.prop][index][i.prop + 'Name']"
+            is-link
+            :readonly="true"
+            :placeholder="i.placeholder ? i.placeholder : '请选择'"
+            @click="handleListItemClick(i, index, sonIndex)"
+            :rules="getRules(i)"
+            :required="getRequired(i)"
+          >
+            <template #input v-if="i.isShowScanCode">
+              <div style="display: flex; height: 24px">
+                <div style="width: calc(100vw - 100px)">
+                  {{ formData[btnConfigCopy.prop][index][i.prop + "Name"] }}
+                </div>
+                <div style="width: 100px; float: right; margin-top: -20px">
+                  <van-button
+                    plain
+                    type="primary"
+                    @click.native.stop="i.scanCode(index)"
+                    size="mini"
+                    style="border: none"
+                    >扫码</van-button
+                  >
+                </div>
+              </div>
+            </template>
+          </van-field>
+          <!-- 时间选择器 -->
+          <van-field
+            v-if="i.type == 'picker' && i.itemType == 'datePicker'"
+            :label="i.label"
+            :name="i.prop"
+            v-model="formData[btnConfigCopy.prop][index][i.prop]"
+            is-link
+            :readonly="true"
+            :placeholder="i.placeholder ? i.placeholder : '请选择'"
+            @click="handleListItemClick(i, index, sonIndex)"
+            :rules="getRules(i)"
+            :required="getRequired(i)"
+          >
+          </van-field>
+        </div>
+      </van-cell-group>
+
       <!-- 单独写个循环，保证弹窗唯一 -->
       <div v-for="(item, index) in btnConfigCopy.listConfig" :key="index">
         <van-popup
@@ -556,6 +662,8 @@ const props = defineProps({
     default: false,
   },
 });
+import { useRoute } from "vue-router";
+const route = useRoute();
 const proxy = getCurrentInstance().proxy;
 const listActiaveName = ref([]);
 const { formConfig, formOption, rules } = toRefs(props);

src/views/processApproval/components/WdlyPurchase.vue

@@ -95,6 +95,7 @@ const formOptionOne = reactive({
     prop: "purchaseDetailList",
     plain: true,
     listTitle: "采购明细",
+    isShowFold: true,
     listConfig: [
       {
         type: "input",