<template>
    <app-view class="rules">
        <template #header>
            <app-navbar title="仓储物流" />
        </template>
        <Tabs>
            <Tab title="运输委托">
                <div style="padding: .2rem;">
                    <div style="text-align: center;background-color: #fff;padding: 1rem 0;">
                        <h4 style="margin-bottom: .32rem;">运输委托模版.docx</h4>
                        <Button type="primary" style="width: 50%;" round @click="download">下载文档</Button>
                    </div>
                </div>
            </Tab>
            <Tab title="仓储服务">
                <component :is="asyncComponent" url="./html/ccfw.htm" />
            </Tab>
        </Tabs>
    </app-view>
</template>

<script lang="ts" setup>
import { Tab, Tabs, Button } from 'vant'
import { defineAsyncComponent } from 'vue'
import { getServiceUrl } from '@/services/http'
import plus from '@/utils/h5plus'

const asyncComponent = defineAsyncComponent(() => import('@mobile/components/base/html-panel/index.vue'))

const download = () => {
    const url = getServiceUrl('mobileOpenUrl')
    plus.openURL(url + '/html/yswtmb.docx')
}
</script>

<style lang="less">
@import './index.less';
</style>