可编辑状态

src/views/products/Detail/ProductInfoForm.jsx

@@ -22,7 +22,7 @@ import { PERM_PRODUCTS_MANAGEMENT, PERM_PRODUCTS_OFFER_AUDIT, PERM_PRODUCTS_OFFE
 
 const { RangePicker } = DatePicker;
 
-const InfoForm = ({ onSubmit, onReset, onValuesChange, editable, showSubmit, confirmText, formName, ...props }) => {
+const InfoForm = ({ onSubmit, onReset, onValuesChange, editable: _editable, showSubmit, confirmText, formName, ...props }) => {
   const { t } = useTranslation('products');
   const isPermitted = useAuthStore((state) => state.isPermitted);
   const [loading, setLoading, agencyProducts, editingProduct, setEditingProduct] = useProductsStore((state) => [state.loading, state.setLoading, state.agencyProducts, state.editingProduct, state.setEditingProduct]);
@@ -38,20 +38,24 @@ const InfoForm = ({ onSubmit, onReset, onValuesChange, editable, showSubmit, con
   };
   const filedsets = useProductsTypesFieldsets(editingProduct?.info?.product_type_id);
   const shows = filedsets[0];
-  // console.log('filedsets', filedsets, shows);
+
+  const topPerm = isPermitted(PERM_PRODUCTS_OFFER_AUDIT); // 高级权限
+  const [ignoreEditable, setIgnoreEditable] = useState(false);
+  const [editable, setEditable] = useState(true);
   useEffect(() => {
-    // const dest = formValuesMapper(formValues);
     form.resetFields();
-    // form.setFieldsValue(editingProduct?.info);
     form.setFieldValue('city', { value: editingProduct?.info?.city_id, label: editingProduct?.info?.city_name });
     form.setFieldValue('dept', { value: editingProduct?.info?.dept_id, label: editingProduct?.info?.dept_name });
-    // form.setFieldValue('open_weekdays', ['1', '2', '3', '4', '5', '6', '7']);
+
+    const isNew = isEmpty(editingProduct?.info?.id) || _editable; // 新增产品; 状态=新增
+    const ignoreEditable0 = topPerm || isNew; // 允许编辑
+    const editable0 = isEmpty(editingProduct) ? false : _editable; // 空对象未操作
+    setIgnoreEditable(ignoreEditable0);
+    // console.log('+++++++++++++++++++', '\ntopPerm', topPerm, '\nisNew', isNew, '\nignoreEditable0', ignoreEditable0, '\neditable0', editable0, '\n_editable', _editable);
+    setEditable(editable0);
     return () => {};
-  }, [editingProduct?.info?.id]);
+  }, [editingProduct?.info?.id, _editable])
 
-  const topPerm = isPermitted(PERM_PRODUCTS_OFFER_AUDIT);
-  const isNew = isEmpty(editingProduct?.info?.id) || editable;
-  const ignoreEditable = topPerm || isNew;
 
   const onFinish = (values) => {
     console.log('Received values of form, origin form value: \n', values);
@@ -93,11 +97,16 @@ const InfoForm = ({ onSubmit, onReset, onValuesChange, editable, showSubmit, con
           )} */}
         </Row>
         {/* <Divider className='my-1' /> */}
-        <ProductInfoLgc editable={editable} ignoreEditable={ignoreEditable} formInstance={form} />
+        <Form.Item name={'lgc_details'} initialValue={[]}>
+          <ProductInfoLgc editable={editable} ignoreEditable={ignoreEditable} formInstance={form} />
+        </Form.Item>
 
         <Form.Item hidden name={'id'} label={'ID'}>
           <Input />
         </Form.Item>
+        <Form.Item hidden name={'title'} label={'title'}>
+          <Input />
+        </Form.Item>
         {editable && (
           <Form.Item>
             <div className='flex justify-around'>
@@ -148,7 +157,7 @@ function getFields(props) {
     item(
       'code',
       99,
-      <Form.Item name='code' label={t('Code')} {...fieldProps.code} _initialValue={at(props, 'initialValue.code')[0]}>
+      <Form.Item name='code' label={t('Code')} {...fieldProps.code} rules={[{required: true}]}>
         <Input allowClear {...fieldComProps.code} {...styleProps} {...editableProps('code')} />
       </Form.Item>,
       fieldProps?.code?.col || midCol
@@ -156,7 +165,7 @@ function getFields(props) {
     item(
       'city', // todo:
       99,
-      <Form.Item name='city' label={t('City')} {...fieldProps.city} _initialValue={at(props, 'initialValue.city_id')[0]}>
+      <Form.Item name='city' label={t('City')} {...fieldProps.city}>
         <CitySelector {...styleProps} {...editableProps('city_id')} />
       </Form.Item>,
       fieldProps?.city?.col || midCol
@@ -196,8 +205,8 @@ function getFields(props) {
           labelInValue={false}
           options={[
             { value: '1', label: 'Top 1' },
-            { value: '2', label: '2' },
-            { value: '3', label: '3' },
+            { value: '2', label: 'Top 2' },
+            { value: '3', label: 'Top 3' },
             { value: '4', label: '4' },
             { value: '5', label: '5' },
           ]}
@@ -335,8 +344,8 @@ const formValuesMapper = (values) => {
   }
   // omit empty
   // Object.keys(dest).forEach((key) => (dest[key] == null || dest[key] === '' || dest[key].length === 0) && delete dest[key]);
-  const { lgc_details, lgc_details_mapped, ...info } = dest;
-  return { info, lgc_details, lgc_details_mapped };
+  const { lgc_details, lgc_details_mapped, quotation, ...info } = dest;
+  return { info, lgc_details, lgc_details_mapped, quotation };
 };