Arbitrate-Frontend/src/views/caseManagement/components/courtReviewDialog.vue

<template>
  <div>
    <!-- 组庭确认页面 -->
    <el-dialog
      title="组庭确认"
      :visible="showcourtReview"
      @close="cancel"
      :destroy-on-close="true"
      center
    >
      <el-form ref="courtReviewform" :model="courtReviewform">
        <el-form-item
          label="开庭日期："
          prop="hearDate"
          :rules="[
            {
              required: true,
              message: '请选择开庭日期',
              trigger: 'blur',
            },
          ]"
        >
          <div class="reviewbox">
            <el-date-picker
              v-model="courtReviewform.hearDate"
              type="datetime"
              placeholder="选择日期"
            >
            </el-date-picker>
          </div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" class="endbutton"
          ><span>确 定</span>
        </el-button>
        <el-button @click="cancel" class="endbutton1"
          ><span> 取 消</span></el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { pendTralSure } from "@/api/caseManagement/caseManagement.js";
import moment from "moment";
export default {
  name: "courtReviewDialog",
  props: ["showcourtReview", "form", "queryParams"],
  data() {
    return {
      hearDate: "",
      courtReviewform: {},
    };
  },
  methods: {
    submitForm() {
      this.$refs["courtReviewform"].validate((valid) => {
        if (valid) {
          this.courtReviewform.hearDate = moment(
            this.courtReviewform.hearDate
          ).format("YYYY-MM-DD HH:mm:ss");
          pendTralSure({
            id: this.form.id,
            hearDate: this.courtReviewform.hearDate,
          })
            .then((res) => {
              this.$modal.msgSuccess("确认成功");
              this.cancel();
              this.$emit("getcaseApply",this.queryParams);
            })
            .catch((err) => {});
        }
      });
    },
    cancel() {
      this.$emit("cancelcourtReview");
    },
  },
};
</script>

<style lang="scss" scoped>
::v-deep .el-dialog {
  width: 422px;
  height: 245px;
  background: #ffffff;
  border-radius: 20px;
}
.el-form-item {
  margin-left: 10%;
}
.endbutton {
  width: 124px;
  height: 37px;
  background: #0072ff;
  border-radius: 19px;
  span {
    width: 32px;
    height: 15px;
    font-size: 16px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color: #ffffff;
    // line-height: 48px;
  }
}
.endbutton1 {
  width: 124px;
  height: 37px;
  background: #ffffff;
  border: 1px solid #d0d0d0;
  border-radius: 19px;
  span {
    width: 31px;
    height: 13px;
    font-size: 16px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color: #959595;
    // line-height: 48px;
  }
}
::v-deep .el-form-item__error {
  left: 90px;
}
</style>