成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

vue+element后臺(tái)管理系統(tǒng)中,模態(tài)框中有新增模態(tài)框和刪除功能

testHs / 2261人閱讀

摘要:實(shí)現(xiàn)效果如下結(jié)構(gòu)操作成員刪除獲取當(dāng)前行的打開新增成員確定新增請(qǐng)選擇用戶添加成功從數(shù)組中添加當(dāng)前行刪除員工確定刪除嗎刪除成功從數(shù)組中刪除當(dāng)前行

實(shí)現(xiàn)效果如下

結(jié)構(gòu)

   
            
          
    //scope.$index 獲取當(dāng)前行的index

// 打開新增成員

openAddStaff() {
  this.getAllStaff();
},
// 確定新增
addStaff() {
  if (!this.user) {
    this.$message.error("請(qǐng)選擇用戶!");
    return;
  }
  this.$post(
    "/api/RoleMemberController/add",
    { userId: this.user.split("/")[0], roleId: this.roleId },
    data => {
      console.log(data,111)
      this.$message.success("添加成功!");
      this.dialogAddStaffVisible = false;
      let item = {
        id: data.rm.id,
        userId: data.rm.userId,
        userCname: this.user.split("/")[1]
      };
      this.staffList.push(item);//從數(shù)組中添加當(dāng)前行
    }
  );
},

// 刪除員工

delStaff(id, index) {
  this._confirm("確定刪除嗎?", () => {
    this.$post("/api/RoleMemberController/delOne", { id: id }, data => {
      this.$message.success("刪除成功!");
      this.staffList.splice(index, 1);//從數(shù)組中刪除當(dāng)前行
    });
  });
},

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/104590.html

相關(guān)文章

  • vue項(xiàng)目使用element-ui下拉框選項(xiàng)值為對(duì)象時(shí)報(bào)錯(cuò)

    摘要:在做后臺(tái)管理時(shí),使用了搭配,請(qǐng)求方法使用了插件,在使用下拉框時(shí),因?yàn)槲倚枰@取選中的選項(xiàng)中的其他值,因此需要傳入對(duì)象。 在做后臺(tái)管理時(shí),使用了vue搭配elementUI,請(qǐng)求方法使用了axios插件,在使用下拉框時(shí),因?yàn)槲倚枰@取選中的選項(xiàng)中的其他值,因此需要傳入對(duì)象。對(duì)select下拉框的文檔沒有讀的很仔細(xì),百度過幾篇文章,也沒有理解他們表達(dá)的意思,然后自己又去看文檔,把他的屬性看...

    Drummor 評(píng)論0 收藏0
  • vue+element,新增和編輯共用一個(gè)模態(tài)

    摘要:當(dāng)新增和編輯模態(tài)框內(nèi)容一樣時(shí)這時(shí)候就可以共用一個(gè)模態(tài)框減少代碼量具體代碼如下新增新增不需要傳遞任何參數(shù)編輯編輯時(shí)候需要傳遞當(dāng)前行的模態(tài)框內(nèi)容公司名稱請(qǐng)輸入內(nèi)容統(tǒng)一信用社碼請(qǐng)輸入內(nèi)容公司地址請(qǐng)輸入內(nèi) 當(dāng)新增和編輯模態(tài)框內(nèi)容一樣時(shí),這時(shí)候就可以共用一個(gè)模態(tài)框,減少代碼量,具體代碼如下 新增//新增不需要傳遞任何參數(shù) 編輯//編輯時(shí)候,需要傳遞當(dāng)前行的id 模態(tài)框內(nèi)容 ...

    coolpail 評(píng)論0 收藏0
  • 如何在angular.js優(yōu)雅的使用ui.bootstrap的modal組件

    摘要:提供唯一的方法配置。即文件名,在同一個(gè)頁面有多個(gè)不同業(yè)務(wù)的模態(tài)框的情況下很方便點(diǎn)擊確認(rèn)按鈕執(zhí)行的代碼可以從中獲取和字段進(jìn)一步操作發(fā)起請(qǐng)求等點(diǎn)擊取消按鈕執(zhí)行的代碼 ui.bootstrap的modal組件可以很方便地實(shí)現(xiàn)頁面controller與模態(tài)框controller之間通信,特別是彈出的模態(tài)框中有比較復(fù)雜的表格信息需要用戶填寫,下面切入主題: 注冊(cè)全局模態(tài)框?qū)嵗腸ontrolle...

    Jrain 評(píng)論0 收藏0
  • vue+element 模態(tài)框是表格形式的可編輯表單

    摘要:要實(shí)現(xiàn)的效果如下初始化的時(shí)候不可編輯點(diǎn)擊編輯按鈕編輯按鈕隱藏取消編輯按鈕顯示部分輸入框變?yōu)榭删庉嫚I銷單詳情工單號(hào)客戶姓名聯(lián)系電話客戶地址營銷人員工號(hào) 要實(shí)現(xiàn)的效果如下,初始化的時(shí)候,不可編輯,點(diǎn)擊編輯按鈕,編輯按鈕隱藏,取消編輯按鈕顯示;部分input輸入框變?yōu)榭删庉媠howImg(https://segmentfault.com/img/bVbtBnR?w=915&h=437); s...

    nifhlheimr 評(píng)論0 收藏0
  • summernote.js實(shí)際運(yùn)用遇到的上傳圖片大小控制及bootstrap模態(tài)框嵌套關(guān)閉這兩個(gè)問

    摘要:需求控制編輯框上傳的圖片不超過。從文件中找到如下圖代碼位置,選取需要上傳的圖片,獲取圖片的大小,將其當(dāng)做新增參數(shù),給標(biāo)簽新增屬性。我的解決方法就是將在中加載出來的模態(tài)框中,關(guān)閉按鈕的屬性替換成代碼的事件,用來隱藏模態(tài)框,如下圖所示。 這里先看一下summernote.js模樣,如下圖,可以添加圖片、視頻、鏈接等。showImg(https://segmentfault.com/img/...

    madthumb 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<