首页 > 其他分享 >乱七八的参看-2023-5

乱七八的参看-2023-5

时间：2023-05-23 11:45:25浏览次数：40  
标签：七八 name userlist -- permission 参看 item 2023 row 

<!--<template>-->
<!--  <div>-->
<!--&lt;!&ndash;    表单搜索档2023-5-23，gpt歌者文明&ndash;&gt;-->
<!--    <div class="search_stat">-->
<!--      <app-search :searchByCompany="false" @search="search" :searchFieldArray.sync="searchFieldArray" />-->
<!--    </div>-->
<!--&lt;!&ndash;    表格上的点击点击的标题&ndash;&gt;-->
<!--    <div class="table_wrapper">-->
<!--      <div class="table_header">-->
<!--        <span class="table_name">班次为员列有记录</span>-->
<!--        <span class="table_name odduser"  @click="addtCoupon">新增班次人员</span>-->
<!--      </div>-->
<!--&lt;!&ndash;      表格正文,这是同杨队长代码复制改化成咯,第一个表格有一个表单,是可以单选和全选的&ndash;&gt;-->
<!--      <el-table-->
<!--          border-->
<!--          :data=" takist">-->
<!--        <el-table-column  type="selection" width="55">  </el-table-column>-->
<!--&lt;!&ndash;        判断是显示编辑还是查看,这个设想是状态1就是编辑,状态二就是查看,&ndash;&gt;-->
<!--        <el-table-column prop="st" label="操作">-->
<!--          <template slot-scope="scope">-->
<!--            <el-button v-if="scope.row.st === '1'" type="primary" @click="handleEdit(scope.row)">编辑</el-button>-->
<!--            <el-button v-else type="success" @click="handleView(scope.row)">查看</el-button>-->
<!--          </template>-->
<!--        </el-table-column>-->
<!--&lt;!&ndash;        这儿当班人员是一个数组,需要遍历填充,2023-5-23&ndash;&gt;-->
<!--        <el-table-column prop="userlist" label="当班人员">-->
<!--&lt;!&ndash;          这儿bailist是员工的数组列表,后端还没有定义,我先写在这儿&ndash;&gt;-->
<!--          <template slot-scope="scope">{{ scope.row.userlist.split(',').join('，') }}</template>-->
<!--        </el-table-column>-->
<!--        <el-table-column prop="edit" label="创建人">利梅</el-table-column>-->
<!--        <el-table-column sortable prop="" label="创建时间"></el-table-column>-->
<!--        <el-table-column sortable prop="end_time" label="创建人"></el-table-column>-->
<!--        <el-table-column sortable prop="stat_day" label="修改时间"></el-table-column>-->
<!--        <el-table-column sortable prop="" label="状态">-->
<!--        </el-table-column>-->
<!--      </el-table>-->
<!--&lt;!&ndash;      弹出层显示，这儿的数据只是展示不能修改，遍历当班人员的对象,&ndash;&gt;-->
<!--       <el-dialog title="查看当班数据" :visible.sync ="showActive">-->
<!--         <div>-->
<!--           <el-table-->
<!--               border-->
<!--               :data=" takist">-->
<!--             <el-table-column prop="edit" label="选择人员"></el-table-column>-->
<!--             <el-table-column prop="userlist" label="角色"></el-table-column>-->
<!--             <el-table-column prop="" label="电话"></el-table-column>-->
<!--             <el-table-column sortable prop="date" label="审核权核"></el-table-column>-->
<!--           </el-table>-->
<!--         </div>-->
<!--       </el-dialog>-->
<!--&lt;!&ndash;   这是一个编辑的弹出层罗辑&ndash;&gt;-->
<!--      <el-dialog title="编辑" :visible.sync="editActive">-->
<!--        <div>-->
<!--          <el-table-->
<!--              border-->
<!--              :data=" takist">-->
<!--            <el-table-column prop="edit" label="选择人员">-->
<!--              <template slot-scope="scope">-->
<!--                <el-select v-model="scope.row.name" placeholder="请选择" @change="handleNameChange(scope.row)">-->
<!--                  <el-option v-for="item in userlist" :key="item.label" :label="item.label" :value="item.value"></el-option>-->
<!--                </el-select>-->
<!--              </template>-->
<!--            </el-table-column>-->
<!--            <el-table-column prop="userlist" label="角色"></el-table-column>-->
<!--            <el-table-column prop="" label="电话"></el-table-column>-->
<!--            <el-table-column sortable prop="date" label="审核权核"></el-table-column>-->
<!--            <el-table-column sortable prop="cz" label="操作">删除</el-table-column>-->
<!--          </el-table>-->
<!--        </div>-->
<!--      </el-dialog>-->

<!--&lt;!&ndash;      以下是分页组件&ndash;&gt;-->
<!--      <app-pagination ref="pagination" :params="queryParams" :url="url" :tableList.sync="tableList"></app-pagination>-->
<!--    </div>-->
<!--  </div>-->
<!--</template>-->

<!--<script>-->
<!--import AppPagination from "@/components/AppPagination/index"-->
<!--import AppSearch from "@/components/AppSearch/index"-->
<!--export default {-->
<!--  components:{AppPagination,AppSearch,},-->
<!--  props: {-->
<!--    assetId:{-->
<!--      require:false,-->
<!--    },-->
<!--  },-->
<!--  data() {-->
<!--    return {-->
<!--      showActive:false,-->
<!--      editActive:false,-->
<!--      url:this.ZYBAPI.BALANCE_STAT_PAGE,-->
<!--      queryParams:{-->
<!--        assetId:this.assetId,-->
<!--      },-->
<!--      takist:[-->
<!--        { label: '张三', st: '1', edit: '张三', userlist: '张三,王五,李四', createuser: '张三', date: '2023-05-20' },-->
<!--        { label: '王五', st: '2', edit: '张三', userlist: '张三,王五,李四', createuser: '张三', date: '2023-05-20' },-->

<!--      ],-->
<!--      // 用于弹出层编辑时的初始数组-->
<!--      editForm: {-->
<!--        bailist: [-->
<!--          { name: '', age: '', permission: '' }-->
<!--        ]-->
<!--      },-->
<!--      // 这个对象是用于弹出层获取数组时需要权限或其它参数的例表-->
<!--      nameOptions: [-->
<!--        { label: '张三', value: '张三', age: '25', permission: '管理员' },-->
<!--        { label: '李四', value: '李四', age: '30', permission: '普通员工' },-->
<!--        { label: '王五', value: '王五', age: '28', permission: '普通员工' }-->
<!--      ],-->
<!--      searchFieldArray:[-->
<!--        {-->
<!--          type:"date",-->
<!--          key:"createTime",-->
<!--          value:'',-->
<!--          start_placeholder:"开始时间",-->
<!--          end_placeholder:"结束时间",-->
<!--        },-->
<!--        {-->
<!--          type:"input_search",-->
<!--          key:"fromUserId",-->
<!--          placeholder:"姓名/手机号",-->
<!--          selectUrl:this.API.SEARCH_USER,-->
<!--          value:'',-->
<!--          optionsList:[]-->
<!--        },-->
<!--      ]-->

<!--    }-->
<!--  },-->
<!--  created() {-->
<!--    this.initData();-->
<!--  },-->
<!--  methods:{-->
<!--    initData() {-->

<!--    },-->
<!--    handleEdit(row) {-->
<!--      console.log(row.userlist),-->

<!--      this.editForm.bailist = row.userlist.split(',').map(name => {-->
<!--        const { age, permission } = this.nameOptions.find(option => option.label === name)-->
<!--        return { name, age, permission }-->
<!--      })-->
<!--      this.editActive = true-->
<!--    },-->
<!--    handleView(row) {-->
<!--      // 弹出查看弹出层-->
<!--      this.viewForm = Object.assign({}, row)-->
<!--      this.showActive = true-->
<!--    },-->
<!--    handleSave() {-->
<!--      // 保存编辑结果-->
<!--      console.log("ok&#45;&#45;&#45;&#45;&#45;&#45;")-->
<!--      const index = this.tableData.findIndex(item => item.name === this.editForm.name)-->
<!--      this.tableData.splice(index, 1, this.editForm)-->
<!--      this.editActive = true-->
<!--    },-->
<!--    handleNameChange(row) {-->
<!--      // 根据选择的姓名更新行数据-->
<!--      const item = this.userList.find(user => user.value === row.name)-->
<!--      row.age = item.age-->
<!--      row.permission = item.permission-->
<!--    },-->
<!--    handleAdd() {-->
<!--      // 新增一行数据-->
<!--      this.editTableData.push({-->
<!--        name: '',-->
<!--        age: '',-->
<!--        permission: ''-->
<!--      })-->
<!--    },-->
<!--    handleDelete(index) {-->
<!--      // 删除一行数据-->
<!--      this.editTableData.splice(index, 1)-->
<!--    },-->
<!--    search(params) {-->
<!--      if (this.assetId) {-->
<!--        params["assetId"] = this.assetId;-->
<!--      }-->
<!--      this.queryParams = params;-->
<!--    },-->
<!--    addtCoupon(){-->
<!--      this.showActive = true-->

<!--    },-->
<!--  },-->


<!--}-->
<!--</script>-->

<!--<style lang="scss" scoped>-->
<!--.odduser{-->
<!--  display: inline-block;-->
<!--  margin-left: 15px;-->
<!--  background: #999999;-->
<!--  height: 30px;-->
<!--  line-height: 30px;-->

<!--}-->
<!--</style>-->


<!--<template>-->
<!--  <div>-->
<!--    <el-table :data="tableData" style="width: 100%;">-->
<!--      <el-table-column type="index" label="序号"></el-table-column>-->
<!--      <el-table-column prop="edit" label="编辑人"></el-table-column>-->
<!--      <el-table-column prop="userlist" label="用户列表"></el-table-column>-->
<!--      <el-table-column label="编辑">-->
<!--        <template slot-scope="scope">-->
<!--          <el-button type="primary" @click="handleEdit(scope.row)">编辑</el-button>-->
<!--        </template>-->
<!--      </el-table-column>-->
<!--    </el-table>-->

<!--    <el-dialog title="编辑用户" :visible.sync="editDialogVisible">-->
<!--      <el-table :data="editTableData" style="width: 100%;">-->
<!--        <el-table-column prop="name" label="姓名">-->
<!--          <template slot-scope="scope">-->
<!--            <el-select v-model="scope.row.name" placeholder="请选择" @change="handleNameChange(scope.row)">-->
<!--              <el-option v-for="item in userList" :key="item.label" :label="item.label" :value="item.value"></el-option>-->
<!--            </el-select>-->
<!--          </template>-->
<!--        </el-table-column>-->
<!--        <el-table-column prop="age" label="年龄"></el-table-column>-->
<!--        <el-table-column prop="permission" label="权限"></el-table-column>-->
<!--        <el-table-column label="操作">-->
<!--          <template slot-scope="scope">-->
<!--            <el-button type="text" size="small" @click="handleDelete(scope.$index)">删除</el-button>-->
<!--          </template>-->
<!--        </el-table-column>-->
<!--      </el-table>-->

<!--      <div style="margin-top: 20px;">-->
<!--        <el-button type="primary" @click="handleAdd">添加</el-button>-->
<!--      </div>-->
<!--    </el-dialog>-->
<!--  </div>-->
<!--</template>-->

<!--<script>-->
<!--export default {-->
<!--  data() {-->
<!--    return {-->
<!--      tableData: [-->
<!--        { st: '1', edit: '张三', userlist: '张三,李四,王五', createuser: '张三', date: '2023-05-20' },-->
<!--        { st: '2', edit: '李四', userlist: 'aaa,bbb,ccc', createuser: '李四', date: '2023-05-21' },-->
<!--        { st: '1', edit: '王五', userlist: 'ddd,eee,fff', createuser: '王五', date: '2023-05-22' }-->
<!--      ],-->
<!--      editDialogVisible: false,-->
<!--      editTableData: [],-->
<!--      userList: [-->
<!--        { label: '张三', value: '张三', age: '25', permission: '管理员' },-->
<!--        { label: '李四', value: '李四', age: '30', permission: '普通员工' },-->
<!--        { label: '王五', value: '王五', age: '28', permission: '普通员工' }-->
<!--      ]-->
<!--    }-->
<!--  },-->
<!--  methods: {-->
<!--    handleEdit(row) {-->
<!--      // 打开编辑弹出层-->
<!--      this.editDialogVisible = true-->

<!--      // 根据userlist字符串切割生成表格数据-->
<!--      const userList = row.userlist.split(',')-->
<!--      this.editTableData = userList.map(name => {-->
<!--        const item = this.userList.find(user => user.label === name)-->
<!--        return {-->
<!--          name: item.label,-->
<!--          age: item.age,-->
<!--          permission: item.permission-->
<!--        }-->
<!--      })-->
<!--    },-->
<!--    handleNameChange(row) {-->
<!--      // 根据选择的姓名更新行数据-->
<!--      const item = this.userList.find(user => user.value === row.name)-->
<!--      row.age = item.age-->
<!--      row.permission = item.permission-->
<!--    },-->
<!--    handleAdd() {-->
<!--      // 新增一行数据-->
<!--      this.editTableData.push({-->
<!--        name: '',-->
<!--        age: '',-->
<!--        permission: ''-->
<!--      })-->
<!--    },-->
<!--    handleDelete(index) {-->
<!--      // 删除一行数据-->
<!--      this.editTableData.splice(index, 1)-->
<!--    }-->
<!--  }-->
<!--}-->
<!--</script>-->


<template>
  <div>
    <el-table :data="tableData" style="width: 100%;">
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button v-if="scope.row.st === '1'" type="primary" @click="handleEdit(scope.row)">编辑</el-button>
          <el-button v-else type="success" @click="handleView(scope.row)">查看</el-button>
        </template>
      </el-table-column>
      <el-table-column prop="edit" label="编辑人"></el-table-column>
      <el-table-column prop="userlist" label="用户列表"></el-table-column>
    </el-table>

    <el-dialog title="编辑用户" :visible.sync="editDialogVisible">
      <el-table :data="editTableData" style="width: 100%;">
        <el-table-column prop="name" label="姓名">
          <template slot-scope="scope">
            <el-select v-model="scope.row.name" placeholder="请选择" @change="handleNameChange(scope.row)">
              <el-option v-for="item in userList" :key="item.label" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column prop="age" label="年龄"></el-table-column>
        <el-table-column prop="permission" label="权限"></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="handleDelete(scope.$index)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>

      <div style="margin-top: 20px;">
        <el-button type="primary" @click="handleAdd">新增</el-button>
        <el-button type="success" @click="handleSave">保存</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { st: '1', edit: '张三', userlist: '张三,李四,王五', createuser: '张三', date: '2023-05-20' },
        { st: '2', edit: '李四', userlist: 'aaa,bbb,ccc', createuser: '李四', date: '2023-05-21' },
        { st: '1', edit: '王五', userlist: 'ddd,eee,fff', createuser: '王五', date: '2023-05-22' }
      ],
      editDialogVisible: false,
      editTableData: [],
      userList: [
        { label: '张三', value: '张三', age: '25', permission: '管理员' },
        { label: '李四', value: '李四', age: '30', permission: '普通员工' },
        { label: '王五', value: '王五', age: '28', permission: '普通员工' }
      ]
    }
  },
  methods: {
    handleEdit(row) {
      // 打开编辑弹出层
      this.editDialogVisible = true

      // 根据userlist字符串切割生成表格数据
      const userList = row.userlist.split(',')
      this.editTableData = userList.map(name => {
        const item = this.userList.find(user => user.label === name)
        return {
          name: item.label,
          age: item.age,
          permission: item.permission
        }
      })
    },
    handleView(row) {
      // 打开查看弹出层
      this.editDialogVisible = true

      // 根据userlist字符串切割生成表格数据
      const userList = row.userlist.split(',')
      this.editTableData = userList.map(name => {
        const item = this.userList.find(user => user.label === name)
        return {
          name: item.label,
          age: item.age,
          permission: item.permission
        }
      })

      // 禁用编辑和删除按钮
      this.editTableData.forEach(item => {
        item.disabled = true
      })
    },
    handleNameChange(row) {
      // 根据选择的姓名更新行数据
      const item = this.userList.find(user => user.value === row.name)
      row.age = item.age
      row.permission = item.permission
    },
    handleAdd() {
      // 新增一行数据
      this.editTableData.push({
        name: '',
        age: '',
        permission: ''
      })
    },
    handleDelete(index) {
      // 删除一行数据
      this.editTableData.splice(index, 1)
    },
    handleSave() {
      // 保存修改后的userlist到表格中
      const userlist = this.editTableData.map(item => item.name).join(',')
      this.tableData[this.currentIndex].userlist = userlist
      this.editDialogVisible = false
    }
  }
}
</script>

标签：七八,name,userlist,--,permission,参看,item,2023,row
From： https://www.cnblogs.com/fgxwan/p/17422818.html

相关文章

  • 【2023-05-21】连岳摘抄
    23:59绿槐高柳咽新婵。薰风初入弦。碧纱窗下水沈烟。棋声惊昼眠。微雨过，小荷翻。榴花开欲然。玉盆纤手弄清泉。琼珠碎却圆。                                               ......
  • 2023/5/21每日随笔
    今天，写了概率论作业，进行了数据库语句的的安全性操作，然后对于Android进行完善首先，对于Android内的代码进行带入，可以实现，后来，进行数据格式输出的筛选，目前人工智能给出的答案格式不同，利用正则表达式提取不全，但可以提取，另外，在查找可以语法格式来针chatgpt，以实现结果的规范输出。还......
  • APIO2023 游记
    Day-1上午去华山饭店，报到，领纪念品。下午看了APIO2022T1的题解，看了一些APIO2022游记，然后就开始摆gen。Day0上午csy、xtq讲字符串，基本子串结构好评。下午讲写解释器，不准备去听了，在房间里摆gen。下去吃晚饭，队伍排到牡丹厅了，难蚌。预感比赛waiting时间会比较抽象。......
  • CVPR 2023 | Collaborative Diffusion 怎样让不同的扩散模型合作？
    前言 CVPR2023有哪些亮点？CollaborativeDiffusion提供了一种简单有效的方法来实现不同扩散模型之间的合作。本文转载自我爱计算机视觉作者|HuangZiqi仅用于学术分享，若侵权请联系删除欢迎关注公众号CV技术指南，专注于计算机视觉的技术总结、最新技术跟踪、经典论文解读、CV......
  • 2023.5.22
    Lucene学习：为第二阶段冲刺 这个是Lucene自动分词建档，有luke查看的，继续学习，那个视频最后是个京东的全文检索。......
  • java学习日记20230522-TreeSet
    有序键值对集合publicclassTreeSetExercise{publicstaticvoidmain(String[]args){Integerinteger=newInteger(10);TreeSettreeSet=newTreeSet(newComparator(){@Overridepublicintcompare(Objecto1,Obj......
  • 2023-05-22：给定一个长度为 n 的字符串 s ，其中 s[i] 是: D 意味着减少； I 意味着增加。
    2023-05-22：给定一个长度为n的字符串s，其中s[i]是:D意味着减少；I意味着增加。有效排列是对有n+1个在[0,n]范围内的整数的一个排列perm，使得对所有的i：如果s[i]=='D'，那么perm[i]>perm[i+1]，以及；如果s[i]=='I'，那么perm[i]<perm[i+1]。返回有效排列......
  • java学习日记20230522-集合选择原则
    1.判断存储的类型，一组对象【单列】或者一组键值对【双列】2.一组对象【单列】：collection的子类：允许重复：List的某个实现类：增删多LinkedList（底层维护的是双向链表）                                改查多ArrayList（底层维护的是object类型的可......
  • 2023 5 22
    #include<iostream>#include<fstream>#include<string>usingnamespacestd;classDog{public:Dog(){}Dog(intage,intwei){this->m_Age=age;this->m_Wei=wei;}intm_Wei;intm_Age;......
  • 2023.5.22编程一小时打卡
    一、问题描述：线性代数中的矩阵可以表示为一个row＊column的二维数组，当row和column均为1时，退化为一个数，当row为1时，为一个行向量，当column为1时，为一个列向量。建立一个整数矩阵类matrix，其私有数据成员如下：introw;intcolumn;int**mat;建立该整数矩阵类matrix构造函数；建立一个*（......

赞助商

阅读排行

网站主页关于我们联系我们网站地图

本网站内容转载自其他媒体，侵权联系[admin##ips99.com]。

Copyright © 2020-2023 IPS99 版权所有 IPS99