<div class="mobilemyindentdetail">
        <gsb-h5nav slot="nav" title="订单详情" isback="true"></gsb-h5nav>

        <div class="mobilemyindentdetail-step">
                <el-steps :active="active" align-center process-status="wait">
                        <el-step title="待付款" description=""></el-step>
                        <el-step title="已付款" description=""></el-step>
                        <el-step title="已完成" description=""></el-step>
                </el-steps>
        </div>
        <div class="mobilemyindentdetail-payment">
                <div class="mobilemyindentdetail-list-item">
                        <div class="mobilemyindentdetail-list-title">
                                <div>{{code.orderNum}}</div>
                                <div v-if="active==1">待付款</div>
                                <div v-if="active==2">已付款</div>
                                <div v-if="active==3">已完成</div>
                        </div>
                        <div class="mobilemyindentdetail-list-box">
                                <div>
                                        <img :src="img" alt="">
                                </div>
                                <div>
                                        <ul>
                                                <li>
                                                        <div>{{dataOrder.sveItemName}}</div>
                                                        <div>x{{dataOrder.salesNum}}</div>
                                                </li>
                                                <li>
                                                        <p>服务费:</p>
                                                        <p>￥{{dataOrder.totalServiceCharge}}</p>
                                                </li>
                                                <li>
                                                        <p>官费:</p>
                                                        <p>￥{{dataOrder.totalPublicExpense}}</p>
                                                </li>
                                                <li>
                                                        <p>发票费:</p>
                                                        <p>￥{{dataOrder.totalTaxes}}</p>
                                                </li>
                                                <li>
                                                        <p>共一件商品 &nbsp; </p>
                                                        <p> 合计:&nbsp;￥{{dataOrder.totalSum}}</p>
                                                </li>
                                        </ul>
                                </div>

                        </div>
                </div>
        </div>
        <div class="mobilemyindentdetail-baseinfo">
                <div class="mobilemyindentdetail-baseinfo-title">
                        商标基础信息
                </div>
                <div>
                        <div>商标名称</div>
                        <div>{{dataOrder.name}}</div>
                </div>
                <div>
                        <div>商标图样</div>
                        <div class="mobilemyindentdetail-sbty-box">
                                <div v-for="(item, index) in tyImg" :key="index">
                                        <img :src="item" alt="">
                                </div>
                        </div>


                </div>
                <div>
                        <div>商标说明</div>
                        <div>该商标文字为：{{dataOrder.name}}</div>
                </div>
        </div>
        <mt-cell title="商标类别" :to="target" is-link :value="cellValue">
        </mt-cell>
        <div class="mobilemyindentdetail-personinfo">
                <div class="mobilemyindentdetail-baseinfo-title">
                        <div>申请人基础信息</div>
                </div>
                <div>
                        <p>申请人资质： </p>
                        <span>{{dataCustomerinfo.customerTypeName}}</span>
                </div>
                <div>
                        <p>申请人名称： </p>
                        <span>{{dataCustomerinfo.name}}</span>
                </div>
                <div>
                        <p>申请人地址：</p>
                        <span>{{dataCustomerinfo.applyAddr}}</span>
                </div>
                <div>
                        <p>邮政编码：</p>
                        <span>{{dataOrder.zipCode}}</span>
                </div>
                <div>
                        <p>联系人：</p>
                        <span>{{dataOrder.contacts}}</span>
                </div>
                <div>
                        <p>联系电话：</p>
                        <span>{{dataOrder.mobile}}</span>
                </div>
                <div>
                        <p>电子邮箱：</p>
                        <span>{{dataOrder.email}}</span>
                </div>
                <div>
                        <p>座机电话：</p>
                        <span>{{dataOrder.tel}}</span>
                </div>
        </div>
        <div class="mobilemyindentdetail-panel" v-if="officeShow" >
                <div @click.stop="handleOffice">
                        <i class="mintui mintui-guanbi"></i>
                </div>
                <div>
                        <img :src="jpgUrl" alt="" >
                        <div class="mobilemyindentdetail-panel-body">

                        </div>
                </div>

        </div>
        
        <div class="mobilemyindentdetail-material">
                <div class="mobilemyindentdetail-baseinfo-title">
                        材料信息
                </div>
                <div>
                        <div>交官文件:</div>
                        <div class="license">
                                <div v-for="(item, index) in stuffList" :key="index">
                                        <div @click="showOffice(item)">
                                                <img src="/imgs/mobileindent/pdf.png" alt="">
                                        </div>
                                        <div>{{item.name}}</div>
                                </div>
                                <div v-for="(item, index) in officialList" :key="index">
                                        <div @click="showOffice(item)">
                                                <img src="/imgs/mobileindent/pdf.png" alt="">
                                        </div>
                                        <div>{{item.name}}</div>
                                </div>
                        </div>

                </div>
                <div>
                        <div>回执文件:</div>
                        <div class="license">
                                <div v-for="(item, index) in officialList" :key="index">
                                        <div @click="showOffice(item)">
                                                <img src="/imgs/mobileindent/pdf.png" alt="">
                                        </div>
                                        <div>{{item.name}}</div>
                                </div>
                        </div>

                </div>

        </div>
        <div class="mobilemyindentdetail-indentinfo">
                <div class="mobilemyindentdetail-baseinfo-title">
                        <div>订单信息</div>
                </div>
                <div>
                        <p>订单编号:&nbsp;&nbsp; </p>
                        <p>{{dataOrder.code}}</p>
                </div>
                <div>
                        <p>服务类型:&nbsp;&nbsp; </p>
                        <p>{{dataOrder.sveItemName}}</p>
                </div>
                <div>
                        <p>下单时间:&nbsp;&nbsp; </p>
                        <p>{{dataOrder.created_at}}</p>
                </div>
        </div>
</div>