“dzb”
2022-11-03 41dabb0db9619b8dbb8a311966e0b9920f67f7c8
src/views/operate/fivepack/threepack/components/main/index.vue
@@ -7,40 +7,38 @@
                :data="tableData" style="width: 100%" :row-class-name="tableRowClassName">
                <el-table-column type="selection" min-width="5">
                </el-table-column>
                <el-table-column label="店铺编号" min-width="10">
                    <template slot-scope="scope">{{ scope.row.id }}</template>
                <el-table-column prop="storeNumber" label="店铺编号" min-width="10">
                </el-table-column>
                <el-table-column prop="nickName" label="店铺名称" min-width="10">
                <el-table-column prop="storeName" label="店铺名称" min-width="10">
                </el-table-column>
                <el-table-column prop="username" label="店铺联系人" min-width="10">
                <el-table-column prop="storeOwner" label="店铺联系人" min-width="10">
                </el-table-column>
                <el-table-column prop="mobile" label="店铺联系电话" min-width="10">
                <el-table-column prop="storePhone" label="店铺联系电话" min-width="10">
                </el-table-column>
                <el-table-column prop="note" label="店铺详细地址" min-width="10">
                <el-table-column prop="storeAddress" label="店铺详细地址" min-width="10">
                </el-table-column>
                <el-table-column prop="note" label="关联摄像机" min-width="10">
                <el-table-column prop="storeMoni" label="关联摄像机" min-width="10">
                </el-table-column>
                <el-table-column prop="operation" label="操作" min-width="15">
                <el-table-column prop="operation" label="操作" min-width="20">
                    <template slot-scope="scope">
                        <div class="operation">
                            <el-link icon="el-icon-edit" :underline="false">编辑</el-link>
                            <el-link class="leftPx" icon="el-icon-delete-solid" :underline="false">删除</el-link>
                            <el-link icon="el-icon-edit" :underline="false">推送信息</el-link>
                            <el-link icon="el-icon-edit" :underline="false">查看</el-link>
                            <el-link icon="el-icon-edit" :underline="false" @click="hadnleView(scope.row,0)">编辑</el-link>
                            <el-link class="leftPx" icon="el-icon-delete-solid" :underline="false" @click="handleDelete(scope.row.id)">删除</el-link>
                            <el-link class="leftPx" icon="el-icon-edit"  :underline="false">推送信息</el-link>
                            <el-link class="leftPx" icon="el-icon-edit" :underline="false" @click="hadnleView(scope.row,1)">查看</el-link>
                        </div>
                    </template>
                </el-table-column>
            </el-table>
            <!-- 查看修改页面 -->
            <el-dialog :visible.sync="dialogUpdate" width="45%" v-if="dialogUpdate"
                :title="updateFlag ? '修改用户部门信息' :'查看用户信息'">
                <updateUser :updateFlag="updateFlag" :userInfo=userInfo />
                :title="updateFlag ? '修改店铺信息' : '查看店铺信息'" :before-close="handleClose">
                <updateUser :updateFlag="updateFlag" :userInfo=userInfo @handleUpdateData="handleUpdateData" />
            </el-dialog>
            <!-- 分页 -->
            <div class="pagination">
                <el-pagination background :current-page="currentPage" layout="prev, pager, next" :total="totalNum"
                    :page-size="pageSize" @current-change="changeCurrentPage" @prev-click="handlePrev"
                    @next-click="handleNext">
                    :page-size="pageSize" @current-change="changeCurrentPage">
                </el-pagination>
            </div>
        </div>
@@ -55,7 +53,53 @@
    },
    data() {
        return {
            tableData: [],
            tableData: [
                {
                    id: 1,
                    storeNumber: '1002220212',
                    storeName: '店铺1',
                    storeOwner: '张三',
                    storePhone: '17844631885',
                    storeAddress: '甜心街12号',
                    storeMoni: '摄像头1'
                },
                {
                    id: 2,
                    storeNumber: '1002220213',
                    storeName: '店铺2',
                    storeOwner: '张三',
                    storePhone: '17844631885',
                    storeAddress: '甜心街13号',
                    storeMoni: '摄像头1'
                },
                {
                    id: 3,
                    storeNumber: '1002220214',
                    storeName: '店铺3',
                    storeOwner: '张三',
                    storePhone: '17844631885',
                    storeAddress: '甜心街14号',
                    storeMoni: '摄像头1'
                },
                {
                    id: 4,
                    storeNumber: '1002220215',
                    storeName: '店铺4',
                    storeOwner: '张三',
                    storePhone: '17844631885',
                    storeAddress: '甜心街15号',
                    storeMoni: '摄像头1'
                },
                {
                    id: 5,
                    storeNumber: '1002220216',
                    storeName: '店铺5',
                    storeOwner: '张三',
                    storePhone: '17844631885',
                    storeAddress: '甜心街16号',
                    storeMoni: '摄像头1'
                },
            ],
            search: "111",
            dialogUpdate: false,
            updateFlag: false,
@@ -67,66 +111,49 @@
        }
    },
    created() {
        this.getUserList();
    },
    methods: {
        // 删除数据
        handleDelete(id){
            const {tableData} = this
            let idx
            for(let key in tableData){
                tableData[key].id === id ? idx = key :''
            }
            this.tableData.splice(idx,1)
        },
        // 打开弹窗
        hadnleView(data,index){
            index === 0 ? this.updateFlag = true : this.updateFlag = false
            this.userInfo = data
            this.dialogUpdate = true
        },
        // 自定义关闭弹窗
        handleClose(done){
            if(this.updateFlag){
                this.$confirm('确认关闭?')
                .then(_=>{
                    done()
                })
            }else{
                done()
            }
        },
        // 更新数据
        handleUpdateData(obj){
            const {tableData} = this
            let index = -1
            for(let item in tableData){
                if(tableData[item].id===obj.id){
                    index = item
                }
            }
            this.tableData.splice(index,1,obj)
            this.dialogUpdate = false
        },
        // 当前页改变触发事件
        changeCurrentPage(page) {
            this.currentPage = page;
            this.getUserList();
        },
        // 上一页点击事件
        handlePrev(page) {
            this.currentPage = page;
            this.getUserList();
        },
        // 下一页点击事件
        handleNext(page) {
            this.currentPage = page;
            this.getUserList();
        },
        // 修改角色
        handleChangeRole(obj) {
            this.dialogUpdate = true
            this.user = obj;
            // console.log(obj)
        },
        // 修改用户状态
        handleChangeStatus(obj) {
            let { id, status } = obj;
            status == true ? status = 1 : status = 0;
            this.$axios.post(`sccg/admin/updateStatus/` + id + '?status=' + status).then(res => {
                console.log(res);
            })
        },
        // 获取用户列表
        getUserList() {
            const that = this;
            const { currentPage, pageSize, search } = this;
            // 获取所有用户信息、用户查询(暂时支持电话号码)
            // this.$axios.get(`sccg/store/storeinfo/list?keyword=${search}&pageNum=${currentPage}&pageSize=${pageSize}`).then(res => {
            //     if (res.code === 200) {
            //         res.data.records.forEach(item => {
            //             item.createTime = helper(item.createTime);
            //             item.status == 1 ? item.status = true : item.status = false;
            //         })
            //         that.totalNum = res.data.pages * pageSize;
            //         that.tableData = res.data.records;
            //         this.renderFlag = true;
            //     }
            // })
        },
        // 查看用户信息(不可修改)
        handleFind(rowData) {
            this.dialogUpdate = true;
            this.updateFlag = false;
            this.userInfo = rowData;
        },
        // 修改用户部门信息
        handleUpdate(rowData) {
            this.dialogUpdate = true;
            this.updateFlag = true;
            this.userInfo = rowData
        },
        // 设置表格斑马纹
        tableRowClassName({ row, rowIndex }) {
@@ -147,12 +174,11 @@
                    if (this.keyword != '') {
                        this.search = this.keyword;
                    }
                    this.getUserList();
                    this.$emit('resetFresh', { flag: false })
                }
            },
            immediate: true
        }
        },
    }
}
</script>
@@ -203,10 +229,6 @@
        .operation {
            display: flex;
            .line {
                padding: 0 5px;
            }
            .el-button {
                // background-color: #fff;