煤质管理前端代码

 src/views/xmcpms/coal-quality/analysis/full/FullForm.vue

对比新文件
@@ -0,0 +1,332 @@
<template>
  <Dialog width="60%" v-model="dialogVisible" :title="dialogTitle">
    <el-tabs>
      <el-tab-pane label="全级浮沉台账">
        <el-form :model="formData" :rules="dataRule" ref="formData"
                 v-loading="formLoading"
                 label-width="120px">
          <el-row>
            <el-col :span="12">
              <el-form-item prop="code" label="流水号">
                <el-input size="mini" disabled v-model="formData.code" placeholder="流水号"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="ny" label="年月">
                <el-date-picker
                    style="width: 100%;"
                    v-model="formData.ny"
                    type="month"
                    format="yyyy-MM"
                    value-format="yyyy-MM"
                    placeholder="年月"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item prop="type" label="实验类别">
                <dict-select-tag style="width: 100%"
                                 size="mini"
                                 v-model="formData.type"
                                 placeholder="实验类别"
                                 dictCode="sylb"
                                 clearable/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="mz" label="煤种">
                <dict-select-tag style="width: 100%"
                                 size="mini"
                                 v-model="formData.mz"
                                 placeholder="煤种"
                                 dictCode="ymmz"
                                 :clearable="true"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item prop="syyp" label="实验样品">
                <dict-select-tag style="width: 100%"
                                 size="mini"
                                 v-model="formData.syyp"
                                 placeholder="实验样品"
                                 dictCode="syyp"
                                 :clearable="true"/>
              </el-form-item>
            </el-col>
<!--            <el-col :span="12">-->
<!--              <el-form-item prop="fcfa" :label="$t('analysis.fcfa')">-->
<!--                <dict-select-tag style="width: 100%"-->
<!--                                 size="mini"-->
<!--                                 v-model="formData.fcfa"-->
<!--                                 :placeholder="$t('analysis.fcfa')"-->
<!--                                 dictCode="analysis-fcfa"-->
<!--                                 :clearable="true"/>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item prop="syrq" label="实验日期">
                <el-date-picker
                    style="width: 100%;"
                    v-model="formData.syrq"
                    size="mini"
                    type="date"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd 00:00:00"
                    placeholder="实验日期"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="sybz" label="实验班组">
                <el-input size="mini" v-model="formData.sybz" placeholder="实验班组"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item prop="syfzr" label="实验负责人">
                <el-input size="mini" v-model="formData.syfzr" placeholder="实验负责人"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="hyy" label="化验员">
                <el-input size="mini" v-model="formData.hyy" placeholder="化验员"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item prop="myzz" label="煤样总重">
                <el-input-number size="mini"
                                 style="width: 100%;"
                                 v-model="formData.myzz"
                                 placeholder="煤样总重"
                                 controls-position="right"
                                 :precision="2"
                                 :min="0"
                                 :max="10000"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="myzh" label="煤样总灰">
                <el-input-number v-model="formData.myzh"
                                 size="mini"
                                 style="width: 100%;"
                                 placeholder="煤样总灰"
                                 controls-position="right"
                                 :precision="2"
                                 :min="0"
                                 :max="100"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item prop="myzl" label="煤样总硫">
                <el-input-number v-model="formData.myzl"
                                 size="mini"
                                 style="width: 100%;"
                                 placeholder="煤样总硫"
                                 controls-position="right"
                                 :precision="2"
                                 :min="0"
                                 :max="100"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item prop="bz" label="备注">
                <el-input size="mini" v-model="formData.bz" placeholder="备注" type="textarea"
                          :rows="2"/>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="全级浮沉数据">
        <el-form :inline="true">
          <el-form-item>
            <el-upload
                class="upload-demo"
                :action="action"
                :on-success="handleExcel"
                :multiple="false"
                :show-file-list="false"
                :on-change="changeFile"
                :file-list="fileList"/>
              <el-button size="mini" type="primary">点击上传</el-button>
          </el-form-item>
          <el-form-item>
            <el-button size="mini" type="success" @click="downloadExcel">下载模板</el-button>
          </el-form-item>
        </el-form>
        <el-form :model="formData" :rules="dataRule" ref="formDataDet"
                 label-width="120px">
          <el-table
              :data="formData.detList"
              border
              height="400"
              style="width: 100%;">
            <el-table-column prop="mdjName" label="密度级" header-align="center"
                             align="center"/>
            <el-table-column prop="zl" label="重量(kg)" header-align="center" align="center">
              <template #default="scope">
                <el-input-number v-model="scope.row.zl"
                                 size="mini"
                                 style="width: 80px;"
                                 placeholder="重量(kg)"
                                 :precision="2"
                                 :controls="false"
                                 :min="0"
                                 :max="10000"/>
              </template>
            </el-table-column>
            <el-table-column prop="cl" label="产率(%)" header-align="center" align="center">
              <template #default="scope">
                <el-input-number v-model="scope.row.cl"
                                 size="mini"
                                 style="width: 80px;"
                                 placeholder="产率(%)"
                                 :precision="2"
                                 :controls="false"
                                 :min="0"
                                 :max="100"/>
              </template>
            </el-table-column>
            <el-table-column prop="hf" label="灰分(%)" header-align="center" align="center">
              <template #default="scope">
                <el-input-number v-model="scope.row.hf"
                                 size="mini"
                                 style="width: 80px;"
                                 placeholder="灰分(%)"
                                 :precision="2"
                                 :controls="false"
                                 :min="0"
                                 :max="100"/>
              </template>
            </el-table-column>
            <el-table-column prop="lf" label="硫分(%)" header-align="center" align="center">
              <template #default="scope">
                <el-input-number v-model="scope.row.lf"
                                 size="mini"
                                 style="width: 80px;"
                                 placeholder="硫分(%)"
                                 :precision="2"
                                 :controls="false"
                                 :min="0"
                                 :max="100"/>
              </template>
            </el-table-column>
            <el-table-column label="浮物累计" header-align="center">
              <el-table-column prop="fwljcl" label="产率(%)" header-align="center" align="center">
                <template #default="scope">
                  <el-input-number v-model="scope.row.fwljcl"
                                   size="mini"
                                   style="width: 80px;"
                                   placeholder="产率(%)"
                                   :precision="2"
                                   :controls="false"
                                   :min="0"
                                   :max="100"/>
                </template>
              </el-table-column>
              <el-table-column prop="fwljhf" label="灰分(%)" header-align="center" align="center">
                <template #default="scope">
                  <el-input-number v-model="scope.row.fwljhf"
                                   size="mini"
                                   style="width: 80px;"
                                   placeholder="灰分(%)"
                                   :precision="2"
                                   :controls="false"
                                   :min="0"
                                   :max="100"/>
                </template>
              </el-table-column>
            </el-table-column>
            <el-table-column label="沉物累计" header-align="center">
              <el-table-column prop="cwljcl" label="产率(%)" header-align="center" align="center">
                <template #default="scope">
                  <el-input-number v-model="scope.row.cwljcl"
                                   size="mini"
                                   style="width: 80px;"
                                   placeholder="产率(%)"
                                   :precision="2"
                                   :controls="false"
                                   :min="0"
                                   :max="100"/>
                </template>
              </el-table-column>
              <el-table-column prop="cwljhf" label="灰分(%)" header-align="center" align="center">
                <template #default="scope">
                  <el-input-number v-model="scope.row.cwljhf"
                                   size="mini"
                                   style="width: 80px;"
                                   placeholder="灰分(%)"
                                   :precision="2"
                                   :controls="false"
                                   :min="0"
                                   :max="100"/>
                </template>
              </el-table-column>
            </el-table-column>
          </el-table>
        </el-form>
      </el-tab-pane>
    </el-tabs>
    <template #footer>
      <el-button size="mini" :disabled="formLoading" type="primary" @click="formDataSubmitHandle()">确定</el-button>
      <el-button size="mini" @click="dialogVisible = false">取消</el-button>
    </template>
  </Dialog>
</template>

<script lang="ts" setup>
  import * as AnalysisApi from '@/api/xmcpms/coal-quality/analysis/full/index'

  defineOptions({name: 'FullForm'})

  const {t} = useI18n() // 国际化
  const message = useMessage() // 消息弹窗
  const dialogVisible = ref(false) // 弹窗的是否展示
  const dialogTitle = ref('') // 弹窗的标题
  const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
  const formType = ref('') // 表单的类型：create - 新增；update - 修改
  const formData = ref({
      id: '',
      code: '',
      ny: '',
      type: '',
      mz: '',
      syyp: '',
      fcfa: '',
      syrq: '',
      sybz: '',
      syfzr: '',
      hyy: '',
      myzz: '',
      myzh: '',
      myzl: '',
      bz: '',
      detList: []
    })

  const open = async (type: string, id?: string) => {
    dialogVisible.value = true
    dialogTitle.value = t('action.' + type)
    //修改时，设置数据
    if (id) {
      formLoading.value = true
      try {
        formData.value = await AnalysisApi.getAnalysis(id)
      } finally {
        formLoading.value = false
      }
    }
  }
  defineExpose({ open }) // 提供 open 方法，用于打开弹窗


</script>