SetNoticeUser.vue 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. /**
  2. @author:fugy
  3. @date:2018.11.27
  4. @info:设定通知人员
  5. **/
  6. <template>
  7. <el-dialog title="设定通知人员" :visible.sync="dialogVisible" width="50%" center>
  8. <div class="box" v-if="userData.length">
  9. <ul class="ul-box">
  10. <li class="tit">
  11. <p>人员姓名及通知方式</p>
  12. </li>
  13. <li v-for="(item, index) in userData" :key="index">
  14. <p>
  15. <span class="name">{{item.name}}</span>
  16. <span class="name">{{item.phone}}</span>
  17. <span class="name">{{item.email}}</span>
  18. </p>
  19. <span>
  20. <v-check-box :sendMessage='item.sendMessage' :sendEmail='item.sendEmail' :sendWechat='item.sendWechat' :define="index" @change="checkBoxChange"></v-check-box>
  21. </span>
  22. </li>
  23. </ul>
  24. </div>
  25. <div v-else style="text-align:center;">暂无人员</div>
  26. <p>
  27. <el-button type="text" icon="el-icon-setting" @click="manageUser">管理通知人员</el-button>
  28. </p>
  29. <span slot="footer" class="dialog-footer">
  30. <el-button size="middle" type="primary" @click="save">保 存</el-button>
  31. <el-button size="middle" @click="dialogVisible = false">取 消</el-button>
  32. </span>
  33. </el-dialog>
  34. </template>
  35. <script>
  36. import api from "./api";
  37. import vCheckBox from "@/components/alarm/common/CheckBox";
  38. import utils from "./utils";
  39. export default {
  40. name: "set-notice-user",
  41. data() {
  42. return {
  43. dialogVisible: false,
  44. userData: []
  45. }
  46. },
  47. props: ["setDialogVisible", "setUserData", "alarmIdArr", "params"],
  48. components: {
  49. vCheckBox,
  50. // vCheckBox1
  51. },
  52. methods: {
  53. async getUserData() {
  54. this.userData = []
  55. let params = {
  56. criteria: {
  57. projectId: this.params.projectId
  58. }
  59. }
  60. let res = await api.getUserList(params);
  61. if (res.result && res.count) {
  62. this.handleData(res.content)
  63. }
  64. },
  65. handleData(res) {
  66. res.forEach(item => {
  67. this.setUserData.forEach(ele => {
  68. if(item.id == ele.id) {
  69. item.sendMessage = ele.sendMessage;
  70. item.sendEmail = ele.sendEmail;
  71. item.sendWechat = ele.sendWechat;
  72. }
  73. })
  74. });
  75. this.userData = res;
  76. },
  77. // 管理通知人员
  78. manageUser() {
  79. this.dialogVisible = false;
  80. this.$emit("to-manage");
  81. },
  82. checkBoxChange(obj, index) {
  83. this.userData[index].sendMessage = obj.sendMessage;
  84. this.userData[index].sendEmail = obj.sendEmail;
  85. this.userData[index].sendWechat = obj.sendWechat;
  86. },
  87. async save() {
  88. let notifyUserList = await utils.setNoticeUserData(this.userData);
  89. let alarmConfigResultIdList = this.alarmIdArr;;
  90. let params = {
  91. projectId: this.params.projectId,
  92. alarmConfigResultIdList: alarmConfigResultIdList,
  93. notifyUserList: notifyUserList
  94. };
  95. let res = await api.setNoticeUser(params);
  96. if(res.result == "success") {
  97. this.$emit("refresh")
  98. this.$message({
  99. type: 'success',
  100. message: '保存成功'
  101. });
  102. this.dialogVisible = false;
  103. }
  104. },
  105. refresh() {
  106. this.$emit("refresh")
  107. }
  108. },
  109. watch: {
  110. setDialogVisible() {
  111. this.dialogVisible = true;
  112. this.getUserData();
  113. }
  114. }
  115. }
  116. </script>
  117. <style lang="less" scoped>
  118. .box {
  119. font-size: 16px;
  120. .ul-box {
  121. border: 1px solid #ebeef5;
  122. border-bottom: none;
  123. li {
  124. padding: 10px;
  125. display: flex;
  126. justify-content: space-between;
  127. border-bottom: 1px solid #ebeef5;
  128. p {
  129. display: flex;
  130. .name {
  131. width: 150px;
  132. }
  133. }
  134. }
  135. .tit {
  136. justify-content: center;
  137. }
  138. }
  139. }
  140. </style>