erp/resources/frontend/src/views/plat/faceSheet.vue

<template>
    <div class="conent">
        <div>
            <el-button type="primary" @click="addAuthVisible = true">新增授权</el-button>
        </div>

        <div class="table" style="margin-top: 10px">
            <el-table v-loading="loading" :data="tableData" style="width: 100%">
                <el-table-column prop="shop.name" label="店铺名称"></el-table-column>
                <el-table-column prop="type" label="账户类型"></el-table-column>
                <el-table-column prop="expires_at" label="授权过期时间点"></el-table-column>
                <el-table-column prop="owner_id" label="商家店铺id"></el-table-column>
                <el-table-column prop="owner_name" label="商家账号名称"></el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <el-button type="info" @click="getSenders(scope.row)" size="small">发货信息</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>

        <!-- 新增授权 -->
        <el-dialog title="新增授权" :visible.sync="addAuthVisible" :close-on-click-modal="false" width="20%">
            <el-form :model="authForm" label-width="80px">
                <el-form-item label="店铺">
                    <el-select v-model="authForm.shop_id" placeholder="请选择店铺">
                        <el-option v-for="item in shops" :key="item.id" :label="item.name" :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="账户类型">
                    <el-radio-group v-model="authForm.type">
                        <el-radio label="normal">电商标快</el-radio>
                        <el-radio label="air">空运</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="authBtn()">授权</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>

        <!-- 发货信息 -->
        <el-dialog title="发货信息" :visible.sync="dialogVisible" :close-on-click-modal="false">
            <el-form ref="sendersForm" :model="sendersForm" label-width="100px">

                <template v-for="(item, index) in sendersForm.senderList" :prop="`senderList.$(index)`">
                    <div>
                        <p>发货地址 {{ index + 1 }}</p>
                        <el-form-item label="详细地址">
                            {{ item.province }} {{ item.city }} {{ item.district }} {{ item.detail }}
                        </el-form-item>

                        <el-form-item label="发货人" prop="name">
                            <el-input v-model="item.name"></el-input>
                        </el-form-item>

                        <el-form-item label="手机号" prop="mobile">
                            <el-input v-model="item.mobile"></el-input>
                        </el-form-item>

                        <el-form-item label="排序" prop="sort">
                            <el-input v-model="item.sort"></el-input>
                        </el-form-item>

                        <el-form-item label="状态">
                            <el-radio-group v-model="item.status">
                                <el-radio :label="1">启用</el-radio>
                                <el-radio :label="0">停用</el-radio>
                            </el-radio-group>
                        </el-form-item>
                    </div>
                </template>

                <el-form-item>
                    <el-button type="primary" @click="saveSenders()">保存</el-button>
                    <el-button @click="dialogVisible = false">取消</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
    </div>
</template>

<script>
import { shipList, ShopSenderList, saveSenders, storeList } from "../../api/shop";
export default {
    data() {
        return {
            storeId: [],
            loading: true,
            tableData: [],
            dialogVisible: false,
            addAuthVisible: false,
            sendersForm: {
                senderList: []
            },
            shops: [],
            authForm: {
                shop_id: '',
                type: 'normal'
            }
        };
    },
    mounted() {
        this.getShipList();
        this.getShopsList();
    },
    methods: {
        getShipList() {
            shipList().then((res) => {
                this.tableData = res.data.data;
            });
            this.loading = false
        },
        getSenders(row) {
            ShopSenderList(row.shop_id, row.id).then((res) => {
                this.sendersForm.senderList = res.data.data;
                this.dialogVisible = true;
            })
        },
        saveSenders() {
            saveSenders(this.sendersForm).then((res) => {
                if (200 === res.status) {
                    this.$message.success(res.data.message);
                } else {
                    this.$message.error(res.data.message);
                }
            })
        },
        getShopsList() {
            let page = {
                page: 0,
                per_page: 999,
                plat_id: 1,
            };
            storeList(page).then((res) => {
                this.shops = res.data.data;
            });
        },
        authBtn() {
            location.href = "https://wb.pinduoduo.com/logistics/auth?client_id=24f25877aca447c5830a6aa896301d5e&redirect_uri=http://erp.chutang66.com/pdd/ship&state=" + this.authForm.shop_id + '_' + this.authForm.type;
        }
    },
};
</script>

<style lang="scss" scoped>
a {
    text-decoration: none;
    color: white;
}

.block {
    margin-top: 20px;
}
</style>