软件工程日报41

今天继续进行团队项目台账模块的开发

今天的任务主要是实现对采购任务的审核，以及财务人员的接收与交付

主要是对审核等弹窗的设计，也还有查看详情的回显与数据结构的设计

    <el-dialog title="采购单信息" :visible.sync="dialogVisible" width="53%" :before-close="handleClose" class="order-dialog">
      <el-scrollbar style="height: 100%">
        <div class="order-top">
          <div>
            <div style="display: inline-block">
              <label style="font-size: 16px">采购ID：</label>
              <div class="order-num">
                {{ diaForm.purchaseId }}
              </div>
            </div>
            <div style="display: inline-block" class="order-status" :class="{ status3: true }">
              {{
                purchaseList.filter((item) => item.value === dialogPurchaseStatus)[0]
                  .label
              }}
            </div>
          </div>
          <p><label>创建时间：</label>{{ diaForm.createTime }}</p>
        </div>

        <div class="order-middle">
          <div class="dish-label">采购单基本信息</div>
          <div class="user-info">
            <div class="user-info-box">
              <div class="user-name">
                <label>创建人：</label>
                <span>{{ diaForm.createBy }}</span>
              </div>

              <div class="user-name">
                <label>更新人：</label>
                <span>{{ diaForm.updateBy }}</span>
              </div>
              <div class="user-phone">
                <label>创建时间</label>
                <span>{{ diaForm.createTime }}</span>
              </div>
              <div v-if="[2, 3, 4, 5, 6].includes(dialogPurchaseStatus)">
                <div class="user-getTime">
                  <label>采购日期:</label>
                  <span>{{ diaForm.purchaseDate }}</span>
                </div>

                <div class="dish-all-amount">
                  <label>采购金额</label>
                  <span>￥{{ diaForm.purchaseAmount }}</span>
                </div>

                <div>
                  <label>采购数量:</label>
                  <span>{{ diaForm.quantity }}</span>
                </div>

                <div>
                  <label>采购单据编号:</label>
                  <span>{{ diaForm.purchaseDocumentNo }}</span>
                </div>

                <div>
                  <label>合同编号:</label>
                  <span>{{ diaForm.contractNo }}</span>
                </div>

                <div>
                  <label>采购负责人:</label>
                  <span>{{ diaForm.purchasePerson }}</span>
                </div>

                <div>
                  <label>采购设备图像:</label>
                  <img v-if="diaForm.image" :src="diaForm.image" alt="采购设备图像" style="width: 100px; height: 100px;">
                  <span v-else>无图像</span>
                </div>

                <div>
                  <label>交付日期:</label>
                  <span>{{ diaForm.deliveryDate }}</span>
                </div>

                <div>
                  <label>验收日期:</label>
                  <span>{{ diaForm.acceptanceDate }}</span>
                </div>

                <div>
                  <label>验收结果:</label>
                  <span>
                    {{ diaForm.acceptanceResult === 1 ? '合格' :
                      diaForm.acceptanceResult === 2 ? '不合格' :
                        diaForm.acceptanceResult === 3 ? '部分合格' : '未知' }}
                  </span>
                </div>


              </div>

              <!--  <div class="user-address">
                <label>地址：</label>
                <span>{{ diaForm.address }}</span>
              </div> -->
            </div>


            <div class="user-remark">
              <div>验收备注</div>
              <span>{{ diaForm.acceptanceNotes }}</span>
            </div>

          </div>

          <div class="dish-info">
            <div class="dish-label">采购设备信息</div>
            <div class="user-info-box">
              <div>
                <label>设备类型:</label>
                <span>
                  {{ diaForm.equipmentType === 1 ? '客服设备' :
                    diaForm.equipmentType === 2 ? '机电设备' :
                      diaForm.equipmentType === 3 ? '消防设备' :
                        diaForm.equipmentType === 4 ? '电梯设备' : '未知' }}
                </span>
              </div>

              <div>
                <label>设备名称:</label>
                <span>{{ diaForm.equipmentName }}</span>
              </div>

              <div>
                <label>型号:</label>
                <span>{{ diaForm.modelNumber }}</span>
              </div>

              <div>
                <label>规格参数:</label>
                <span>{{ diaForm.specification }}</span>
              </div>

              <div>
                <label>生产厂家:</label>
                <span>{{ diaForm.manufacturer }}</span>
              </div>

              <div>
                <label>供应商:</label>
                <span>{{ diaForm.supplier }}</span>
              </div>

              <div>
                <label>单位:</label>
                <span>{{ diaForm.unit }}</span>
              </div>

              <div>
                <label>保修期(月):</label>
                <span>{{ diaForm.warrantyPeriod }}</span>
              </div>

              <div>
                <label>预期使用寿命(月):</label>
                <span>{{ diaForm.expectedLife }}</span>
              </div>

            </div>

          </div>
        </div>

        <div class="order-bottom">
          <div class="amount-info">
            <div class="amount-label">备注消息信息</div>
            <!-- <div class="amount-list">
            </div> -->
            <div class="user-remark" :class="{ orderCancel: true }">
              <div>备注：</div>
              <span>{{ diaForm.remark }}</span>
            </div>
            <div v-if="[5].includes(dialogPurchaseStatus)" class="orderCancel">
              <div>取消原因：</div>
              <span>{{ diaForm.cancelReason }}</span>
            </div>
            <div v-if="[6].includes(dialogPurchaseStatus)" class="orderCancel">
              <div>审核拒绝原因：</div>
              <span>{{ diaForm.refuseReason }}</span>
            </div>
            <div v-if="diaForm.cancelReason" class="orderCancel">
              <div>催促通知:</div>
              <span>{{ diaForm.cancelReason }}</span>
            </div>

          </div>

        </div>
      </el-scrollbar>
      <span v-if="dialogPurchaseStatus !== 6" slot="footer" class="dialog-footer">
        <!--  <el-checkbox v-if="dialogPurchaseStatus === 2 && purchaseStatus === 2" v-model="isAutoNext">处理完自动跳转下一条</el-checkbox> -->
        <el-button v-if="dialogPurchaseStatus === 3" type="primary"
          @click="goToDeliver(row)/* , (isTableOperateBtn = false) */">去交付</el-button>
        <el-button v-if="dialogPurchaseStatus === 0" type="primary"
          @click="receivePurchase(row)/* , (isTableOperateBtn = false) */">接收采购任务</el-button>
          <el-button v-if="dialogPurchaseStatus === 1" type="primary"
          @click="goToDeliver(row)/* , (isTableOperateBtn = false) */">提交采购任务</el-button>


        <el-button v-if="true" @click="dialogVisible = false">返 回</el-button>
      </span>
    </el-dialog>
  </div>