wente
2024-01-12 c21bf35f523ee1430fc5fa02ab1b4171492009b6
web/src/views/modules/riskTraceRecord/RiskTraceItem-AddOrUpdate.vue
@@ -1,32 +1,325 @@
<template>
  <zt-dialog ref="dialog"  @confirm="formSubmit">
    <el-form :model="dataForm" ref="dataForm" :disabled="dataForm.disabled" label-width="120px">
      <zt-form-item label="排序" prop="sort" rules="required">
                        <el-input v-model="dataForm.sort"></el-input>
                </zt-form-item>
      <zt-form-item label="风险名称" prop="riskName" rules="required">
                        <el-input v-model="dataForm.riskName"></el-input>
                </zt-form-item>
      <zt-form-item label="风险描述" prop="riskDesc" rules="required">
                        <el-input v-model="dataForm.riskDesc"></el-input>
                </zt-form-item>
      <zt-form-item label="风险等级" prop="riskLevel" rules="required">
                        <el-input v-model="dataForm.riskLevel"></el-input>
                </zt-form-item>
    <el-form :model="dataForm" ref="dataForm" :disabled="dataForm.disabled" label-width="0px">
      <div style="border: 1px solid rgba(0,0,0,.2);width: 100%">
        <el-table  :data="dataForm.riskList" border>
          <el-table-column width="60px" label="风险名称" prop="riskName"></el-table-column>
          <el-table-column label="风险">
            <el-table-column label="风险描述" prop="riskDesc"></el-table-column>
            <el-table-column  width="60px" label="风险等级" prop="riskLevel"></el-table-column>
          </el-table-column>
          <el-table-column label="风险跟踪记录(发生概率)">
            <el-table-column label="测试需求分析与策划" prop="testRequire">
              <template v-slot="{ row }">
                <el-input v-model="row.testRequire" placeholder="测试需求分析与策划"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="测试设计" prop="testDesign">
              <template v-slot="{ row }">
                <el-input v-model="row.testDesign" placeholder="测试设计"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="测试执行" prop="testExecute">
              <template v-slot="{ row }">
                <el-input v-model="row.testExecute" placeholder="测试执行"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="测试总结" prop="testSummary">
              <template v-slot="{ row }">
                <el-input v-model="row.testSummary" placeholder="测试总结"></el-input>
              </template>
            </el-table-column>
          </el-table-column>
        </el-table>
          <div class="el-risk-flex el-border-top-bottom ">
            <div class="riskWidth riskAlign riskHold" style="width: 35%">
              风险跟踪人员/日期:
            </div>
            <div  class=" el-border-left" style="width: 20%">
              <el-form-item class="form-margin-top-bottom">
                <el-input v-model="dataForm.riskMeasure.requireRiskTrackers" class="risk-form-padding"></el-input>
              </el-form-item>
              <el-form-item class="form-margin-top-bottom">
                <el-date-picker
                  class="risk-form-padding"
                  v-model="dataForm.riskMeasure.requireRiskDate"
                  type="date"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </div>
            <div  class=" el-border-left" style="width: 20%">
              <el-form-item class="form-margin-top-bottom">
                <el-input v-model="dataForm.riskMeasure.designRiskTrackers" class="risk-form-padding"></el-input>
              </el-form-item>
              <el-form-item class="form-margin-top-bottom">
                <el-date-picker
                  class="risk-form-padding"
                  v-model="dataForm.riskMeasure.designRiskDate"
                  type="date"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </div>
            <div class=" el-border-left" style="width: 20%">
              <el-form-item class="form-margin-top-bottom">
                <el-input v-model="dataForm.riskMeasure.executeRiskTrackers" class="risk-form-padding"></el-input>
              </el-form-item>
              <el-form-item class="form-margin-top-bottom">
                <el-date-picker
                  class="risk-form-padding"
                  v-model="dataForm.riskMeasure.executeRiskDate"
                  type="date"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </div>
            <div class=" el-border-left" style="width: 20%">
              <el-form-item class="form-margin-top-bottom">
                <el-input v-model="dataForm.riskMeasure.summaryRiskTrackers" class="risk-form-padding"></el-input>
              </el-form-item>
              <el-form-item class="form-margin-top-bottom">
                <el-date-picker
                  class="risk-form-padding"
                  v-model="dataForm.riskMeasure.summaryRiskDate"
                  type="date"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </div>
          </div>
          <div class="el-risk-flex el-border-bottom " >
            <div class="riskAlign riskHold" style="width: 10%">
              风险措施控制
            </div>
            <div class="el-border-left" style="width: 90%">
              <div class="el-risk-flex el-border-bottom ">
                <div  class="riskAlign riskHold" style="width: 26%">
                  采取措施:
                </div>
                <el-form-item class="form-margin-top-bottom el-border-left" style="width:22.25%" >
                  <el-input v-model="dataForm.riskMeasure.requireMeasure" class="risk-form-padding"></el-input>
                </el-form-item>
                <el-form-item class="form-margin-top-bottom el-border-left" style="width:22.25%">
                  <el-input v-model="dataForm.riskMeasure.designMeasure" class="risk-form-padding"></el-input>
                </el-form-item>
                <el-form-item class="form-margin-top-bottom el-border-left" style="width:22.25%">
                  <el-input v-model="dataForm.riskMeasure.executeMeasure" class="risk-form-padding"></el-input>
                </el-form-item>
                <el-form-item class="form-margin-top-bottom el-border-left" style="width:22.25%">
                  <el-input v-model="dataForm.riskMeasure.summaryMeasure" class="risk-form-padding"></el-input>
                </el-form-item>
              </div>
              <div class="el-risk-flex el-border-bottom ">
                <div  class="riskAlign riskHold" style="width: 26%">
                  记录人员/日期:
                </div>
                <div class=" el-border-left" style="width:22.25%">
                  <el-form-item class="form-margin-top-bottom">
                    <el-input v-model="dataForm.riskMeasure.requireRecorder" class="risk-form-padding"></el-input>
                  </el-form-item>
                  <el-form-item class="form-margin-top-bottom">
                    <el-date-picker
                      class="risk-form-padding"
                      v-model="dataForm.riskMeasure.requireRecordDate"
                      type="date"
                      placeholder="选择日期">
                    </el-date-picker>
                  </el-form-item>
                </div>
                <div class=" el-border-left" style="width:22.25%">
                  <el-form-item class="form-margin-top-bottom">
                    <el-input v-model="dataForm.riskMeasure.designRecorder" class="risk-form-padding"></el-input>
                  </el-form-item>
                  <el-form-item class="form-margin-top-bottom">
                    <el-date-picker
                      class="risk-form-padding"
                      v-model="dataForm.riskMeasure.designRecordDate"
                      type="date"
                      placeholder="选择日期">
                    </el-date-picker>
                  </el-form-item>
                </div>
                <div class=" el-border-left" style="width:22.25%">
                  <el-form-item class="form-margin-top-bottom">
                    <el-input v-model="dataForm.riskMeasure.executeRecorder" class="risk-form-padding"></el-input>
                  </el-form-item>
                  <el-form-item class="form-margin-top-bottom">
                    <el-date-picker
                      class="risk-form-padding"
                      v-model="dataForm.riskMeasure.executeRecordDate"
                      type="date"
                      placeholder="选择日期">
                    </el-date-picker>
                  </el-form-item>
                </div>
                <div class=" el-border-left" style="width:22.25%">
                  <el-form-item class="form-margin-top-bottom">
                    <el-input v-model="dataForm.riskMeasure.summaryRecorder" class="risk-form-padding"></el-input>
                  </el-form-item>
                  <el-form-item class="form-margin-top-bottom">
                    <el-date-picker
                      class="risk-form-padding"
                      v-model="dataForm.riskMeasure.summaryRecordDate"
                      type="date"
                      placeholder="选择日期">
                    </el-date-picker>
                  </el-form-item>
                </div>
              </div>
              <div class="el-risk-flex el-border-bottom ">
                <div  class="riskAlign riskHold" style="width: 26%">
                  措施有效性评估:
                </div>
                <el-form-item class="form-margin-top-bottom el-border-left" style="width:22.25%">
                  <el-input v-model="dataForm.riskMeasure.requireEvaluate" class="risk-form-padding"></el-input>
                </el-form-item>
                <el-form-item class="form-margin-top-bottom el-border-left" style="width:22.25%">
                  <el-input v-model="dataForm.riskMeasure.designEvaluate" class="risk-form-padding"></el-input>
                </el-form-item>
                <el-form-item class="form-margin-top-bottom el-border-left" style="width:22.25%">
                  <el-input v-model="dataForm.riskMeasure.executeEvaluate" class="risk-form-padding"></el-input>
                </el-form-item>
                <el-form-item class="form-margin-top-bottom el-border-left" style="width:22.25%">
                  <el-input v-model="dataForm.riskMeasure.summaryEvaluate" class="risk-form-padding"></el-input>
                </el-form-item>
              </div>
              <div class="el-risk-flex ">
                <div  class="riskAlign riskHold" style="width:26%">
                  部门负责人/日期:
                </div>
                <div class=" el-border-left" style="width:22.25%">
                  <el-form-item class="form-margin-top-bottom">
                    <el-input v-model="dataForm.riskMeasure.requireLeader" class="risk-form-padding"></el-input>
                  </el-form-item>
                  <el-form-item class="form-margin-top-bottom">
                    <el-date-picker
                      class="risk-form-padding"
                      v-model="dataForm.riskMeasure.requireLeadDate"
                      type="date"
                      placeholder="选择日期">
                    </el-date-picker>
                  </el-form-item>
                </div>
                <div class=" el-border-left" style="width:22.25%">
                  <el-form-item class="form-margin-top-bottom">
                    <el-input v-model="dataForm.riskMeasure.designLeader" class="risk-form-padding"></el-input>
                  </el-form-item>
                  <el-form-item class="form-margin-top-bottom">
                    <el-date-picker
                      class="risk-form-padding"
                      v-model="dataForm.riskMeasure.designLeadDate"
                      type="date"
                      placeholder="选择日期">
                    </el-date-picker>
                  </el-form-item>
                </div>
                <div class=" el-border-left" style="width:22.25%">
                  <el-form-item class="form-margin-top-bottom">
                    <el-input v-model="dataForm.riskMeasure.executeLeader" class="risk-form-padding"></el-input>
                  </el-form-item>
                  <el-form-item class="form-margin-top-bottom">
                    <el-date-picker
                      class="risk-form-padding"
                      v-model="dataForm.riskMeasure.executeLeadDate"
                      type="date"
                      placeholder="选择日期">
                    </el-date-picker>
                  </el-form-item>
                </div>
                <div class=" el-border-left" style="width:22.25%">
                  <el-form-item class="form-margin-top-bottom">
                    <el-input v-model="dataForm.riskMeasure.summaryLeader" class="risk-form-padding"></el-input>
                  </el-form-item>
                  <el-form-item class="form-margin-top-bottom">
                    <el-date-picker
                      class="risk-form-padding"
                      v-model="dataForm.riskMeasure.summaryLeadDate"
                      type="date"
                      placeholder="选择日期">
                    </el-date-picker>
                  </el-form-item>
                </div>
              </div>
            </div>
          </div>
        <div class="el-risk-flex">
          <div class="riskAlign riskHold" style="width: 10%">
            备注
          </div>
          <div class="el-border-left" style="width:90%">
            <div style="padding: 3px">
              <el-form-item>
               风险等级分为:严重、一般、轻微。风险发生概率为:高、中、低。风险发生概率为高时应采取措施,降低风险发生概率。风险发生时应采取补救措施。
              </el-form-item>
            </div>
          </div>
        </div>
      </div>
  <!--    <div class="el-flex risk-sc" style="height: 60px">
        <el-form-item class="marginTopAndMarginBottom" style="width: 100%">
          <config-uploader :lineHeight="true" busi-type="risk_trace_item" model-name="dataForm" :dataForm="dataForm"
                           v-model="dataForm.files"/>
        </el-form-item>
      </div>-->
    </el-form>
    <template v-slot:footer>
      <el-button v-if="dataForm.disabled" type="primary" @click="print()">打印</el-button>
    </template>
  </zt-dialog>
</template>
<script>
  import qs from "qs";
  import Cookies from "js-cookie";
  export default {
    data() {
      return {
        dataForm: {
          disabled:'false',
          id: '',
          sort: '',
          riskName: '',
          riskDesc: '',
          riskLevel: ''
          riskMeasure:{
            requireRiskTrackers:'',
            requireRiskDate:'',
            designRiskTrackers:'',
            designRiskDate:'',
            executeRiskTrackers:'',
            executeRiskDate:'',
            summaryRiskTrackers:'',
            summaryRiskDate:'',
            requireMeasure:'',
            designMeasure:'',
            executeMeasure:'',
            summaryMeasure:'',
            requireRecorder:'',
            requireRecordDate:'',
            designRecorder:'',
            designRecordDate:'',
            executeRecorder:'',
            executeRecordDate:'',
            summaryRecorder:'',
            summaryRecordDate:'',
            requireEvaluate:'',
            designEvaluate:'',
            executeEvaluate:'',
            summaryEvaluate:'',
            requireLeader:'',
            requireLeadDate:'',
            designLeader:'',
            designLeadDate:'',
            executeLeader:'',
            executeLeadDate:'',
            summaryLeader:'',
            summaryLeadDate:''
          },
          project: {
            softwareIdentity: '',
            softwareName: ''
          },
          riskList:[],
          itemList:[]
        }
      }
    },
@@ -49,14 +342,23 @@
          riskId: this.dataForm.id,
          projectId: this.dataForm.projectId
        }
        let res = await this.$http.get(`/riskTraceRecord/RiskTraceItem/`,{params:params})
        let res = await this.$http.get(`/riskTraceRecord/RiskTraceItem/getDto`,{params:params})
        this.dataForm = {
          ...this.dataForm,
          ...res.data
        }
      },
      async print() {
        var params = qs.stringify({
          token: Cookies.get('token'),
          id: this.dataForm.id
        })
        let apiURL = `/riskTraceRecord/RiskTraceItem/exportRiskRecord`
        window.location.href = `${window.SITE_CONFIG['apiURL']}${apiURL}?${params}`
      },
      // 表单提交
      async formSubmit() {
        console.log(this.dataForm,"formSubmit")
        let res = await this.$http[!this.dataForm.id ? 'post' : 'put']('/riskTraceRecord/RiskTraceItem/', this.dataForm)
        if (res.success) {
          await this.$tip.success()
@@ -67,3 +369,38 @@
    }
  }
</script>
<style>
.el-risk-flex {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.direction{
  flex-direction:column;
}
/*.riskWidth{
  width: 755px;
}*/
.riskAlign{
  text-align: center;
}
.riskHold{
  font-weight: 600;
}
.el-border-top-bottom{
  border-top:1px solid rgba(0,0,0,.2);
  border-bottom: 1px solid rgba(0,0,0,.2);
}
.risk-form-padding{
  padding: 3px;
}
 .form-margin-top-bottom {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.risk-sc > .el-form-item > .el-form-item__content {
  width: 100%;
}
</style>