修改商品新品

src/services/go/ermcp/goodsInfo/index.ts

@@ -63,7 +63,7 @@ export function QueryDeliveryGoodsDetail(deliverygoodsid?: number): Promise<Ermc
 }
 
 /**
- * 查询期货商品组 /Ermcp3/QueryGoodsGroup
+ * 查询商品组 /Ermcp3/QueryGoodsGroup
  * @param excludecfg 排除套保品中已关联的商品组 1-排除
  * @constructor
  */

src/views/information/goods/components/add/index.vue

@@ -71,7 +71,8 @@
       </fieldset>
       <fieldset class="formFieldSet">
         <legend>品类信息</legend>
-        <a-row :gutter="24"  class="dialogRowTitle">
+        <a-row :gutter="24"
+               class="dialogRowTitle">
           <a-col :span="6">
             <span>
               <span class="red">*</span>
@@ -128,7 +129,8 @@
                          placeholder="请输入标仓系数"></a-input>
               </a-form-item>
             </a-col>
-            <a-col :span="6" class="tc">
+            <a-col :span="6"
+                   class="tc">
               <a-button class="plusBtn"
                         @click="deleteOne('gldwrstandards', index)"
                         v-if="index > 0">
@@ -145,64 +147,11 @@
             </a-col>
           </template>
         </a-row>
-        <!-- <a-table class="dialogTable"
-                 :columns="columns"
-                 :data-source="dataSource"
-                 :pagination="false">
-          <template #type>
-            <a-input class="dialogInput"
-                     placeholder="请输入品类"></a-input>
-          </template>
-          <template #customType>
-            <span>
-              <span class="red">*</span>
-              品类
-            </span>
-          </template>
-          <template #unit>
-            <a-select class="dialogSelect"
-                      placeholder="请选择单位">
-              <a-select-option value="1">
-                一口价
-              </a-select-option>
-              <a-select-option value="2">
-                一口价2
-              </a-select-option>
-            </a-select>
-          </template>
-          <template #customUnit>
-            <span>
-              <span class="red">*</span>
-              单位
-            </span>
-          </template>
-          <template #coefficient>
-            <a-input class="dialogInput"
-                     placeholder="请输入标仓系数"></a-input>
-          </template>
-          <template #customCoefficient>
-            <span>
-              <span class="red">*</span>
-              标仓系数
-            </span>
-          </template>
-          <template #action>
-            <a-button class="plusBtn">
-              <template #icon>
-                <MinusOutlined />
-              </template>
-            </a-button>
-            <a-button class="minusBtn">
-              <template #icon>
-                <PlusOutlined />
-              </template>
-            </a-button>
-          </template>
-        </a-table> -->
       </fieldset>
       <fieldset class="formFieldSet">
         <legend>品牌信息</legend>
-        <a-row :gutter="24" class="dialogRowTitle dialogRowTitle2">
+        <a-row :gutter="24"
+               class="dialogRowTitle dialogRowTitle2">
           <a-col :span="12">
             <span>
               <span class="red">*</span>
@@ -241,37 +190,11 @@
             </a-col>
           </template>
         </a-row>
-        <!-- <a-table class="dialogTable"
-                 :columns="columns1"
-                 :data-source="dataSource1"
-                 :pagination="false">
-          <template #type>
-            <a-input class="dialogInput"
-                     placeholder="请输入品牌"></a-input>
-          </template>
-          <template #customType>
-            <span>
-              <span class="red">*</span>
-              品牌
-            </span>
-          </template>
-          <template #action>
-            <a-button class="plusBtn">
-              <template #icon>
-                <MinusOutlined />
-              </template>
-            </a-button>
-            <a-button class="minusBtn">
-              <template #icon>
-                <PlusOutlined />
-              </template>
-            </a-button>
-          </template>
-        </a-table> -->
       </fieldset>
       <fieldset class="formFieldSet">
         <legend>套保品种信息</legend>
-        <a-row :gutter="24"  class="dialogRowTitle">
+        <a-row :gutter="24"
+               class="dialogRowTitle">
           <a-col :span="6">
             <span>
               <span class="red">*</span>
@@ -329,7 +252,8 @@
                          placeholder="请输入套保系数"></a-input>
               </a-form-item>
             </a-col>
-            <a-col :span="6" class="tc">
+            <a-col :span="6"
+                   class="tc">
               <a-button class="plusBtn"
                         @click="deleteOne('wrsconvertdetails', index)"
                         v-if="index > 0">
@@ -346,58 +270,6 @@
             </a-col>
           </template>
         </a-row>
-        <!-- <a-table class="dialogTable"
-                 :columns="columns"
-                 :data-source="dataSource"
-                 :pagination="false">
-          <template #type>
-            <a-select class="dialogSelect"
-                      placeholder="请选择套保品种">
-              <a-select-option value="1">
-                一口价
-              </a-select-option>
-              <a-select-option value="2">
-                一口价2
-              </a-select-option>
-            </a-select>
-          </template>
-          <template #customType>
-            <span>
-              <span class="red">*</span>
-              套保品种
-            </span>
-          </template>
-          <template #unit>
-            <span class="white">选择套保品种后自动填入</span>
-          </template>
-          <template #customUnit>
-            <span>
-              单位
-            </span>
-          </template>
-          <template #coefficient>
-            <a-input class="dialogInput"
-                     placeholder="请输入套保系数"></a-input>
-          </template>
-          <template #customCoefficient>
-            <span>
-              <span class="red">*</span>
-              套保系数
-            </span>
-          </template>
-          <template #action>
-            <a-button class="plusBtn">
-              <template #icon>
-                <MinusOutlined />
-              </template>
-            </a-button>
-            <a-button class="minusBtn">
-              <template #icon>
-                <PlusOutlined />
-              </template>
-            </a-button>
-          </template>
-        </a-table> -->
       </fieldset>
     </a-form>
   </a-modal>
@@ -441,85 +313,6 @@ export default defineComponent({
         const { loading, addAction } = handleAdd();
         // 单位列表
         const unitList = getGoodsUnitList();
-        const columns = [
-            {
-                dataIndex: 'type',
-                key: 'type',
-                slots: { title: 'customType', customRender: 'type' },
-                width: 200,
-                align: 'center',
-            },
-            {
-                dataIndex: 'unit',
-                key: 'unit',
-                slots: { title: 'customUnit', customRender: 'unit' },
-                width: 200,
-                align: 'center',
-            },
-            {
-                dataIndex: 'coefficient',
-                key: 'coefficient',
-                slots: { title: 'customCoefficient', customRender: 'coefficient' },
-                width: 200,
-                align: 'center',
-            },
-            {
-                title: '操作',
-                key: 'action',
-                slots: { customRender: 'action' },
-                align: 'center',
-            },
-        ];
-
-        const dataSource = [
-            {
-                key: '1',
-                type: 'John Brown',
-                age: 32,
-                address: 'New York No. 1 Lake Park',
-                tags: ['nice', 'developer'],
-            },
-            {
-                key: '2',
-                name: 'Jim Green',
-                age: 42,
-                address: 'London No. 1 Lake Park',
-                tags: ['loser'],
-            },
-        ];
-
-        const columns1 = [
-            {
-                dataIndex: 'type',
-                key: 'type',
-                slots: { title: 'customType', customRender: 'type' },
-                width: 598,
-                align: 'center',
-            },
-            {
-                title: '操作',
-                key: 'action',
-                slots: { customRender: 'action' },
-                align: 'center',
-            },
-        ];
-
-        const dataSource1 = [
-            {
-                key: '1',
-                type: 'John Brown',
-                age: 32,
-                address: 'New York No. 1 Lake Park',
-                tags: ['nice', 'developer'],
-            },
-            {
-                key: '2',
-                name: 'Jim Green',
-                age: 42,
-                address: 'London No. 1 Lake Park',
-                tags: ['loser'],
-            },
-        ];
         function submit() {
             formRef.value
                 .validate()
@@ -583,10 +376,6 @@ export default defineComponent({
             middleChange,
             submit,
             loading,
-            dataSource,
-            columns,
-            dataSource1,
-            columns1,
             maskClosableFlag: false,
         };
     },
@@ -702,50 +491,51 @@ export default defineComponent({
         }
     }
     .ant-form.inlineForm {
-      .ant-row.dialogRowTitle {
-        .ant-col {
-          .ant-row.ant-form-item {
-              .ant-col.ant-form-item-control-wrapper {
-                width: 100%;
-                .ant-form-item-control {
-                  .ant-form-item-children {
-                    .ant-input.dialogInput {
-                      border-radius: 0;
-                      margin-top: 1px;
-                      // margin-left: -1px;
-                      // width: calc(100% + 2px);
-                    }
-                    .ant-select.inlineFormSelect {
-                      margin-top: 1px;
-                      .ant-select-selector {
-                        text-align: left;
-                      }
-                    }
-                  }
-                }
-                .ant-form-item-control.has-error {
-                  text-align: left;
-                  .ant-form-item-children {
-                    .ant-input.dialogInput {
-                      background: @m-grey21;
+        .ant-row.dialogRowTitle {
+            .ant-col {
+                .ant-row.ant-form-item {
+                    .ant-col.ant-form-item-control-wrapper {
+                        width: 100%;
+                        .ant-form-item-control {
+                            .ant-form-item-children {
+                                .ant-input.dialogInput {
+                                    border-radius: 0;
+                                    margin-top: 1px;
+                                    // margin-left: -1px;
+                                    // width: calc(100% + 2px);
+                                }
+                                .ant-select.inlineFormSelect {
+                                    margin-top: 1px;
+                                    .ant-select-selector {
+                                        text-align: left;
+                                    }
+                                }
+                            }
+                        }
+                        .ant-form-item-control.has-error {
+                            text-align: left;
+                            .ant-form-item-children {
+                                .ant-input.dialogInput {
+                                    background: @m-grey21;
+                                }
+                            }
+                            .ant-form-explain {
+                                color: @m-red1;
+                            }
+                        }
                     }
-                  }
-                  .ant-form-explain {
-                    color: @m-red1;
-                  }
                 }
-              }
-          }
-        }
-        .ant-col.tc {
-          text-align: center;
+            }
+            .ant-col.tc {
+                text-align: center;
+            }
         }
-      }
-      .ant-row.dialogRowTitle2 {
-        .ant-col:nth-child(3),.ant-col:nth-child(4) {
-          border-top: 1px solid @m-grey20;
+        .ant-row.dialogRowTitle2 {
+            .ant-col:nth-child(3),
+            .ant-col:nth-child(4) {
+                border-top: 1px solid @m-grey20;
+            }
         }
-      }
-  }
+    }
 }
 </style>

src/views/information/goods/components/modify/index.vue

@@ -1,7 +1,7 @@
 <template>
-  <!-- 修改客户资料 -->
-  <a-modal class="commonModal modify-custom"
-           title="修改客户资料"
+  <!-- 修改现货品种 -->
+  <a-modal class="commonModal addSpotVariety"
+           title="修改现货品种"
            v-if="visible"
            v-model:visible="visible"
            centered
@@ -15,217 +15,426 @@
                 @click="submit">完成</a-button>
     </template>
     <a-form class="inlineForm"
-            :form="form"
-            @submit="handleSearch">
-      <a-row :gutter="24">
-        <a-col :span="12">
-          <a-form-item label="客户类型">
-            <a-select class="typeSelect"
-                      style="width: 200px"
-                      placeholder="请选择客户类型">
-              <a-select-option value="1">
-                客户一
-              </a-select-option>
-              <a-select-option value="2">
-                客户二
-              </a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-        <a-col :span="12">
-          <a-form-item label="企业名称">
-            <a-input class="dialogInput"
-                     style="width: 200px"
-                     placeholder="请输入企业名称" />
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24">
-        <a-col :span="12">
-          <a-form-item label="企业简称">
-            <a-input class="dialogInput"
-                     style="width: 200px"
-                     placeholder="请输入企业简称" />
-          </a-form-item>
-        </a-col>
-        <a-col :span="12">
-          <a-form-item label="证件类型">
-            <a-select class="inlineFormSelect"
-                      style="width: 200px"
-                      placeholder="请选择证件类型">
-              <a-select-option value="1">
-                客户一
-              </a-select-option>
-              <a-select-option value="2">
-                客户二
-              </a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24">
-        <a-col :span="12">
-          <a-form-item label="法定代表人">
-            <a-input class="dialogInput"
-                     style="width: 200px"
-                     placeholder="请输入法定代表人" />
-          </a-form-item>
-        </a-col>
-        <a-col :span="12">
-          <a-form-item label="证件号码">
-            <a-input class="dialogInput"
-                     style="width: 200px"
-                     placeholder="请输入证件号码" />
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24">
-        <a-col :span="12">
-          <a-form-item label="纳税人识别号">
-            <a-input class="dialogInput"
-                     style="width: 200px"
-                     placeholder="请输入纳税人识别号" />
-          </a-form-item>
-        </a-col>
-        <a-col :span="12">
-          <a-form-item label="营业执照">
-            <div class="upload">
-              <a-upload action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
-                        :transform-file="transformFile">
-                <a-button class="uploadBtn">上传</a-button>
-              </a-upload>
-              <div class="look">查看附件</div>
-            </div>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24">
-        <a-col :span="12">
-          <a-form-item label="联系人">
-            <a-input class="dialogInput"
-                     style="width: 200px"
-                     placeholder="请输入联系人" />
-          </a-form-item>
-        </a-col>
-        <a-col :span="12">
-          <a-form-item label="联系人手机号">
-            <a-input class="dialogInput"
-                     style="width: 200px"
-                     placeholder="请输入联系人手机号" />
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24">
-        <a-col :span="12">
-          <a-form-item label="联系电话">
-            <a-input class="dialogInput"
-                     style="width: 200px"
-                     placeholder="请输入联系电话" />
-          </a-form-item>
-        </a-col>
-        <a-col :span="12">
-          <a-form-item>
-            &nbsp;
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24">
-        <a-col :span="24">
-          <a-form-item label="通讯地址">
-            <a-select class="inlineFormSelect"
-                      style="width: 205px"
-                      placeholder="请选择省">
-              <a-select-option value="1">
-                客户一
-              </a-select-option>
-              <a-select-option value="2">
-                客户二
-              </a-select-option>
-            </a-select>
-            <a-select class="inlineFormSelect ml5"
-                      style="width: 205px"
-                      placeholder="请选择市">
-              <a-select-option value="1">
-                客户一
-              </a-select-option>
-              <a-select-option value="2">
-                客户二
-              </a-select-option>
-            </a-select>
-            <a-select class="inlineFormSelect ml5"
-                      style="width: 205px"
-                      placeholder="请选择县(区)">
-              <a-select-option value="1">
-                客户一
-              </a-select-option>
-              <a-select-option value="2">
-                客户二
-              </a-select-option>
-            </a-select>
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24">
-        <a-col :span="24">
-          <a-form-item label="&nbsp;">
-            <a-input class="dialogInput"
-                     style="width: 625px"
-                     placeholder="请输入详细地址" />
-          </a-form-item>
-        </a-col>
-      </a-row>
-      <a-row :gutter="24">
-        <a-col :span="24">
-          <a-form-item label="备注">
-            <a-input class="dialogInput"
-                     style="width: 625px"
-                     placeholder="请输入备注" />
-          </a-form-item>
-        </a-col>
-      </a-row>
+            ref="formRef"
+            :model="formState"
+            :rules="rules">
+      <fieldset class="formFieldSet">
+        <legend>基本信息</legend>
+        <a-row :gutter="24">
+          <a-col :span="12">
+            <a-form-item label="现货品种名称"
+                         name="deliverygoodsname">
+              <a-input class="dialogInput"
+                       v-model:value="formState.deliverygoodsname"
+                       style="width: 200px"
+                       placeholder="请输入现货品种名称" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-item label="现货品种代码"
+                         name="deliverygoodscode">
+              <a-input class="dialogInput"
+                       style="width: 200px"
+                       v-model:value="formState.deliverygoodscode"
+                       placeholder="请输入现货品种代码" />
+            </a-form-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24">
+          <a-col :span="24">
+            <a-form-item label="单位"
+                         name="unitid">
+              <a-select class="inlineFormSelect"
+                        style="width: 200px"
+                        v-model:value="formState.unitid"
+                        placeholder="请选择单位">
+                <a-select-option v-for="item in unitList"
+                                 :value="item.enumitemname"
+                                 :key="item.autoid">
+                  {{item.enumdicname}}
+                </a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24">
+          <a-col :span="24">
+            <a-form-item label="备注"
+                         name="remark">
+              <a-input class="dialogInput"
+                       v-model:value="formState.remark"
+                       style="width: 588px"
+                       placeholder="请输入备注" />
+            </a-form-item>
+          </a-col>
+        </a-row>
+      </fieldset>
+      <fieldset class="formFieldSet">
+        <legend>品类信息</legend>
+        <a-row :gutter="24"
+               class="dialogRowTitle">
+          <a-col :span="6">
+            <span>
+              <span class="red">*</span>
+              品类
+            </span>
+          </a-col>
+          <a-col :span="6">
+            <span>
+              <span class="red">*</span>
+              单位
+            </span>
+          </a-col>
+          <a-col :span="6">
+            <span>
+              <span class="red">*</span>
+              标仓系数
+            </span>
+          </a-col>
+          <a-col :span="6">
+            <span>
+              操作
+            </span>
+          </a-col>
+          <template v-for="(domain, index) in formState.gldwrstandards"
+                    :key="domain.index + 'domain'">
+            <a-col :span="6">
+              <a-form-item :name="['gldwrstandards',index, 'wrstandardname', ]"
+                           :rules="rules.gldwrstandards.wrstandardname">
+                <a-input class="dialogInput"
+                         v-model:value="domain.wrstandardname"
+                         placeholder="请输入品类"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :span="6">
+              <a-form-item :name="['gldwrstandards',index,'unitid' ]"
+                           :rules="rules.gldwrstandards.unitid">
+                <a-select class="inlineFormSelect"
+                          v-model:value="domain.unitid"
+                          placeholder="请选择单位">
+                  <a-select-option v-for="item in unitList"
+                                   :value="item.enumitemname"
+                                   :key="item.autoid">
+                    {{item.enumdicname}}
+                  </a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <a-col :span="6">
+              <a-form-item :name="['gldwrstandards',index,'convertfactor']"
+                           :rules="rules.gldwrstandards.convertfactor">
+                <a-input-number class="dialogInput"
+                                v-model:value="domain.convertfactor"
+                                placeholder="请输入标仓系数"></a-input-number>
+              </a-form-item>
+            </a-col>
+            <a-col :span="6"
+                   class="tc">
+              <a-button class="plusBtn"
+                        @click="deleteOne('gldwrstandards', index)"
+                        v-if="index > 0">
+                <template #icon>
+                  <MinusOutlined />
+                </template>
+              </a-button>
+              <a-button class="minusBtn"
+                        @click="addOne('gldwrstandards')">
+                <template #icon>
+                  <PlusOutlined />
+                </template>
+              </a-button>
+            </a-col>
+          </template>
+        </a-row>
+      </fieldset>
+      <fieldset class="formFieldSet">
+        <legend>品牌信息</legend>
+        <a-row :gutter="24"
+               class="dialogRowTitle dialogRowTitle2">
+          <a-col :span="12">
+            <span>
+              <span class="red">*</span>
+              品牌
+            </span>
+          </a-col>
+          <a-col :span="12">
+            <span>
+              操作
+            </span>
+          </a-col>
+          <template v-for="(domain, index) in formState.glddgfactoryItems"
+                    :key="domain.index + 'domain'">
+            <a-col :span="12">
+              <a-form-item :name="['glddgfactoryItems',index,'dgfactoryitemvalue']"
+                           :rules="rules.glddgfactoryItems.dgfactoryitemvalue">
+                <a-input class="dialogInput"
+                         v-model:value="domain.dgfactoryitemvalue"
+                         placeholder="请输入品牌"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :span="12">
+              <a-button class="plusBtn"
+                        @click="deleteOne('glddgfactoryItems', index)"
+                        v-if="index > 0">
+                <template #icon>
+                  <MinusOutlined />
+                </template>
+              </a-button>
+              <a-button class="minusBtn"
+                        @click="addOne('glddgfactoryItems')">
+                <template #icon>
+                  <PlusOutlined />
+                </template>
+              </a-button>
+            </a-col>
+          </template>
+        </a-row>
+      </fieldset>
+      <fieldset class="formFieldSet">
+        <legend>套保品种信息</legend>
+        <a-row :gutter="24"
+               class="dialogRowTitle">
+          <a-col :span="6">
+            <span>
+              <span class="red">*</span>
+              套保品种
+            </span>
+          </a-col>
+          <a-col :span="6">
+            <span>
+              <span class="red">*</span>
+              单位
+            </span>
+          </a-col>
+          <a-col :span="6">
+            <span>
+              <span class="red">*</span>
+              套保系数
+            </span>
+          </a-col>
+          <a-col :span="6">
+            <span>
+              操作
+            </span>
+          </a-col>
+          <template v-for="(domain, index) in formState.wrsconvertdetails"
+                    :key="domain.index + 'domain'">
+            <a-col :span="6">
+              <a-form-item :name="['wrsconvertdetails',index,'middlegoodsid']"
+                           :rules="rules.wrsconvertdetails.middlegoodsid">
+                <a-select class="inlineFormSelect"
+                          @change="middleChange(domain.middlegoodsid, domain)"
+                          v-model:value="domain.middlegoodsid"
+                          placeholder="请选择套保品种">
+                  <a-select-option v-for="item in goodsGroup"
+                                   :value="item.goodsgroupid"
+                                   :key="item.goodsgroupid">
+                    {{item.goodsgroupname}}
+                  </a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <a-col :span="6">
+              <a-form-item :name="['wrsconvertdetails', index, 'unitidName']">
+                <a-input class="dialogInput"
+                         readonly
+                         v-model:value="domain.unitidName"
+                         placeholder="选择套保品种后自动填入"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :span="6">
+              <a-form-item :name="['wrsconvertdetails', index, 'convertratio']"
+                           :rules="rules.wrsconvertdetails.convertratio">
+                <a-input-number class="dialogInput"
+                                v-model:value="domain.convertratio"
+                                placeholder="请输入套保系数"></a-input-number>
+              </a-form-item>
+            </a-col>
+            <a-col :span="6"
+                   class="tc">
+              <a-button class="plusBtn"
+                        @click="deleteOne('wrsconvertdetails', index)"
+                        v-if="index > 0">
+                <template #icon>
+                  <MinusOutlined />
+                </template>
+              </a-button>
+              <a-button class="minusBtn"
+                        @click="addOne('wrsconvertdetails')">
+                <template #icon>
+                  <PlusOutlined />
+                </template>
+              </a-button>
+            </a-col>
+          </template>
+        </a-row>
+      </fieldset>
     </a-form>
   </a-modal>
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from 'vue';
+import { defineComponent, PropType, ref, toRaw, watchEffect } from 'vue';
 import { closeModal } from '@/common/setup/modal/index';
 import { initData } from '@/common/methods/index';
+import { PlusOutlined, MinusOutlined } from '@ant-design/icons-vue';
+import { handleAdd, handleFromState, handleGoodsGroup, getGoodsUnit } from './setup';
+import { getGoodsUnitList } from '../../setup';
+import { RuleObject, ValidateErrorEntity } from 'ant-design-vue/es/form/interface';
+import { FormState, WRSConvertDetailEx } from './interface';
+import { validateCommon } from '@/common/setup/validate';
+import { initDG } from '../../list/spot-variety/setup';
+import { ErmcpDeliveryGoodsDetailEx, ErmcpDeliveryGoods } from '@/services/go/ermcp/goodsInfo/interface';
+interface Obj {
+    [props: string]: any;
+}
+
+/**
+ * 检验单位
+ */
+const validateUnit = async (rule: RuleObject, value: number) => {
+    return validateCommon(value, '请选择单位');
+};
+
+/**
+ *
+ */
+const valideteWR = async (rule: RuleObject, value: number) => {
+    return validateCommon(value, '请选择品类');
+};
 
 export default defineComponent({
     name: 'modify-custom',
-    components: {},
     props: {
-        // selectedRow: {
-        //   type:
-        // }
+        selctedDeliveryGoods: {
+            default: initDG,
+            type: Object as PropType<ErmcpDeliveryGoodsDetailEx>,
+        },
+    },
+    components: {
+        PlusOutlined,
+        MinusOutlined,
     },
-    setup() {
+    setup(props, context) {
+        // 控制关闭弹窗
         const { visible, cancel } = closeModal('goods_info_spot_normal_modify');
+        // 下单方法
+        const { loading, addAction } = handleAdd();
 
-        const loading = ref<boolean>(false);
-        const maskClosableFlag = ref<boolean>(false);
+        // 单位列表
+        const unitList = getGoodsUnitList();
+
+        // 表单
+        const formRef = ref();
+        const { formState, addOne, deleteOne } = handleFromState();
+        const rules = {
+            deliverygoodsname: [{ required: true, message: '请输入现货品种名称', trigger: 'blur' }],
+            // unitid: [{ required: true, message: '请选择单位', trigger: 'change' }],
+            unitid: [{ required: true, validator: validateUnit, trigger: 'change' }],
+            gldwrstandards: {
+                unitid: { required: true, validator: validateUnit, trigger: 'change' },
+                wrstandardname: { required: true, message: '请输入品类', trigger: 'blur' },
+                convertfactor: { required: true, message: '请输入标仓系数', trigger: 'blur' },
+            },
+            glddgfactoryItems: {
+                dgfactoryitemvalue: { required: true, message: '请输入品牌', trigger: 'blur' },
+            },
+            wrsconvertdetails: {
+                middlegoodsid: { required: true, validator: valideteWR, trigger: 'change' },
+                convertratio: { required: true, message: '请输入套保系数', trigger: 'blur' },
+            },
+        };
         function submit() {
-            loading.value = true;
-            setTimeout(() => {
-                loading.value = false;
-                cancel();
-            }, 2000);
+            console.log('param', toRaw(formState));
+            formRef.value
+                .validate()
+                .then(() => {
+                    const param = toRaw(formState);
+                    addAction(param).then(() => {
+                        cancel();
+                        context.emit('refresh', true);
+                    });
+                    console.log('param', param);
+                })
+                .catch((error: ValidateErrorEntity<FormState>) => {
+                    console.log('error', error);
+                });
+        }
+        const { goodsGroup, getGoodsGroup } = handleGoodsGroup();
+        /**
+         * 切换套保品种时候，获取对应的单位
+         */
+        function middleChange(id: number, value: WRSConvertDetailEx) {
+            const obj = goodsGroup.value.find((e) => e.groupcategroyid === id);
+            if (obj) {
+                value.unitidName = obj.enumdicname;
+                value.unitid = obj.goodunitid;
+            }
         }
-        initData(() => {});
+        watchEffect(() => {
+            if (props.selctedDeliveryGoods.data.deliverygoodsname) {
+                const { data, gblist, gmlist, mgList } = props.selctedDeliveryGoods;
+                console.log('props.selctedDeliveryGoods', props.selctedDeliveryGoods);
+                // 处理第一次加载的
+                const obj: Obj = {};
+                Object.keys(formState).forEach((el) => {
+                    const key = el.toLocaleLowerCase() as keyof ErmcpDeliveryGoods;
+                    if (Reflect.has(data, key)) {
+                        obj[el] = data[key];
+                    } else {
+                        console.warn(`${key}不对应`);
+                    }
+                });
+                Object.assign(formState, obj);
+                // 单位
+                formState.unitid = data.agreeunit;
+                // 品类
+                formState.gldwrstandards = gmlist.map((e) => {
+                    const { wrstandardid, wrstandardname, convertfactor, unitid } = e;
+                    return { wrstandardid, wrstandardname, convertfactor, unitid };
+                });
+                // 品牌
+                formState.glddgfactoryItems = gblist.map((e) => {
+                    const { brandid, brandname } = e;
+                    return { dgfactoryitemid: brandid, dgfactoryitemvalue: brandname };
+                });
+                // 套保信息
+                formState.wrsconvertdetails = mgList.map((e) => {
+                    const { goodsgroupid, goodsunitid, enumdicname } = e.mg;
+                    return { middlegoodsid: goodsgroupid, unitid: goodsunitid, unitidName: enumdicname, convertratio: e.convertratio };
+                });
+            }
+        });
+        initData(() => {
+            getGoodsGroup();
+        });
         return {
             visible,
             cancel,
+            formRef,
+            formState,
+            addOne,
+            deleteOne,
+            rules,
+            unitList,
+            goodsGroup,
+            middleChange,
             submit,
             loading,
-            maskClosableFlag,
+            maskClosableFlag: false,
         };
     },
 });
 </script>
 
 <style lang="less">
-.modify-custom {
+.addSpotVariety {
+    width: 100%;
+    height: 100%;
+    // padding: 30px;
+    .ant-form.inlineForm .ant-row.ant-form-item .ant-form-item-label {
+        width: 120px !important;
+    }
     .upload {
         display: inline-flex;
         .ant-btn.uploadBtn {
@@ -250,6 +459,129 @@ export default defineComponent({
             cursor: pointer;
         }
     }
+    .red {
+        color: @m-red1;
+    }
+    .ant-btn.minusBtn,
+    .ant-btn.plusBtn {
+        width: 26px;
+        height: 26px;
+        .inlineflex;
+        justify-content: center;
+        background: @m-blue0;
+        .rounded-corners(3px);
+        border: 0;
+        .anticon {
+            font-size: 12px;
+            color: @m-white0;
+            align-self: center;
+            align-items: center;
+        }
+        &:hover,
+        &:focus {
+            background: rgba(@m-blue0, 0.8);
+            .anticon {
+                color: rgba(@m-white0, 0.8);
+            }
+        }
+    }
+    .ant-btn.plusBtn {
+        margin-right: 10px;
+        background: transparent;
+        border: 1px solid #3a87f7;
+        .anticon {
+            color: @m-blue0;
+        }
+    }
+    .white {
+        color: @m-white0;
+    }
+    .dialogTable {
+        .ant-table {
+            .ant-table-content {
+                .ant-table-body {
+                    table {
+                        tr {
+                            td {
+                                padding: 0;
+                                .ant-input.dialogInput {
+                                    height: 34px;
+                                    line-height: 34px;
+                                    border: 0;
+                                    border-radius: 0;
+                                }
+                                .dialogSelect.ant-select-single {
+                                    float: left;
+                                    margin-right: 0;
+                                    .ant-select-selector {
+                                        padding: 0 10px;
+                                        height: 34px;
+                                        background: @m-grey21;
+                                        border: 0;
+                                        border-radius: 0;
+                                        .ant-select-selection-placeholder {
+                                            color: @m-grey10;
+                                            text-align: left;
+                                        }
+                                    }
+                                    .ant-select-arrow {
+                                        color: @m-blue0;
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+    .ant-form.inlineForm {
+        .ant-row.dialogRowTitle {
+            .ant-col {
+                .ant-row.ant-form-item {
+                    .ant-col.ant-form-item-control-wrapper {
+                        width: 100%;
+                        .ant-form-item-control {
+                            .ant-form-item-children {
+                                .ant-input.dialogInput {
+                                    border-radius: 0;
+                                    margin-top: 1px;
+                                    // margin-left: -1px;
+                                    // width: calc(100% + 2px);
+                                }
+                                .ant-select.inlineFormSelect {
+                                    margin-top: 1px;
+                                    .ant-select-selector {
+                                        text-align: left;
+                                    }
+                                }
+                            }
+                        }
+                        .ant-form-item-control.has-error {
+                            text-align: left;
+                            .ant-form-item-children {
+                                .ant-input.dialogInput {
+                                    background: @m-grey21;
+                                }
+                            }
+                            .ant-form-explain {
+                                color: @m-red1;
+                            }
+                        }
+                    }
+                }
+            }
+            .ant-col.tc {
+                text-align: center;
+            }
+        }
+        .ant-row.dialogRowTitle2 {
+            .ant-col:nth-child(3),
+            .ant-col:nth-child(4) {
+                border-top: 1px solid @m-grey20;
+            }
+        }
+    }
 }
 </style
 >;

src/views/information/goods/components/modify/interface.ts

@@ -0,0 +1,31 @@
+export interface GLDWRStandardEx {
+    wrstandardid?: number // uint64 型号ID(修改时有值)
+    wrstandardname: string // string 型号名称
+    unitid: number | undefined// uint64 单位ID
+    convertfactor: number | null// double 标仓系数(接口为3.1及以上版本时传)
+}
+
+// 现货商品品牌数据 0 29 173
+export interface GLDDGFactoryItemEx {
+    dgfactoryitemid?: number // uint64 品牌ID(修改时有值)
+    dgfactoryitemvalue: string // string 品牌名称
+}
+
+// 现货商品折算配置明细数据 0 29 127
+export interface WRSConvertDetailEx {
+    middlegoodsid: number | undefined // uint64 套保品种ID(接口为3.1及以下版本时传套保品种ID，否则传期货品种ID)
+    unitid: number | null// uint64 单位ID
+    unitidName: string;
+    convertratio: number | null// double 套保系数
+}
+export interface FormState {
+    deliverygoodscode?: string // string 交割商品代码(新增时有值)
+    deliverygoodsname?: string // string 交割商品名称(新增时有值)
+    deliverygoodsid?: number// uint64 交割商品id(修改时有值)
+    unitid: number | undefined // uint64 单位ID (undefined 用于前端，传入服务时必须是number类型)
+    type: number// int32 类型 1 新增 2 修改
+    remark: string // string 备注
+    gldwrstandards: GLDWRStandardEx[]; //        GLDWRStandardEx 现货商品型号数据
+    glddgfactoryItems: GLDDGFactoryItemEx[] //   GLDDGFactoryItemEx 现货商品品牌数据
+    wrsconvertdetails: WRSConvertDetailEx[] // WRSConvertDetailEx 现货商品折算配置明细数据
+}

src/views/information/goods/components/modify/setup.ts

@@ -0,0 +1,127 @@
+import { getItemEnum } from '@/services/bus/allEnum';
+import { QueryGoodsfGroup } from '@/services/go/ermcp/goodsInfo';
+import { Ermcp3GoodsGroup } from '@/services/go/ermcp/goodsInfo/interface';
+import { addDeliveryGoodsApply } from '@/services/proto/delivery';
+import { DeliveryGoodsApplyReq } from '@/services/proto/delivery/interface';
+import { message } from 'ant-design-vue';
+import { reactive, ref, UnwrapRef } from 'vue';
+import { FormState } from './interface';
+
+/**
+ * 处理新增
+ * @returns 
+ */
+export function handleAdd() {
+    const loading = ref<boolean>(false);
+    function addAction(param: FormState): Promise<void> {
+        const unitid = param.unitid === undefined ? 0 : param.unitid
+        const reqParam: DeliveryGoodsApplyReq = {
+            deliverygoodscode: param.deliverygoodscode,
+            deliverygoodsname: param.deliverygoodsname,
+            deliverygoodsid: param.deliverygoodsid,
+            unitid: unitid,
+            type: 1,
+            remark: param.remark,
+            gldwrstandards: param.gldwrstandards.map(value => {
+                const gldunitid = value.unitid === undefined ? 0 : value.unitid
+                const convertfactors: any = value.convertfactor === null ? 0 : value.convertfactor
+                return {
+                    wrstandardid: value.wrstandardid,
+                    wrstandardname: value.wrstandardname,
+                    unitid: gldunitid,
+                    convertfactor: (convertfactors as string) ? Number(convertfactors) : convertfactors
+                }
+            }),
+            glddgfactoryItems: param.glddgfactoryItems,
+            wrsconvertdetails: param.wrsconvertdetails.map(value => {
+                const middlegoodsid = value.middlegoodsid === undefined ? 0 : value.middlegoodsid
+                const convertratio: any = value.convertratio === null ? 0 : value.convertratio
+                const wrsunitid = value.unitid === null ? 0 : value.unitid
+                return {
+                    middlegoodsid: middlegoodsid,
+                    convertratio: convertratio ? Number(convertratio) : convertratio,
+                    unitid: wrsunitid
+                }
+            })
+        }
+        loading.value = true;
+        return addDeliveryGoodsApply(reqParam).then(() => {
+            message.success('新增现货品种成功！')
+            Promise.resolve()
+        }).catch(err => message.error(err.message)).finally(() => loading.value = false)
+    }
+    return { loading, addAction }
+}
+
+/**
+ * 处理表单数据
+ * @returns 
+ */
+export function handleFromState() {
+    const formState: UnwrapRef<FormState> = reactive({
+        deliverygoodscode: '', // string 交割商品代码(新增时有值)
+        deliverygoodsname: '', // string 交割商品名称(新增时有值) // 可能没值  有值不能为中文
+        deliverygoodsid: 0,// uint64 交割商品id(修改时有值)
+        unitid: undefined, // uint64 单位ID
+        type: 1,// int32 类型 1 新增 2 修改
+        remark: '', // string 备注
+        gldwrstandards: [
+            { wrstandardname: '', unitid: undefined, convertfactor: null, }
+        ], //        GLDWRStandardEx 现货商品型号数据
+        glddgfactoryItems: [
+            { dgfactoryitemvalue: '', }
+        ], //   GLDDGFactoryItemEx 现货商品品牌数据
+        wrsconvertdetails: [
+            { middlegoodsid: undefined, unitid: null, unitidName: '', convertratio: null, }
+        ], // WRSConvertDetailEx 现货商品折算配置明细数据
+    });
+    type Key = 'gldwrstandards' | 'glddgfactoryItems' | 'wrsconvertdetails'
+    /**
+     *  向动态表单里添加一条数据
+     * @param key 'gldwrstandards' | 'glddgfactoryItems' | 'wrsconvertdetails'
+     */
+    function addOne(key: Key): void {
+        if (key === 'gldwrstandards') {
+            formState[key].push({ wrstandardname: '', unitid: undefined, convertfactor: null })
+        } else if (key === 'glddgfactoryItems') {
+            formState[key].push({ dgfactoryitemvalue: '', })
+        } else if (key === 'wrsconvertdetails') {
+            formState[key].push({ middlegoodsid: undefined, unitid: null, unitidName: '', convertratio: null, })
+        }
+    }
+    /**
+     * 删除动态表单一条数据
+     * @param key 
+     * @param i 
+     */
+    function deleteOne(key: Key, i: number): void {
+        formState[key].splice(i, 1)
+    }
+    return { formState, addOne, deleteOne }
+}
+
+/**
+ * 获取期货商品组
+ * @returns 
+ */
+export function handleGoodsGroup() {
+    const goodsGroup = ref<Ermcp3GoodsGroup[]>([])
+    function getGoodsGroup() {
+        QueryGoodsfGroup().then(res => {
+            console.log('获取期货商品组', res);
+            goodsGroup.value = res.filter(e => e.goodsgroupstatus === 1);
+        }).catch(err => {
+            message.error(err)
+        })
+    }
+    return { goodsGroup, getGoodsGroup }
+}
+
+/**
+ * 获取合约单位
+ * @returns 
+ */
+export function getGoodsUnit(unit: number): string {
+    const obj = getItemEnum('goodsunit').find(e => e.enumitemname === unit);
+    return obj ? obj.enumdicname : '--'
+}

src/views/information/goods/components/rightHedging/index.vue

@@ -182,4 +182,152 @@ export default defineComponent({
 </script>
 
 <style lang="less">
+.rightSpot {
+    width: 100%;
+    height: 100%;
+    padding: 10px 12px;
+    .flex;
+    flex-direction: column;
+    .title {
+        width: 100%;
+        height: 35px;
+        .flex;
+        justify-content: space-between;
+        div {
+            align-self: center;
+            align-items: center;
+        }
+        .tltLeft {
+            font-size: 16px;
+            .icon {
+                font-size: 20px;
+                fill: @m-blue0;
+                margin-right: 10px;
+            }
+        }
+        .tltBtns {
+            .ant-btn + .ant-btn {
+                margin-left: 10px;
+            }
+        }
+    }
+    .spotCont {
+        width: 100%;
+        padding: 0 30px;
+    }
+}
+.blue {
+    color: @m-blue0;
+}
+.green {
+    color: @m-green0;
+}
+.ml10 {
+    margin-left: 10px;
+}
+.blueBtn {
+    width: 80px;
+    height: 26px;
+    text-align: center;
+    background: linear-gradient(0deg, @m-blue2, @m-blue0);
+    box-shadow: -1px 0px 0px 0px #121618;
+    .rounded-corners(3px);
+    border: 0;
+    color: @m-white0;
+    font-size: 14px;
+    &:hover,
+    &:focus {
+        background: linear-gradient(0deg, @m-blue2-hover, @m-blue0-hover);
+        color: @m-white0-hover;
+    }
+}
+.redBtn {
+    width: 80px;
+    height: 26px;
+    background: linear-gradient(0deg, @m-red0, @m-red1);
+    .rounded-corners(3px);
+    border: 0;
+    color: @m-white0;
+    font-size: 14px;
+    &:hover,
+    &:focus {
+        background: linear-gradient(0deg, @m-red0-hover, @m-red1-hover);
+        color: @m-white0-hover;
+    }
+}
+.ant-collapse {
+    background-color: transparent;
+    border: 0;
+    .ant-collapse-item {
+        border: 0;
+        .ant-collapse-header {
+            background-color: transparent;
+            border-bottom: 0;
+        }
+        .ant-collapse-content {
+            background-color: transparent;
+            border-top: 0;
+        }
+    }
+}
+.ant-collapse.spotCollapse.ant-collapse-borderless {
+    margin-top: 10px;
+    background-color: transparent;
+    .ant-collapse-item {
+        border-bottom: 0;
+        .ant-collapse-header {
+            color: @m-grey17;
+            font-size: 14px;
+            border-bottom: 1px solid @m-grey18;
+            padding: 10px 8px 10px 44px;
+            height: 43px;
+            .ant-collapse-arrow {
+                fill: @m-grey17;
+                width: 16px;
+                height: 16px;
+                font-size: 16px;
+                left: 0;
+            }
+        }
+        .ant-collapse-content {
+            .ant-collapse-content-box {
+                padding: 0 0 0 30px;
+                background-color: transparent;
+                .ant-row.contRow {
+                    width: 100%;
+                    height: 40px;
+                    line-height: 40px;
+                    font-size: 16px;
+                    color: @m-white1;
+                    margin-bottom: 10px;
+                    background: #0f161c;
+                    border: 1px solid #172b56;
+                    border-radius: 3px;
+                    padding-left: 14px;
+                    padding-right: 12px;
+                    .ant-col:last-child {
+                        text-align: right;
+                    }
+                    .ant-col:first-child {
+                        text-align: left;
+                    }
+                }
+                .contRow:first-child {
+                    margin-top: 9px;
+                }
+                .contRow:last-child {
+                    margin-bottom: 20px;
+                }
+            }
+        }
+    }
+}
+.ant-row.headRow {
+    .ant-col:first-child {
+        text-align: left;
+    }
+    .ant-col:nth-child(3) {
+        text-align: right;
+    }
+}
 </style>;

src/views/information/goods/components/rightSpot/index.vue

@@ -112,7 +112,7 @@
         </a-collapse-panel>
       </a-collapse>
     </div>
-    <Modify />
+    <Modify :selctedDeliveryGoods="selctedDeliveryGoods" />
     <Disable />
     <SpotDetail />
   </div>