案例1:

const handleDelete = (index, row) => {
  if (!isEmptyList(row.children)) {
    ElMessageBox.confirm('該分類下存在子分類，不可刪除！', '提示', {
      type: 'warning',
      confirmButtonText: '確認(rèn)'
    });
    return;
  }
  const id = row.groupId;
  selectResource(id).then(response => {
    if (!isEmptyList(response.data)) {
      ElMessageBox.confirm('該分類下已經(jīng)分配資源，確定要?jiǎng)h除嗎?', "警告", {
        confirmButtonText: "確定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function () {
        return deleteGroup(id);
      });
    } else {
      ElMessageBox.confirm('確認(rèn)刪除名稱為"' + row.groupName + '"的數(shù)據(jù)項(xiàng)?', "警告", {
        confirmButtonText: "確定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function () {
        return deleteGroup(id);
      });
    }
  });
};

這段代碼是一個(gè)函數(shù)，名為`handleDelete`，接受兩個(gè)參數(shù)：`index`和`row`。主要用于處理分類數(shù)據(jù)的刪除操作。

函數(shù)首先判斷該分類是否存在子分類，如果存在則不允許刪除，并通過`ElMessageBox`彈出提示框，提醒用戶不可刪除。

如果分類下沒有子分類，該函數(shù)會(huì)檢查該分類是否已經(jīng)分配了資源。如果已經(jīng)分配了資源，則通過`ElMessageBox`彈出確認(rèn)框，讓用戶確認(rèn)是否要?jiǎng)h除該分類及其下屬所有資源。如果用戶確認(rèn)，會(huì)執(zhí)行`deleteGroup`函數(shù)，將該分類從數(shù)據(jù)庫中刪除。

如果分類下沒有資源，則直接通過`ElMessageBox`彈出確認(rèn)框，讓用戶確認(rèn)是否要?jiǎng)h除該分類。如果用戶確認(rèn)，也會(huì)執(zhí)行`deleteGroup`函數(shù)，將該分類從數(shù)據(jù)庫中刪除。

總之，這段代碼主要完成了分類數(shù)據(jù)的刪除操作，需要依賴`ElMessageBox`組件和`deleteGroup`函數(shù)。

案例2：

const handleEdit = (index, row) => {
  resetForm();
  const id = row.groupId;
  selectResource(id).then(response => {
    if (!isEmptyList(response.data)) {
      ElMessageBox.confirm('該分類已經(jīng)分配資源，不可修改！', '提示', {
        type: 'warning',
        confirmButtonText: '確認(rèn)'
      });
      return;
    } else {
      dialogParam.type = row.type;
      caGroupTreeSelect(id);
      getCaGroupDetails(id).then(response => {
        caGroupForm.value = response.data;
        dialogParam.open = true;
        dialogParam.title = "修改分類";
      });
    }
  });
};

這段代碼定義了一個(gè)名為handleEdit的函數(shù),它有兩個(gè)參數(shù)：index和row。在函數(shù)內(nèi)部，resetForm()函數(shù)會(huì)重置一個(gè)表單。然后，使用row.groupId作為參數(shù)調(diào)用了一個(gè)名為selectResource的函數(shù)，該函數(shù)的返回值是一個(gè)Promise對(duì)象。在Promise對(duì)象的回調(diào)函數(shù)中，使用了一個(gè)名為isEmptyList的函數(shù)來檢查response.data是否是一個(gè)空列表。如果response.data不是一個(gè)空列表，那么會(huì)顯示一個(gè)帶有警告圖標(biāo)的提示框，告訴用戶該分類已經(jīng)分配資源，不可修改。如果response.data是一個(gè)空列表，則會(huì)將dialogParam.type設(shè)置為row.type，調(diào)用caGroupTreeSelect函數(shù)，并使用id作為參數(shù)調(diào)用getCaGroupDetails函數(shù)。getCaGroupDetails函數(shù)會(huì)返回一個(gè)Promise對(duì)象，其回調(diào)函數(shù)會(huì)將response.data的值賦給caGroupForm.value，打開一個(gè)名為dialogParam的對(duì)話框，將其標(biāo)題設(shè)置為"修改分類"。

總結(jié) 

到此這篇關(guān)于Vue設(shè)置提示和警告彈出框的文章就介紹到這了,更多相關(guān)Vue設(shè)置提示和警告彈出框內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論