copyMould.vue 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. <script setup lang="ts">
  2. import { ref, reactive } from "vue";
  3. import { ElMessageBox, ElMessage } from "element-plus";
  4. const dialogVisibleAdd = ref(false);
  5. const copyTitle = ref("");
  6. const copyMould = () => {
  7. return "复制来源:" + copyTitle.value;
  8. };
  9. const form = reactive({
  10. name: "",
  11. region: "",
  12. date1: "",
  13. date2: "",
  14. delivery: false,
  15. type: [],
  16. resource: "",
  17. desc: ""
  18. });
  19. const handleClose = () => {
  20. ElMessageBox.confirm("确认关闭弹窗吗?")
  21. .then(() => {
  22. dialogVisibleAdd.value = !dialogVisibleAdd.value;
  23. ElMessage({
  24. message: "已关闭"
  25. });
  26. })
  27. .catch(() => {
  28. // catch error
  29. });
  30. };
  31. // 添加部门保存
  32. const saveDepartment = () => {
  33. dialogVisibleAdd.value = false;
  34. ElMessage({
  35. message: "添加成功",
  36. type: "success"
  37. });
  38. };
  39. const open = (item: any) => {
  40. copyTitle.value = item.name;
  41. dialogVisibleAdd.value = true;
  42. };
  43. defineExpose({
  44. open
  45. });
  46. </script>
  47. <template>
  48. <div>
  49. <el-dialog
  50. v-model="dialogVisibleAdd"
  51. :title="copyMould()"
  52. width="500"
  53. :before-close="handleClose"
  54. >
  55. <el-form :model="form" label-width="auto" style="max-width: 600px">
  56. <el-form-item label="名称">
  57. <el-select
  58. v-model="form.region"
  59. placeholder="please select your zone"
  60. >
  61. <el-option label="Zone one" value="shanghai" />
  62. <el-option label="Zone two" value="beijing" />
  63. </el-select>
  64. </el-form-item>
  65. </el-form>
  66. <template #footer>
  67. <div class="dialog-footer">
  68. <el-button @click="handleClose">取消</el-button>
  69. <el-button type="primary" @click="saveDepartment"> 确认 </el-button>
  70. </div>
  71. </template>
  72. </el-dialog>
  73. </div>
  74. </template>