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

<template>
  <!-- 首页 -->
  <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>
  import { ref } from 'vue';
  import { http } from '/nerv-lib/util/http';
  import { carbonEmissionFactorLibrary } from '/@/api/carbonEmissionFactorLibrary';
  defineOptions({ name: 'CarbonInventoryCheck' });
  const orgId = ref('');
  const result = JSON.parse(sessionStorage.getItem('ORGID')!);
  orgId.value = result;
  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,
    params: {
      orgId
    },
    headerActions: [
      {
        label: '新增',
        name: 'userAdd',
        type: 'primary',
        handle: () => {
          visible.value = true
        },
      },
    ],
    columns: [
      {
        title: '序号',
        customRender: (text: any) => {
          return text.index + 1;
        },
      },
      {
        title: '企业名称',
        dataIndex: 'emissionSources',
      },
      {
        title: '报告名称',
        dataIndex: 'emissionTypeColumn',
      },
      {
        title: '报告年度',
        dataIndex: 'emissionGas',
      },
      {
        title: '适用标准',
        dataIndex: 'emissionProcess',
      },
      {
        title: '更新人',
        dataIndex: 'emissionFactors',
      },
      {
        title: '更新时间',
        dataIndex: 'emissionFactorUnits',
      },
    ],
    columnActions: {
      title: '操作',
      actions: [
        {
          label: '编辑',
          name: 'userEdit',
          handle: (record: any) => {
            visible.value = true
          },
        },
        {
          label: '填报',
          name: 'fillIn',
          handle: (record: any) => {
            isMainPage.value = false
            fillInPage.value = true
          },
        },
        {
          label: '下载',
          name: 'download',
          handle: (record: any) => {
          },
        },
        {
          label: '删除',
          name: 'userDelete',
          dynamicParams: { ids: 'id[]' },
          confirm: true,
          isReload: true,
          api: carbonEmissionFactorLibrary.del,
        },
      ],
    },
    formConfig: {
      schemas: [
        {
          field: 'emissionSources',
          label: '报告名称',
          component: 'NsInput',
          componentProps: {
            placeholder: '请输入报告名称',
            maxLength: 30,
          },
        },
        {
          field: 'createTime1',
          label: '采购日期',
          component: 'NsRangePicker',
          fieldMap: ['purchaseBeginDate', 'purchaseEndDate'],
          componentProps: {
            valueFormat: 'YYYY-MM-DD',
            placeholder: ['报告年度', '报告年度'],
          },
        },
      ],
      params: {},
    },
    rowKey: 'id',
  });
  // 填报页
</script>

<style lang="less" scoped>

</style>