模板页面添加信息提示弹窗逻辑

zkqy-ui/src/views/tablelist/commonTable/listInfo.vue

@@ -333,6 +333,20 @@
         <el-button type="primary" @click="confirmPrint">打 印</el-button>
       </span>
     </el-dialog>
+
+    <!-- 消息提示弹窗 -->
+    <el-dialog title="提示" :visible.sync="toastShow" width="30%">
+      <span>
+        <i :class="`el-icon-info ${toastType}`"></i>
+        {{ toastMsg || "暂无提示信息" }}
+      </span>
+      <template #footer>
+        <span>
+          <el-button type="primary" @click="toastShow = false">确认</el-button>
+        </span>
+      </template>
+    </el-dialog>
+
     <div id="printDom"></div>
   </div>
 </template>
@@ -366,6 +380,10 @@ export default {
   components: { Queryfrom, Menu, DialogTemplate, FormList, BtnMenuList },
   data() {
     return {
+      // 提示信息 start
+      toastMsg: "",
+      toastShow: false,
+      // 提示信息 end
       // 顶部按钮数据
       topBtnArr: [], //顶部按钮数据
       selection: [], //选中数组
@@ -2015,10 +2033,21 @@ export default {
         case "PRINT":
           this.printHandler(btnData, row);
           break;
+        case "TOAST":
+          this.showToast(btnData, row);
+          break;
         default:
           break;
       }
     },
+    // 消息提示回调
+    showToast(btnData, row) {
+      console.log(btnData, row);
+      let { btnFormKey, btnFormType } = btnData;
+      this.toastMsg = btnFormKey;
+      this.toastType = btnFormType;
+      this.toastShow = true;
+    },
     // 顶部按钮回调
     topBtnHandler(btnData) {
       console.log(btnData);
@@ -2164,4 +2193,16 @@ export default {
 ::v-deep .el-dialog:not(.is-fullscreen) {
   min-width: 610px !important;
 }
+.success {
+  color: #67c23a;
+}
+.error {
+  color: #f56c6c;
+}
+.warning {
+  color: #e6a23c;
+}
+.info {
+  color: #909399;
+}
 </style>