rename.vue 2.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. <template>
  2. <el-dialog title="重命名" :visible.sync="dialogVisible" width="480px" :close-on-click-modal="false" custom-class="renameDialog">
  3. <div>
  4. <el-input v-model="input" placeholder="请输入名称" size="small"></el-input>
  5. </div>
  6. <span slot="footer" class="dialog-footer">
  7. <el-button @click="dialogVisible = false">取 消</el-button>
  8. <el-button type="primary" @click="confirm">确 定</el-button>
  9. </span>
  10. </el-dialog>
  11. </template>
  12. <script>
  13. import { updateDraftsGraph, updatePubGraph } from "@/api/home";
  14. import { planerUpdate, pubPlanerUpdate } from "@/api/labsl";
  15. export default {
  16. props: {
  17. isPub: {
  18. type: Number,
  19. default: 0,
  20. },
  21. },
  22. data() {
  23. return {
  24. dialogVisible: false,
  25. input: "",
  26. data: {},
  27. };
  28. },
  29. methods: {
  30. showDialog(data) {
  31. console.table(data);
  32. this.dialogVisible = true;
  33. this.input = data.name;
  34. this.data = data;
  35. },
  36. // 确认修改
  37. async confirm() {
  38. const newName = this.input.trim();
  39. if (!newName) {
  40. return;
  41. }
  42. const postParams = {
  43. content: [
  44. {
  45. id: this.data.id,
  46. graphId: this.data.graphId,
  47. name: newName,
  48. },
  49. ],
  50. projection: ["name"],
  51. };
  52. let res;
  53. if (this.isPub) {
  54. // 已发布
  55. res = await pubPlanerUpdate(postParams);
  56. } else {
  57. // 未发布
  58. res = await planerUpdate(postParams);
  59. }
  60. if (res.result == "success") {
  61. this.dialogVisible = false;
  62. this.$message.success("更新成功");
  63. this.$emit("updateSuc");
  64. } else {
  65. this.$message(res.message);
  66. }
  67. },
  68. },
  69. };
  70. </script>
  71. <style lang="less">
  72. .renameDialog {
  73. /deep/ .el-dialog__header {
  74. border-bottom: 1px solid #f0f1f2ff;
  75. }
  76. /deep/ .el-dialog__body {
  77. padding: 16px 60px;
  78. }
  79. .el-dialog__footer {
  80. padding: 14px 20px 20px;
  81. .el-button {
  82. padding: 0;
  83. width: 80px;
  84. height: 32px;
  85. text-align: center;
  86. line-height: 1;
  87. }
  88. }
  89. }
  90. </style>