ApiDetail.vue 7.47 KB
<style>
.apidetail blockquote {
    margin: 10px 0;
}

.apidetail-title-name {
    float: left;
}

.apidetail-title-btn {
    float: right;
}

.apidetail-title-name-1 {
    display: block;
    font-size: 25px;
    font-weight: 100;
}

.apidetail-title-name-2 {
    display: block;
    margin: 10px 0;
}
</style>
<template>
    <div class="apidetail">
        <Back-top></Back-top>
        <div class="apidetail-title">
            <div class="apidetail-title-name">
                <span class="apidetail-title-name-1"> taobao.product.update </span>
                <span class="apidetail-title-name-2"> (修改一个产品,可以修改主图,不能修改子图片)</span>
            </div>
            <div class="apidetail-title-btn">
    
                <Button-group>
                    <Button type="ghost"
                            icon="information-circled">
    
                        1.0</Button>
                    <Button type="primary"
                            icon="gear-a">
                        调试</Button>
                </Button-group>
            </div>
            <div class="clear"></div>
        </div>
        <Tag type="border"
             color="yellow">免费</Tag>
        <Tag type="border"
             color="yellow">需授权</Tag>
        <blockquote>
            接口说明信息说明信息说明信息说明信息说明信息说明信息说明信息说明信息 说明信息说明信息说明信息说明信息说明信息说明信息说明信息说明信息说明信息说明信息说 说明信息说明信息说明信息
        </blockquote>
    
        <Collapse v-model="openPanel">
            <Panel name="0">
                接口地址
                <p slot="content">
                    <Table border
                           :columns="columns2"
                           :data="data2"></Table>
                </p>
            </Panel>
            <Panel name="1">
                公共参数
                <p slot="content">
                    <Table border
                           :columns="columns1"
                           :data="data1"></Table>
                </p>
            </Panel>
            <Panel name="2">
                请求参数
                <p slot="content">斯蒂夫·盖瑞·沃兹尼亚克(Stephen Gary Wozniak),美国电脑工程师,曾与史蒂夫·乔布斯合伙创立苹果电脑(今之苹果公司)。斯蒂夫·盖瑞·沃兹尼亚克曾就读于美国科罗拉多大学,后转学入美国著名高等学府加州大学伯克利分校(UC Berkeley)并获得电机工程及计算机(EECS)本科学位(1987年)。</p>
            </Panel>
            <Panel name="3">
                响应参数
                <p slot="content">乔纳森·伊夫是一位工业设计师,现任Apple公司设计师兼资深副总裁,英国爵士。他曾参与设计了iPod,iMac,iPhone,iPad等众多苹果产品。除了乔布斯,他是对苹果那些著名的产品最有影响力的人。</p>
            </Panel>
            <Panel name="4">
                请求示例
                <p slot="content"
                   class="code">
                    <pre> 
                    {
                        "nu":"1093590637819",
                        "message":"ok",
                        "companytype":"ems",
                        "ischeck":"1",
                        "com":"ems",
                        "updatetime":"2016-08-22 01:37:27",
                        "status":"200",
                        "condition":"F00",
                        "codenumber":"1093590637819",
                        "data":[
                            {
                                "time":"2016-08-17 10:57:02",
                                "context":"【北京市】 投递并签收,签收人:他人收 前台",
                                "ftime":"2016-08-17 10:57:02"
                            },
                            {
                                "time":"2016-08-17 07:51:00",
                                "context":"【北京市】 北京邮政速递朝阳路区域分公司呼家楼营投部安排投递,预计23:59:00前投递(投递员姓名:徐龙会18519361767;联系电话:18519361767)",
                                "ftime":"2016-08-17 07:51:00"
                            },
                            {
                                "time":"2016-08-16 17:11:34",
                                "context":"北京市已收件(揽投员姓名:白中位,联系电话:)",
                                "ftime":"2016-08-16 17:11:34"
                            }
                        ],
                        "state":"3"
                    }
                                        </pre>
    
                </p>
            </Panel>
            <Panel name="5">
                响应示例
                <p slot="content">乔纳森·伊夫是一位工业设计师,现任Apple公司设计师兼资深副总裁,英国爵士。他曾参与设计了iPod,iMac,iPhone,iPad等众多苹果产品。除了乔布斯,他是对苹果那些著名的产品最有影响力的人。</p>
            </Panel>
        </Collapse>
    </div>
</template>
<script>
export default {
    data() {
        return {
            openPanel: [0,1, 2, 3, 4],
            columns2:[{
                 title: '环境',
                 key: 'str1',
                 width: 200,
            },{
                 title: '地址',
                 key: 'str2',
                
            },
            ],
            data2:[
                {
                    str1: '正式环境',
                    str2: 'http://www.baidu.com',
                },
                {
                    str1: '沙箱环境',
                    str2: 'http://www.baidu.com',
                },
            ],
            columns1: [
                {
                    title: '名称',
                    key: 'str1',
                    width: 200,
                },
                {
                    title: '类型',
                    key: 'str2',
                    width: 100,
                },
                {
                    title: '是否必填',
                    key: 'str3',
                    width: 100,
                },
                {
                    title: '描述',
                    key: 'str4'
                }
            ],
            data1: [
                {
                    str1: 'method',
                    str2: 'String',
                    str3: '是',
                    str4: '描述信息'
                },
                {
                    str1: 'app_key',
                    str2: 'String',
                    str3: '是',
                    str4: '描述信息'
                },
                {
                    str1: 'target_app_key',
                    str2: 'String',
                    str3: '是',
                    str4: '描述信息'
                },
                {
                    str1: 'sign_method',
                    str2: 'String',
                    str3: '是',
                    str4: '描述信息'
                },
                {
                    str1: 'session',
                    str2: 'String',
                    str3: '是',
                    str4: '描述信息'
                },
                {
                    str1: 'sign',
                    str2: 'String',
                    str3: '是',
                    str4: '描述信息'
                }
            ]

        }
    }
}
</script>