taskid：099 remark:"commit"

hx-ai-intelligent/src/view/carbonEmissionManage/carbonInventoryCheck/index.vue

@@ -1,8 +1,55 @@
 <template>
-  <ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" />
+  <!-- 首页 -->
+  <div v-if="isMainPage">
+    <ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" />
+  </div>
+  <!-- 填报页 -->
+  <div v-if="fillInPage">
+
+  </div>
+  <!-- 新增报告弹窗 -->
+  <a-drawer
+    :width="500"
+    :visible="visible"
+    :body-style="{ paddingBottom: '80px' }"
+    :footer-style="{ textAlign: 'right' }"
+    destroyOnClose
+    @close="onClose">
+    <a-form
+      ref="formRef"
+      :model="formState"
+      :rules="rules"
+      :label-col="labelCol"
+      :wrapper-col="wrapperCol"
+    >
+      <a-form-item ref="name" label="报告名称" name="energyType">
+        <a-input v-model:value="formState.energyType" placeholder="请输入报告名称" />
+      </a-form-item>
+      <a-form-item ref="name" label="报告年度" name="energyType">
+        <a-date-picker v-model:value="value5" picker="year" />
+      </a-form-item>
+      <a-form-item ref="name" label="适用标准" name="energyType">
+        <a-input v-model:value="formState.energyType" placeholder="请输入适用标准" />
+      </a-form-item>
+      <a-form-item label="报告周期" name="emissionType" :required="isRequired">
+        <a-select v-model:value="formState.emissionType" placeholder="请选择排放类型">
+          <a-select-option v-for="(item, index) in emissionTypeDic" :key="index" :value="item.id">
+            {{ item.cnValue }}
+          </a-select-option>
+        </a-select>
+      </a-form-item>
+      <a-form-item ref="name" label="适用标准" name="energyType">
+        <a-range-picker v-model:value="value4" picker="month" />
+      </a-form-item>
+    </a-form>
+    <template #footer>
+      <a-button style="margin-right: 8px" @click="onClose">取消</a-button>
+      <a-button type="primary" @click="onSubmit">确定</a-button>
+    </template>
+  </a-drawer>
 </template>
 
-<script  lang="ts" setup>
+<script lang="ts" setup>
   import { ref } from 'vue';
   import { http } from '/nerv-lib/util/http';
   import { carbonEmissionFactorLibrary } from '/@/api/carbonEmissionFactorLibrary';
@@ -13,6 +60,27 @@
   const fetch = (api, params = { orgId }) => {
     return http.post(api, params);
   };
+  // 判断展示哪个页面
+  const isMainPage = ref(false);
+  const fillInPage = ref(true);
+  // 新增相关数据
+  const visible = ref(false);
+  const formState = ref({})
+  const formRef = ref();
+  const labelCol = { span: 5 };
+  const wrapperCol = { span: 19 };
+  // 定义form表单的必填
+  const rules: Record<string, Rule[]> = {
+    energyType: [{ required: true, message: '请输入能源种类', trigger: 'change' }],
+    isComputeCarbon: [{ required: true, message: '请选择是否计算碳排', trigger: 'change' }]
+  };
+  // 关闭新增抽屉
+  const onClose = () => {
+    visible.value = false;
+    formState.value = {}
+    formRef.value.resetFields();
+  };
+  // 表格相关数据
   const tableConfig = ref({
     title: '数据库',
     api: carbonEmissionFactorLibrary.getTableList,
@@ -25,6 +93,7 @@
         name: 'userAdd',
         type: 'primary',
         handle: () => {
+          visible.value = true
         },
       },
     ],
@@ -67,12 +136,15 @@
           label: '编辑',
           name: 'userEdit',
           handle: (record: any) => {
+            visible.value = true
           },
         },
         {
           label: '填报',
           name: 'fillIn',
           handle: (record: any) => {
+            isMainPage.value = false
+            fillInPage.value = true
           },
         },
         {
@@ -91,7 +163,6 @@
         },
       ],
     },
-
     formConfig: {
       schemas: [
         {
@@ -103,11 +174,22 @@
             maxLength: 30,
           },
         },
+        {
+          field: 'createTime1',
+          label: '采购日期',
+          component: 'NsRangePicker',
+          fieldMap: ['purchaseBeginDate', 'purchaseEndDate'],
+          componentProps: {
+            valueFormat: 'YYYY-MM-DD',
+            placeholder: ['报告年度', '报告年度'],
+          },
+        },
       ],
       params: {},
     },
     rowKey: 'id',
   });
+  // 填报页
 </script>
 
 <style lang="less" scoped>