您的当前位置:首页先获取打印的模板,用户选择过的模板通过接口要回显出来,预览只显示key的值,value是前端写死

先获取打印的模板,用户选择过的模板通过接口要回显出来,预览只显示key的值,value是前端写死

2023-06-02 来源:小侦探旅游网

先在的需求是 先获取打印的模板,用户选择过的模板通过接口要回显出来,预览只显示key的值,value是前端写死

需求视频

max_data 是黑色部分,small_data 是select 的下拉部分,获取用户设置过的接口跟整个模板接口数据类型是一样的,选择框旁边的加号和减号出现的条件是 ,没有选择过的第一个是加号,选择到没有数据了,出现减号。

还有数据的话最后一个选择框出现一个加号一个减号,其余的是一个减号

预览

 

<template>
    <div class="printInfo">
        <div @click="onPreview" class="preview_font">预览</div>
        <div class="print_item" v-for="(item, index) in selectList" :key="index">
            <div class="title">
                <div class="title-left" v-if="item.max_data">{
  { item.max_data.name }}</div>
            </div>
            <div class="info">
                <div class="select_item" v-for="(v, i) in item.choose" :key="i">
                    <el-select v-model="item.choose[i]" placeholder="请选择">
                        <el-option v-for="(_item, _index) in item.small_data.filter(temp=>temp.id == v || item.choose.indexOf(temp.id)==-1)" :key="_item.id" :label="_item.name"
                            :value="_item.id">
                        </el-option>
                    </el-select>
                    <i class="el-icon-remove" v-if="(i != 0 && !!v) || (i == 0 && item.choose.length > 1)"
                        @click="remove(item, i)"></i>
                    <i class="el-icon-circle-plus" v-if="(i==0 && !!v && item.choose.length==1) || (i==item.choose.length-1 && item

因篇幅问题不能全部显示,请点此查看更多更全内容