<template>
  <div class="tab-content">
    <div class="tab-content">
      <el-form :model="jcFormData" :label-width="150" :disabled="isPreview">
        <el-collapse v-model="activeCollapse">
          <el-collapse-item title="投决计划" name="投决计划">
            <div class="tab-handle">
              <el-button
                type="primary"
                size="small"
                @click="downloadTemplate('tjjh')"
                >模板下载</el-button
              >
              <el-upload
                :action="
                  windowConfig.baseUrl + '/api/template/importExcelTempData'
                "
                :headers="{ Authorization: token }"
                :show-file-list="false"
                :data="{
                  tampName: 'tjjh',
                  projectId: formData.id,
                }"
                :on-success="(res, file) => importTjjh(res.data, file)"
              >
                <el-button type="primary" size="small" style="margin-left: 12px"
                  >导入数据</el-button
                >
              </el-upload>
            </div>
            <el-table
              :data="jcTjjhData"
              style="width: 100%"
              empty-text="暂无数据"
              border
            >
              <el-table-column
                v-for="(column, index) in tjglColumns"
                :key="index"
                :prop="column.key"
                :label="column.label"
              >
                <el-table-column
                  v-for="(col, ind) in column.children"
                  :key="ind"
                  :prop="col.key"
                  :label="col.label"
                  :width="ind === 1 ? 180 : null"
                >
                  <template #default="scope">
                    <el-table-column
                      v-if="col.children?.length"
                      v-for="(col_, ind_) in col.children"
                      :key="ind_"
                      :prop="col_.key.toString()"
                      :label="col_.label.toString()"
                      width="180"
                    >
                      <template #default="scope_">
                        <el-input
                          v-if="
                            scope_.row[col.children[1].key] ||
                            scope_.row[col.children[1].key] === 0
                          "
                          v-model="scope_.row[col_.key.toString()]"
                          :min="0"
                          :max="99999999999.99999999"
                          controls-position="right"
                        />
                        <span v-else></span>
                      </template>
                    </el-table-column>
                    <span v-else>{{ scope.row[col.key] }}</span>
                  </template>
                </el-table-column>
              </el-table-column>
            </el-table>
          </el-collapse-item>
          <el-collapse-item title="项目可行性" name="项目可行性">
            <el-tabs
              v-model="activeFinanceTab"
              type="border-card"
              style="margin-top: 16px"
            >
              <el-tab-pane label="项目投资资金流量表" name="项目投资资金流量表">
                <div class="tab-handle">
                  <el-button
                    type="primary"
                    size="small"
                    @click="downloadTemplate('xmtzzjll')"
                    >模板下载</el-button
                  >
                  <el-upload
                    :action="
                      windowConfig.baseUrl + '/api/template/importExcelTempData'
                    "
                    :headers="{ Authorization: token }"
                    :show-file-list="false"
                    :data="{
                      tampName: 'xmtzzjll',
                      projectId: formData.id,
                    }"
                    :on-success="(res, file) => importXmtzzjll(res.data, file)"
                  >
                    <el-button
                      type="primary"
                      size="small"
                      style="margin-left: 12px"
                      >导入数据</el-button
                    >
                  </el-upload>
                </div>
                <el-table
                  :data="xmtzzjllData"
                  style="width: 100%"
                  empty-text="暂无数据"
                  border
                >
                  <el-table-column
                    v-for="(column, index) in xmtzzjllColumns"
                    :key="index"
                    :prop="column.key"
                    :label="column.label"
                  >
                    <el-table-column
                      v-for="(col, ind) in column.children"
                      :key="ind"
                      :prop="col.key"
                      :label="col.label"
                      :width="ind === 1 ? 180 : null"
                    >
                      <template #default="scope">
                        <el-table-column
                          v-if="col.children?.length"
                          v-for="(col_, ind_) in col.children"
                          :key="ind_"
                          :prop="col_.key.toString()"
                          :label="col_.label.toString()"
                          width="180"
                        >
                          <template #default="scope_">
                            <el-input
                              v-if="
                                scope_.row[col.children[1].key] ||
                                scope_.row[col.children[1].key] === 0
                              "
                              v-model="scope_.row[col_.key.toString()]"
                              :min="0"
                              :max="99999999999.99999999"
                              controls-position="right"
                            />
                            <span v-else></span>
                          </template>
                        </el-table-column>
                        <span v-else>{{ scope.row[col.key] }}</span>
                      </template>
                    </el-table-column>
                  </el-table-column>
                </el-table>
              </el-tab-pane>

              <el-tab-pane
                label="项目资本金现金流量表"
                name="项目资本金现金流量表"
              >
                <div class="tab-handle">
                  <el-button
                    type="primary"
                    size="small"
                    @click="downloadTemplate('xmzbjxjll')"
                    >模板下载</el-button
                  >
                  <el-upload
                    :action="
                      windowConfig.baseUrl + '/api/template/importExcelTempData'
                    "
                    :headers="{ Authorization: token }"
                    :show-file-list="false"
                    :data="{
                      tampName: 'xmzbjxjll',
                      projectId: formData.id,
                    }"
                    :on-success="(res, file) => importXmzbjxjll(res.data, file)"
                  >
                    <el-button
                      type="primary"
                      size="small"
                      style="margin-left: 12px"
                      >导入数据</el-button
                    >
                  </el-upload>
                </div>
                <el-table
                  :data="xmzbjxjllData"
                  style="width: 100%"
                  empty-text="暂无数据"
                  border
                >
                  <el-table-column
                    v-for="(column, index) in xmzbjxjllColumns"
                    :key="index"
                    :prop="column.key"
                    :label="column.label"
                  >
                    <el-table-column
                      v-for="(col, ind) in column.children"
                      :key="ind"
                      :prop="col.key"
                      :label="col.label"
                      :width="ind === 1 ? 180 : null"
                    >
                      <template #default="scope">
                        <el-table-column
                          v-if="col.children?.length"
                          v-for="(col_, ind_) in col.children"
                          :key="ind_"
                          :prop="col_.key.toString()"
                          :label="col_.label.toString()"
                          width="180"
                        >
                          <template #default="scope_">
                            <el-input
                              v-if="
                                scope_.row[col.children[1].key] ||
                                scope_.row[col.children[1].key] === 0
                              "
                              v-model="scope_.row[col_.key.toString()]"
                              :min="0"
                              :max="99999999999.99999999"
                              controls-position="right"
                            />
                            <span v-else></span>
                          </template>
                        </el-table-column>
                        <span v-else>{{ scope.row[col.key] }}</span>
                      </template>
                    </el-table-column>
                  </el-table-column>
                </el-table>
              </el-tab-pane>

              <el-tab-pane label="投资各方现金流量表" name="投资各方现金流量表">
                <div class="tab-handle">
                  <el-button
                    type="primary"
                    size="small"
                    @click="downloadTemplate('njfxjll')"
                    >模板下载</el-button
                  >
                  <el-upload
                    :action="
                      windowConfig.baseUrl + '/api/template/importExcelTempData'
                    "
                    :headers="{ Authorization: token }"
                    :show-file-list="false"
                    :data="{
                      tampName: 'njfxjll',
                      projectId: formData.id,
                    }"
                    :on-success="(res, file) => importNjfxjll(res.data, file)"
                  >
                    <el-button
                      type="primary"
                      size="small"
                      style="margin-left: 12px"
                      >导入数据</el-button
                    >
                  </el-upload>
                </div>
                <el-table
                  :data="njfxjllData"
                  style="width: 100%"
                  empty-text="暂无数据"
                  border
                >
                  <el-table-column
                    v-for="(column, index) in njfxjllColumns"
                    :key="index"
                    :prop="column.key"
                    :label="column.label"
                  >
                    <el-table-column
                      v-for="(col, ind) in column.children"
                      :key="ind"
                      :prop="col.key"
                      :label="col.label"
                      :width="ind === 1 ? 180 : null"
                    >
                      <template #default="scope">
                        <el-table-column
                          v-if="col.children?.length"
                          v-for="(col_, ind_) in col.children"
                          :key="ind_"
                          :prop="col_.key.toString()"
                          :label="col_.label.toString()"
                          width="180"
                        >
                          <template #default="scope_">
                            <!-- 去掉空白单元行 -->
                            <el-input
                              v-if="
                                scope_.row[col.children[1].key] ||
                                scope_.row[col.children[1].key] === 0
                              "
                              v-model="scope_.row[col_.key.toString()]"
                              :min="0"
                              :max="99999999999.99999999"
                              controls-position="right"
                            />
                            <span v-else></span>
                          </template>
                        </el-table-column>
                        <span v-else>{{ scope.row[col.key] }}</span>
                      </template>
                    </el-table-column>
                  </el-table-column>
                </el-table>
              </el-tab-pane>

              <el-tab-pane label="利润表" name="利润表">
                <div class="tab-handle">
                  <el-button
                    type="primary"
                    size="small"
                    @click="downloadTemplate('lrb')"
                    >模板下载</el-button
                  >
                  <el-upload
                    :action="
                      windowConfig.baseUrl + '/api/template/importExcelTempData'
                    "
                    :headers="{ Authorization: token }"
                    :show-file-list="false"
                    :data="{
                      tampName: 'lrb',
                      projectId: formData.id,
                    }"
                    :on-success="(res, file) => importLrb(res.data, file)"
                  >
                    <el-button
                      type="primary"
                      size="small"
                      style="margin-left: 12px"
                      >导入数据</el-button
                    >
                  </el-upload>
                </div>
                <el-table
                  :data="lrbData"
                  style="width: 100%"
                  empty-text="暂无数据"
                  border
                >
                  <el-table-column
                    v-for="(column, index) in lrbColumns"
                    :key="index"
                    :prop="column.key"
                    :label="column.label"
                  >
                    <el-table-column
                      v-for="(col, ind) in column.children"
                      :key="ind"
                      :prop="col.key"
                      :label="col.label"
                      :width="ind === 1 ? 180 : null"
                    >
                      <template #default="scope">
                        <el-table-column
                          v-if="col.children?.length"
                          v-for="(col_, ind_) in col.children"
                          :key="ind_"
                          :prop="col_.key.toString()"
                          :label="col_.label.toString()"
                          width="180"
                        >
                          <template #default="scope_">
                            <el-input
                              v-if="
                                scope_.row[col.children[1].key] ||
                                scope_.row[col.children[1].key] === 0
                              "
                              v-model="scope_.row[col_.key.toString()]"
                              :min="0"
                              :max="99999999999.99999999"
                              controls-position="right"
                            />
                            <span v-else></span>
                          </template>
                        </el-table-column>
                        <span v-else>{{ scope.row[col.key] }}</span>
                      </template>
                    </el-table-column>
                  </el-table-column>
                </el-table>
              </el-tab-pane>
            </el-tabs>
          </el-collapse-item>
          <el-collapse-item title="投评报告及测算表" name="投评报告及测算表">
            <FileUploader v-model="jcFormData.tpbgjcsb" />
          </el-collapse-item>
        </el-collapse>
      </el-form>
    </div>
  </div>
</template>

<script setup>
import { ref, inject } from "vue";
import FileUploader from "@/components/FileUploader/index.vue";

const activeFinanceTab = ref("项目投资资金流量表");

const {
  jcFormData,
  tpbgjcsbData,
  formData,
  isPreview,
  tpbgjcsb,
  activeCollapse,
  jcTjjhData,
  tjglColumns,
  xmtzzjllData,
  xmtzzjllColumns,
  xmzbjxjllData,
  xmzbjxjllColumns,
  njfxjllData,
  njfxjllColumns,
  lrbData,
  lrbColumns,
  downloadTemplate,
  importTjjh,
  importXmtzzjll,
  importXmzbjxjll,
  importNjfxjll,
  importLrb,
  windowConfig,
  token,
} = inject("jcShared");
</script>
