hxgksystemapp/.history/src/views/knowledge/exam/detail_20230830132640.vue

<!--
@ 作者: 鲁智强
@ 时间: 2023-08-15 11:34:38
@ 备注: 
-->
<template>
	<el-dialog :model-value="true" :title="title" @close="handleClose">
		<el-form
      ref="ruleFormRef"
      :model="formData"
      label-width="120px"
      class="demo-ruleForm"
    >
	<el-form-item label="考试题目" prop="name">
	 <el-input v-model="formData.name" placeholder="请输入题目"></el-input>
	</el-form-item>
	<el-form-item label="起止时间" prop="num">
     <el-input v-model="formData.num" placeholder="~"></el-input>
	</el-form-item> 
	<el-form-item label="考题总数" prop="abc">
		<el-input v-model="formData.abc" placeholder="请输入考题总数"></el-input>
	</el-form-item>
	<el-form-item label="考题总分" prop="abd">
		<el-input v-model="formData.abd" placeholder="100"></el-input>
	</el-form-item>
	<el-form-item label="及格分数线" prop="abe">
        <el-input v-model="formData.abe" placeholder="请输入考试及格分数线"></el-input>
	</el-form-item>
	<el-form-item label="考题时长" prop="abf">
		<el-input v-model="formData.abf" placeholder="请输入考试时长" style="width:300px"></el-input>
	</el-form-item>
	<el-form-item label="公共占比" prop="abf">
		<el-input v-model="formData.abf" placeholder="请输入公共考题所占比例" style="width:300px"></el-input>
	</el-form-item>
	<el-form-item label="考试范围" prop="abg">
		<el-select v-model="formData.abg" placeholder="归属" style="width:120px"></el-select>
		<el-select v-model="formData.abh" placeholder="请选择分厂" style="width:120px"></el-select>
		<el-select v-model="formData.abi" placeholder="请选择工段" style="width:120px"></el-select>
		<el-select v-model="formData.abj" placeholder="请选择职务" style="width:120px"></el-select>
	</el-form-item>
	<el-form-item label="补考次数" prop="abk">
		<el-input v-model="formData.abk" placeholder="" style="width:200px"></el-input>
	</el-form-item>
	<el-form-item>
		<el-button type=></el-button>
	</el-form-item>
	</el-form>
	</el-dialog>
  </template>
  <script lang="ts">
  import { reactive } from "vue";
  interface FormInfo {
	id: string;
	age: string;
	name: string;
	sex: string;
	ccc: string;
	ade: string;
  }
  export default {
	  components: {
	},
	props: {
	  title: {
		type: String,
		default: "",
	  },
	  dialogShow: {
		type: Boolean,
		default: false,
	  },
	  rowInfo: {
		type: Object as () => FormInfo,
		default() {
		  return {};
		},
	  },
	  arrayNum: {
		type: Number,
		default: 0,
	  },
	},
emits: ['image-uploaded', 'editRow', 'addRow', 'update:detailShow'],
	setup(props, { emit }) {
		const data = reactive({
           formData:{
			    id:"",
                name:"",
				num:"",
				abc:"",
				abd:"",
				abe:"",
				abf:"",
				abg:"",
				abh:"",
				abi:"",
				abj:"",
				abk:"",
		   }
		});
	  const method = reactive({
		// 关闭弹窗
		handleClose() {
		  emit("update:detailShow", false);
		},
		submitForm() {
        method.handleClose();
        if (props.rowInfo.name) {
          // 修改
          const id = props.rowInfo;
          emit("editRow", data.formData);
        } else {
          // 新增
          data.formData["id"] = (props.arrayNum + 1).toString();
          emit("addRow", data.formData);
        }
	},
	});
	  return {
		...toRefs(data),
		...method,
	  };
	},
  };
  </script>
  
  <style scoped>
  
  
  .avatar-uploader .avatar {
	display: block;
	width: 178px;
	height: 178px;
  }
  </style>
  
  <style lang="scss">
  .avatar-uploader .el-upload {
	position: relative;
	overflow: hidden;
	cursor: pointer;
	border: 1px dashed var(--el-border-color);
	border-radius: 6px;
	transition: var(--el-transition-duration-fast);
  }
  
  .avatar-uploader .el-upload:hover {
	border-color: var(--el-color-primary);
  }
  
  .el-icon.avatar-uploader-icon {
	width: 178px;
	height: 178px;
	font-size: 28px;
	color: #8c939d;
	text-align: center;
  }
  .el-dialog{
	  width:1200px;
  }
  </style>