<template>
  <div style="width: 100%;padding-top: 1%;" :style="{'height':heightAll+'px'}">
    <div style="display: flex;width: 100%;margin-left: 1%;justify-content: space-between;">
      <div style="display: flex;width: 40%;">
        <div style="display: flex;width: 100%;align-items: center;">
            <div>
                模型名称:
            </div>
            <el-input v-model="name" style="width:50%;margin-left: 1%;" placeholder="" />
        </div>
        <div style="display: flex;width: 100%;align-items: center;margin-left: 1%;">
            <div>
                提供单位:
            </div>
            <el-input v-model="mdUnit" style="width: 50%;margin-left: 1%;" placeholder="" />
        </div>
      </div>
        <div style="display: flex;align-items: center;margin-right: 3%;">
            <el-button type="primary" style="margin-left: 5%;" @click="getModelListTable" :icon="Search">查询</el-button>
            <el-button type="primary" style="margin-left:5%;" @click="reg" icon="Plus">注册</el-button>
        </div>
    </div>
    <div style="margin-top: 0%;margin-left: 0%;width: 100%;">
        <el-table 
        :data="tableData" 
        style="width: 98%;margin-left: 1%;margin-top: 0.5%;"
        :cell-style="{ padding:'5px' }"
        :header-cell-style="{height: heightAll*0.01+'px',}"
        :row-style="{ fontSize: '16px',textAlign:'center'}"
        border >
        <el-table-column type="index" label="序号" width="80"></el-table-column>
        <el-table-column prop="name" label="模型名称">

        </el-table-column>
        <el-table-column prop="className" label="模型类型" width="160"/>
        <el-table-column prop="mdUnit" label="开发语言" width="160"/>
        <el-table-column prop="registrant" label="部署环境" width="100"/>
        <el-table-column prop="status" label="测试状态" width="140">
            <template #default="scope">
              <el-button v-if="scope.row.st1=='1'" type="success" plain>测试完成</el-button>
              <el-button v-if="scope.row.st1=='2'" type="danger" plain>测试失败</el-button>
              <el-button v-if="scope.row.st1=='3'" type="" plain>不支持</el-button>
            </template>
        </el-table-column>
        <el-table-column prop="st1" label="开发单位" width="140">
            <template #default="scope">
              <el-button v-if="scope.row.st2=='1'" type="success" plain>测试完成</el-button>
              <el-button v-if="scope.row.st2=='2'" type="danger" plain>测试失败</el-button>
              <el-button v-if="scope.row.st2=='3'" type="" plain>暂无评价</el-button>
            </template>
        </el-table-column>
        <el-table-column prop="isApproved" label="是否发布" width="140">
            <template #default="scope">
              <el-button v-if="scope.row.st3=='1'" type="success" plain>已发布</el-button>
              <el-button v-if="scope.row.st3=='2'" type="danger" plain>未发布</el-button>
            </template>
        </el-table-column>
        <el-table-column prop="modifyBy" label="发布时间" width="170"/>
        <el-table-column prop="version" label="版本" width="120"/>
        <el-table-column prop="address" label="操作" width="200">
            <template #default="scope">
                <div style="display: flex;justify-content: space-between;width: 100%;">
                    <el-button type="primary" @click="showEdit(scope.row)" size="mini" text style="margin-left: 0%;">编辑</el-button>
                    <!-- <el-button type="danger" text size="mini" style="margin-left: -5%;" @click="handleDelete(scope.row)">注销</el-button> -->
                    <el-button @click="showDe(scope.row)" type="primary" text size="mini" style="margin-left: 0%;">查看</el-button>
                    <el-button type="danger" @click="delModel(scope.row)" text size="mini" style="margin-left: 0%;">删除</el-button>
                </div>
            </template>
        </el-table-column>
      </el-table>
        <el-dialog v-model="dialogVisible" title="" width="60%" @close="clearForm" destroy-on-close>
                <div class="card-header">
                  <span style="font-size: 20px;margin-left: 1%;">基本信息</span>
                  <el-divider style="margin-top: 1%;"/>
                </div>
              <div>
                <el-form  size="mini"  style="margin-top: 0%;width: 98%;"  :model="formJi" label-position="right" ref="formRefJi" label-width="120px" :rules="rulesJi">
                  <el-row :gutter="40">
                        <el-col :span="8">
                          <el-form-item label="模型名称:" prop="name" style="">
                              <div style="display: flex;width: 120%;justify-content: space-between;">
                                <el-input  v-model="formJi.name" style="width: 100%;"/>
                              </div>
                          </el-form-item>
                        </el-col>
                        <el-col :span="8">
                          <el-form-item label="英文名:" prop="enname" style="">
                            <div style="display: flex;width: 100%;justify-content: space-between;">
                              <el-input  v-model="formJi.enname" style="width: 100%;"/>
                            </div>
                          </el-form-item>
                        </el-col>
                        <el-col :span="6">
                          <el-form-item label="版本号:" prop="" style="">
                            <div style="display: flex;width: 100%;justify-content: space-between;">
                              <el-input  v-model="formJi.version" style="width: 100%;"/>
                            </div>
                          </el-form-item>
                        </el-col>
                  </el-row>
                  <el-row :gutter="48">
                    <el-col :span="8">
                      <el-form-item label="接口分类:" prop="" style="">
                        <div style="display: flex;width: 100%;justify-content: space-between;">
                          <el-select
                          v-model="formJi.type"
                          
                              style="width: 100%;margin-left: 0%;"
                          >
                              <el-option
                              v-for="item in optionsType"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value"
                              />
                          </el-select>
                        </div>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row :gutter="48">
                    <el-col :span="8">
                      <el-form-item label="开发语言:">
                          <el-input  v-model="formJi.devlang" style="width: 100%;" resize="none"/>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row :gutter="48">
                        <el-col :span="16">
                          <el-form-item label="简介:">
                              <el-input  v-model="formJi.intro" style="width: 100%;" :rows="3" resize="none" type="textarea"/>
                          </el-form-item>
                        </el-col>
                  </el-row>
                </el-form>
              </div>
            
              <div class="card-header">
                <span style="font-size: 20px;margin-left: 1%;">单位</span>
                <el-divider style="margin-top: 1%;"/>
              </div>
            <div style="margin-top: 0%;">
              <el-form size="mini" :key="tableKey" style="margin-top: 0%;width: 98%;"  :model="formJi" label-position="right"  label-width="120px" :rules="rulesJi">
                <el-row :gutter="48">
                      <el-col :span="11">
                        <el-form-item label="提供单位:" prop="" style="">
                            <div style="display: flex;width: 100%;justify-content: space-between;">
                              <el-input  v-model="formJi.mdUnit" style="width: 100%;"/>
                            </div>
                        </el-form-item>
                      </el-col>
                      <el-col :span="11">
                        <el-form-item label="联系方式:" prop="" style="">
                          <div style="display: flex;width: 100%;justify-content: space-between;">
                            <el-input  v-model="formJi.mdContact" style="width: 100%;"/>
                          </div>
                        </el-form-item>
                      </el-col>
                </el-row>
                <el-row :gutter="48">
                      <el-col :span="11">
                        <el-form-item label="技术支持单位:" prop="" style="">
                            <div style="display: flex;width: 100%;justify-content: space-between;">
                              <el-input  v-model="formJi.devUnit" style="width: 100%;"/>
                            </div>
                        </el-form-item>
                      </el-col>
                      <el-col :span="11">
                        <el-form-item label="联系方式:" prop="" style="">
                          <div style="display: flex;width: 100%;justify-content: space-between;">
                            <el-input  v-model="formJi.devContact" style="width: 100%;"/>
                          </div>
                        </el-form-item>
                      </el-col>
                </el-row>
              </el-form>
            </div>
            <el-tabs
            v-model="activeName"
            type="card"
            style="margin-top: 1%;"
          >
            <el-tab-pane label="部署情况" name="first">
              <el-form size="mini" :key="tableKey" style="margin-top: 0%;width: 98%;"  :model="formJi" label-position="right" label-width="120px"   :rules="rulesJi">
                <el-row :gutter="48">
                      <el-col :span="11">
                        <el-form-item label="服务器IP:" prop="" style="">
                            <div style="display: flex;width: 100%;justify-content: space-between;">
                              <el-input   v-model="formJi.deployIp" style="width: 100%;"/>
                            </div>
                        </el-form-item>
                      </el-col>
                      <el-col :span="11">
                        <el-form-item label="端口:" prop="" style="">
                          <div style="display: flex;width: 100%;justify-content: space-between;">
                            <el-input placeholder="可填写多个端口，以“,”分隔"  v-model="formJi.deployPort" style="width: 100%;"/>
                          </div>
                        </el-form-item>
                      </el-col>
                </el-row>
                <el-row :gutter="48">
                      <el-col :span="15">
                        <el-form-item label="部署位置:" prop="" style="">
                            <div style="display: flex;width: 100%;justify-content: space-between;">
                              <el-input  v-model="formJi.deployDir" style="width: 100%;"/>
                            </div>
                        </el-form-item>
                      </el-col>
                      <el-col :span="10">
                      </el-col>
                </el-row>
                <el-row :gutter="48">
                      <el-col :span="15">
                        <el-form-item label="服务访问地址:" prop="" style="">
                          <div style="display: flex;width: 100%;justify-content: space-between;">
                            <el-input  v-model="formJi.mirrorImageUrl" style="width: 100%;"/>
                          </div>
                        </el-form-item>
                      </el-col>
                </el-row>
                <el-row :gutter="48">
                      <el-col :span="15">
                        <el-form-item label="服务器运行命令:" prop="" style="">
                          <div style="display: flex;width: 100%;justify-content: space-between;">
                            <el-input  v-model="formJi.mdRunCmd" style="width: 100%;"/>
                          </div>
                        </el-form-item>
                      </el-col>
                </el-row>
              </el-form>
              <div style="display: flex;margin-top: -5%;">
                <div class="card-header" style="margin-top: 5%;display: flex;justify-content: inherit;margin-left: 2%">
                  <span style="font-size: 20px;margin-top: 5%; writing-mode: vertical-rl;position: relative;top: 15%;">运行环境</span>
                </div>
                <el-form size="mini" :key="tableKey" style="margin-top: 5%;width: 85%;"  :model="formJi" label-position="right" label-width="120px"   :rules="rulesJi">
                  <el-row :gutter="48">
                        <el-col :span="12">
                          <el-form-item label="操作系统:" prop="" style="">
                              <div style="display: flex;width: 100%;justify-content: space-between;">
                                <el-select
                                v-model="formJi.envOs"
                                
                                    style="width: 75%;margin-left: 0%;"
                                >
                                    <el-option
                                    v-for="item in optionsEnv"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                    />
                                </el-select>
                              </div>
                          </el-form-item>
                        </el-col>
                        <el-col :span="12">
                          <el-form-item label="运行架构:" prop="" style="">
                            <div style="display: flex;width: 100%;justify-content: space-between;">
                               <el-radio-group v-model="formJi.evnArmX86" class="ml-4" size="small" style="" >
                                    <el-radio label="X86" size="large">X86</el-radio>
                                    <el-radio label="ARM" size="large">ARM</el-radio>
                                </el-radio-group>
                            </div>
                          </el-form-item>
                        </el-col>
                  </el-row>
                  <el-row :gutter="24">
                        <el-col :span="8">
                          <el-form-item label="硬盘:" prop="" style="">
                              <div style="display: flex;width: 100%;" >
                                <el-input-number
                                  v-model="formJi.envDisk"
                                  :min="100"
                                  :max="2048"
                                  size="mini"
                                  controls-position="right"
                                  @change="handleChange"
                                />
                                <div style="margin-left: 4%;font-size: 15px;">
                                  G
                                </div>
                              </div>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8">
                          <el-form-item label="CPU核心数:" prop="" style="">
                            <div style="display: flex;width: 100%;" >
                                <el-input-number
                                  v-model="formJi.envCpuNum"
                                  :max="64"
                                  :min="2"
                                  size="mini"
                                  controls-position="right"
                                  @change="handleChange"
                                />
                                <div style="margin-left: 4%;font-size: 15px;">
                                  个
                                </div>
                              </div>
                          </el-form-item>
                        </el-col>
                        <el-col :span="8">
                          <el-form-item label="内存:" prop="" style="">
                            <div style="display: flex;width: 100%;" >
                                <el-input-number
                                  v-model="formJi.envMem"
                                  :max="512"
                                  :min="1"
                                  size="mini"
                                  controls-position="right"
                                  @change="handleChange"
                                />
                                <div style="margin-left: 4%;font-size: 15px;">
                                  G
                                </div>
                              </div>
                          </el-form-item>
                        </el-col>
                  </el-row>
                  <el-row :gutter="24">
                        <el-col :span="8">
                          <el-form-item label="GPU型号:" prop="" style="">
                              <div style="display: flex;width: 100%;">
                                <el-input   v-model="formJi.envGpuType" style="width: 100%;"/>
                              </div>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8">
                          <el-form-item label="GPU数量:" prop="" style="">
                            <div style="display: flex;width: 100%;" >
                               <el-input-number
                                  v-model="formJi.envGpuNum"
                                  :min="1"
                                  :max="64"
                                  size="mini"
                                  controls-position="right"
                                  @change="handleChange"
                                />
                                <div style="margin-left: 4%;font-size: 15px;">
                                  个
                                </div>
                              </div>
                          </el-form-item>
                        </el-col>
                        <el-col :span="8">
                          <el-form-item label="GUP显存:" prop="" style="">
                            <div style="display: flex;width: 100%;" >
                                <el-input-number
                                  v-model="formJi.envGpuMem"
                                  :min="1"
                                  size="mini"
                                  :max="512"
                                  controls-position="right"
                                  @change="handleChange"
                                />
                                <div style="margin-left: 4%;font-size: 15px;">
                                  G
                                </div>
                              </div>
                          </el-form-item>
                        </el-col>
                  </el-row>
                </el-form>
              </div>
            </el-tab-pane>
            <el-tab-pane label="输入" name="second">
              <el-form style="margin-left: 5%;margin-top: 2%;" label-position="right" label-width="120px" :model="formZu" class="demo-form-inline" ref="formRefZu" :rules="rulesZu">
                <el-form-item label="输入文档:" prop="">
                    <div style="width: 75%;">
                      <el-upload
                          ref="uploadRef"
                          :limit="1"
                          accept=".xlsx, .xls"
                          :headers="upload.headers"
                          :on-change="handleChange"
                          :file-list="fileList"
                          :action="upload.url + '?file=' + upload.updateSupport"
                          :on-progress="handleFileUploadProgress"
                          :on-success="handleFileSuccess"
                          :auto-upload="false"
                          drag
                      >
                          <el-icon class="el-icon--upload"><upload-filled /></el-icon>
                          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
                      </el-upload>
                    </div>
                    <div style="color: #b1b3b8;width: 100%;">
                      注:请上传后缀名为.docx .pdf .txt的文件
                    </div>
                    <el-link type="primary" @click="downIn">{{formJi.mdInName}}</el-link>
                  </el-form-item>
                  <el-form-item label="说明:" prop="" style="margin-left: -1%;">
                    <el-input v-model="formJi.mdInNote" style="width: 75%;" placeholder="请输入组件执行路径" :rows="2" type="textarea" resize="none"/>
                  </el-form-item>
                </el-form>
            </el-tab-pane>
            <el-tab-pane label="输出" name="third">
              <el-form  style="margin-left: 5%;margin-top: 2%;" label-position="right" label-width="120px" :model="formZu" class="demo-form-inline" ref="formRefZu" :rules="rulesZu">
                <el-form-item label="输出文档:" prop="">
                    <div style="width: 75%;">
                      <el-upload
                          ref="uploadRef1"
                          :limit="1"
                          accept=".xlsx, .xls"
                          :headers="upload.headers"
                          :on-change="handleChange1"
                          :file-list="fileList1"
                          :action="upload.url + '?file=' + upload.updateSupport"
                          :on-progress="handleFileUploadProgress"
                          :on-success="handleFileSuccess1"
                          :auto-upload="false"
                          drag
                      >
                          <el-icon class="el-icon--upload"><upload-filled /></el-icon>
                          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
                      </el-upload>
                    </div>
                    <div style="color: #b1b3b8;width: 100%;">
                      注:请上传后缀名为.docx .pdf .txt的文件
                    </div>
                    <el-link type="primary" @click="downOut">{{formJi.mdOutName}}</el-link>
                  </el-form-item>
                  <el-form-item label="说明:" prop="" style="margin-left: -1%;">
                    <el-input v-model="formJi.mdOutNote" style="width: 75%;" placeholder="请输入组件执行路径" :rows="2" type="textarea" resize="none"/>
                  </el-form-item>
                </el-form>
            </el-tab-pane>
          </el-tabs>
            <template #footer>
            <span class="dialog-footer">
                <el-button @click="dialogVisible = false">取消</el-button>
                <el-button type="primary" @click="submit" v-if="!isEdit">
                  提交
                </el-button>
                <el-button type="primary" @click="subEdit" v-if="isEdit">
                  提交
                </el-button>
            </span>
            </template>
        </el-dialog>
        <el-dialog  v-model="dialogVisibleDe" title="" width="50%" @close="" destroy-on-close :key="tableKey">
          <el-descriptions title="基本信息" :column="3" style="margin-top: 0%;margin-left: 1%;">
            <el-descriptions-item label="模型名称:">{{formJi.name}}</el-descriptions-item>
            <el-descriptions-item label="英文名:">{{formJi.enname}}</el-descriptions-item>
            <el-descriptions-item label="版本号:">{{formJi.version}}</el-descriptions-item>
            <el-descriptions-item label="接口分类:">{{formJi.type}}</el-descriptions-item>
            <el-descriptions-item label="开发语言:"  span="2">{{formJi.devlang}}</el-descriptions-item>
            <el-descriptions-item label="简介:" span="3">{{formJi.intro}}</el-descriptions-item>
          </el-descriptions>
          <el-divider style="margin-top: 0%;"/>
          <el-descriptions title="单位" :column="2" style="margin-top: 1%;margin-left: 1%;">
            <el-descriptions-item label="提供单位:">{{formJi.mdUnit}}</el-descriptions-item>
            <el-descriptions-item label="联系方式:">{{formJi.mdContact}}</el-descriptions-item>
            <el-descriptions-item label="技术支持单位:">{{formJi.devUnit}}</el-descriptions-item>
            <el-descriptions-item label="联系方式:">{{formJi.devContact}}</el-descriptions-item>
          </el-descriptions>
          <el-tabs
            v-model="activeName"
            type="card"
            style="margin-top: 1%;"
          >
            <el-tab-pane label="部署情况" name="first">
              <el-descriptions title="" :column="2" style="margin-top: 0%;margin-left: 1%;">
                <el-descriptions-item label="服务器IP:">{{formJi.deployIp}}</el-descriptions-item>
                <el-descriptions-item label="端口:">{{formJi.deployPort}}</el-descriptions-item>
                <el-descriptions-item label="部署位置:">{{formJi.deployDir}}</el-descriptions-item>
                <el-descriptions-item label="服务访问地址:">{{formJi.mirrorImageUrl}}</el-descriptions-item>
                <el-descriptions-item label="服务器运行命令:">{{formJi.mdRunCmd}}</el-descriptions-item>
                <el-descriptions-item label="操作系统:">{{formJi.envOs}}</el-descriptions-item>
                <el-descriptions-item label="运行架构:">{{formJi.evnArmX86}}</el-descriptions-item>
                <el-descriptions-item label="硬盘:">
                  {{formJi.envDisk + 'G'}}
                </el-descriptions-item>
                <el-descriptions-item label="CPU核心数:">
                  {{formJi.envCpuNum + '个'}}
                </el-descriptions-item>
                <el-descriptions-item label="内存:">
                  {{formJi.envMem + 'G'}}
                </el-descriptions-item>
                <el-descriptions-item label="GPU型号:">{{formJi.envGpuType}}</el-descriptions-item>
                <el-descriptions-item label="GPU数量:">
                  {{formJi.envGpuNum + '个'}}
                </el-descriptions-item>
                <el-descriptions-item label="GUP显存:">
                  {{formJi.envGpuMem + 'G'}}
                </el-descriptions-item>
              </el-descriptions>
            </el-tab-pane>
            <el-tab-pane label="输入" name="second">
              <el-descriptions title="" :column="2" style="margin-top: 0%;margin-left: 1%;">
                <el-descriptions-item label="输入文档:">
                  
                </el-descriptions-item>
                <el-descriptions-item label="说明:">{{formJi.mdInNote}}</el-descriptions-item>
              </el-descriptions>
            </el-tab-pane>
            <el-tab-pane label="输出" name="third">
              <el-descriptions title="" :column="2" style="margin-top: 0%;margin-left: 1%;">
                <el-descriptions-item label="输出文档:">
                  
                </el-descriptions-item>
                <el-descriptions-item label="说明:">{{formJi.mdOutNote}}</el-descriptions-item>
              </el-descriptions>
            </el-tab-pane>
          </el-tabs>
        </el-dialog>
    </div>
  </div>
</template>
<script   setup>
import { getModelList,addModel,delMdid,getModelDetail,updateModel,modelFile } from "@/api/register/regCom";
import { ref, onMounted, onUnmounted, nextTick } from 'vue';
import { Search } from '@element-plus/icons-vue'
import {
  ArrowLeft,
  Plus
} from '@element-plus/icons-vue'
import { reactive } from 'vue'
import { forwardRefProps } from 'element-plus/es/components/tooltip-v2/src/forward-ref.mjs';
import { getToken } from "@/utils/auth";
import { fa } from "element-plus/es/locales.mjs";
import { column } from "element-plus/es/components/table-v2/src/common.mjs";
import { TRUE } from "sass";
const { proxy } = getCurrentInstance();
const dragTableRef = ref()
const dialogVisible = ref(false)
const dialogVisibleDe = ref(false)
const active = ref(0)
const isEdit = ref(true)
const name = ref('')
const isAdd = ref(true)
const mdUnit = ref('')

const formJi = ref({
  name:'',
  version:'',
  enname:'',
  devlang:'',
  intro:'',
  type:'',
  mdContact:'',
  mdUnit:'',
  devUnit:'',
  devContact:'',
  deployDir:'',
  deployIp:'',
  deployPort:'',
  mirrorImageUrl:'',
  mdRunCmd:'',
  envOs:'',
  envDisk:'',
  envGpuMem:'',
  evnArmX86:'',
  envCpuNum:'',
  envGpuType:'',
  envGpuNum:'',
  envMem:'',
  mdInNote:'',
  mdOutNote:''
});
const rulesJi = reactive({
  name: [{ required: true, message: '必填', trigger: 'blur' }],
  enname: [{ required: true, message: '必填', trigger: 'blur' }],
});
const formRefJi = ref();

const formZu = ref({
  mirrorImageEurl:'',
  mdCPU:'',
  mdGPU:''
});
const rulesZu = reactive({
  mirrorImageEurl: [{ required: true, message: '必填', trigger: 'blur' }],
  mdCPU: [{ required: true, message: '必填', trigger: 'blur' }],
});
const formRefZu = ref();
const activeName = ref('first')

const upload = reactive({
  // 是否显示弹出层（用户导入）
  open: false,
  // 弹出层标题（用户导入）
  title: "",
  // 是否禁用上传
  isUploading: false,
  // 是否更新已经存在的用户数据
  updateSupport: '',
  // 设置上传的请求头部
  headers: { Authorization: "Bearer " + getToken() },
  // 上传的地址
  url: import.meta.env.VITE_APP_BASE_API + "/common/upload"
});
const downUrl = ref(import.meta.env.VITE_APP_BASE_API)
const tableKey = ref(0);
const totalComReg = ref()
const currentPage = ref(1)
const tableData2 = ref([ 
  { date1:'流域拓扑', date2:'', date3:'single', date4:'基于水文响应' },
  { date1:'雨量站', date2:'', date3:'single', date4:'基于水文响应' },
  { date1:'水库', date2:'', date3:'single', date4:'基于水文响应' }
]);
const tableData3 = ref([
  { date1:'流域拓扑', date2:'', date3:'single', date4:'基于水文响应' },
  { date1:'水库', date2:'', date3:'single', date4:'基于水文响应' },
  { date1:'雨量站', date2:'', date3:'single', date4:'基于水文响应' }
]);
const tableData1= [{date1:'初始状态',
  date2:'sts',
  date3:'数据项',
  date4:'初始状态',
  date5:'是',
  date6:'否',
  date7:'2023-09-08'
}]
const checkGroup = [
    {label:'水文预报'},
    {label:'维水动力'},
    {label:'二维水动力'},
    {label:'机器学习'},
]
let tableData = ref([{name:'1'}])
const heightAll = window.innerHeight
const valueHelpSel = '';
const tableheight = window.innerHeight*0.8
const optionsType = [
  {
    value: '1',
    label: '水利专业模型',
  },
  {
    value: '2',
    label: '排水专业模型',
  },
  {
    value: '3',
    label: '供水专业模型',
  },
  {
    value: '4',
    label: '海洋专业模型',
  },
]
const optionsEnv = ref([
  {
    value: 'windwos',
    label: 'windwos',
  },
  {
    value: 'Linux',
    label: 'Linux',
  },
  {
    value: 'Ubuntu',
    label: 'Ubuntu',
  },
  {
    value: 'CentOS',
    label: 'CentOS',
  },
  {
    value: 'Debian',
    label: 'Debian',
  },
  {
    value: 'RedHat',
    label: 'RedHat',
  },
  {
    value: '统信',
    label: '统信',
  },
  {
    value: '麒麟',
    label: '麒麟',
  },
  {
    value: '欧拉',
    label: '欧拉',
  },
])
const uploadRef = ref(null);
const fileList = ref([]);
const fileList1 = ref([]);
const parForm = ref('')
onMounted(() => {
  getModelListTable()
  // addNewModel()
});
const handleChange = (file, files) => {
  fileList.value = files;
};
const handleChange1 = (file, files) => {
  fileList1.value = files;
};
function showDe(row){
  dialogVisibleDe.value = true
  getModelDetail(row.mdid).then(res=>{
    parForm.value = res.data
    formJi.value = res.data
  })
}
function downIn(){
  var url = formJi.value.mdInName
  console.log(url)
  proxy.download(url,formJi.value.mdInFile);
}
function delModel(row){
  proxy.$modal.confirm('是否确认删除？').then(function () {
    return delMdid(row.mdid);
  }).then(() => {
    getModelListTable();
    proxy.$modal.msgSuccess("删除成功");
  }).catch(() => {});
}
async function showEdit(row){
  dialogVisible.value = true
  isEdit.value = true
  await nextTick()
  getModelDetail(row.mdid).then(res=>{
    formJi.value = res.data
  })
}
async function subEdit(){
  if(fileList.value.length>0&&fileList1.value.length===0){
    console.log(1)
    await proxy.$refs["uploadRef"].submit();
  }
  else if(fileList.value.length>0&&fileList.value.length===0){
    console.log(11)
    await proxy.$refs["uploadRef1"].submit();
  }
  else if(fileList.value.length>0&&fileList.value.length>0){
    console.log(111)
    await proxy.$refs["uploadRef1"].submit();
    await proxy.$refs["uploadRef"].submit();
  }
  else{
    await formRefJi.value.validate((valid) => {
      if(valid){
          updateModel(formJi.value).then(res=>{
          if(res.code===200){
            proxy.$modal.msgSuccess("修改成功");
            dialogVisible.value = false
            getModelListTable()
          }
        })
      }
    });
  }
}
async function submit(){
  formRefJi.value.validate((valid) => {
    console.log(formJi.value,valid)
    if(valid){
        addModel(formJi.value).then(res=>{
        if(res.code===200){
          proxy.$modal.msgSuccess("新增成功");
          dialogVisible.value = false
          getModelListTable()
        }
      })
    }
  })
}
async function handleFileSuccess1(response, file, fileList){
  formJi.value.mdOutFile = response.originalFilename
  formJi.value.mdOutName = response.fileName
  await formRefJi.value.validate((valid) => {
    if(valid){
        updateModel(formJi.value).then(res=>{
        if(res.code===200){
          proxy.$modal.msgSuccess("修改成功");
          dialogVisible.value = false
          getModelListTable()
        }
      })
    }
  });
};
async function handleFileSuccess(response, file, fileList){
  formJi.value.mdInFile = response.originalFilename
  formJi.value.mdInName = response.fileName
  await formRefJi.value.validate((valid) => {
    if(valid){
        updateModel(formJi.value).then(res=>{
        if(res.code===200){
          proxy.$modal.msgSuccess("修改成功");
          dialogVisible.value = false
          getModelListTable()
        }
      })
    }
  });
};
function clearForm(){
  fileList.value = []
  fileList1.value = []
  formJi.value = {
    name:'',
    version:'',
    enname:'',
    devlang:'',
    intro:'',
    type:'',
    mdContact:'',
    mdUnit:'',
    devUnit:'',
    devContact:'',
    deployDir:'',
    deployIp:'',
    deployPort:'',
    mirrorImageUrl:'',
    mdRunCmd:'',
    envOs:'',
    envDisk:'',
    envGpuMem:'',
    evnArmX86:'',
    envCpuNum:'',
    envGpuType:'',
    envGpuNum:'',
    envMem:'',
    mdInNote:'',
    mdOutNote:''
  }
}
function reg(){
  isEdit.value = false
  dialogVisible.value = true
}
function getModelListTable(){
  tableData.value = []
  var par = {
    pageNum:1,
    pageSize:20,
    name:name.value,
    mdUnit:mdUnit.value
  }
  getModelList(par).then(res=>{
    tableData.value = res.rows
    totalComReg.value = res.total
    console.log(tableData)
  })
}
const seledMo = ['primary','plain','plain','plain','plain','plain','plain']

</script>
<style scoped>
:deep(.el-table__body tr:hover > td) {
  background-color: #eaf7ff !important;
}
.drag-handle {
  cursor: move;
}

.ghost {
  opacity: 0.5;
  background: #c8ebfb;
}

/* 防止文字选中 */
:deep(.el-table__row) {
  user-select: none;
  -webkit-user-select: none;
}
</style>
<style scoped lang="scss">


.el-table .el-table__row td {
  height: 60px !important; /* 行高 */
}
.custom-tree-node {
  display: flex;       /* 启用 Flex 布局 */
  align-items: center; /* 垂直居中 */
  gap: 8px;            /* 图标与文字间距 */
}
</style>