| | |
| | | <div> |
| | | <el-input :width="width" :class="inputClass" :style="inputStyle" :clearable="true" :value="value" |
| | | :disabled="disabled" :placeholder="placeholder" type="text" :size="size" @clear="clearValue" @focus="handleFocus"> |
| | | <span slot="append" v-html="svgHtml" style="font-size: 18px;height:18px;display: block"></span> |
| | | <span slot="append" v-html="svgHtml" style="font-size: 18px;padding:3px 10px;width:18px;height:18px;display: block" @click="handleFocus"></span> |
| | | </el-input> |
| | | <el-dialog v-dialogDrag |
| | | v-dialog-resize |
| | |
| | | @close="dialogClose"> |
| | | <div style="display: flex;justify-content: space-between;flex-wrap: wrap"> |
| | | <div class="tag-group"> |
| | | <span class="tag-group__title">分类</span> |
| | | <span class="tag-group__title" v-if="types.length>0">分组</span> |
| | | <el-tag |
| | | v-for="item in types" |
| | | :key="item.key" |
| | |
| | | </div> |
| | | <div style="height: 60vh"> |
| | | <el-tabs v-model="activeName" @tab-click="handleTabClick"> |
| | | <el-tab-pane v-for="item in iconList" :label="item.lable" :name="item.lable" style="height: calc(60vh - 80px);;overflow: auto "> |
| | | <el-tab-pane v-for="item in iconList" :label="item.lable" :name="item.lable" style="height: calc(60vh - 60px);;overflow: auto "> |
| | | <div class="iconList"> |
| | | <div class="iconItem" v-for="svg in item.list" :data-value="svg.name" @click="checkSvg(svg,item.lable)"> |
| | | <div class="svgContent" v-html="svg.content"></div> |
| | |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |
| | | <style scoped lang="scss"> |
| | | ::v-deep{ |
| | | .el-input-group__append, .el-input-group__prepend{ |
| | | padding: 0; |
| | | } |
| | | svg{ |
| | | font-size: inherit; |
| | | height: 100%; |
| | | width:100%; |
| | | } |
| | | } |
| | | .tag-group{font-size: 14px;} |
| | | .el-tag{ |
| | | margin: 0 0 10px 10px; |
| | |
| | | } |
| | | .iconList .iconItem .svgContent{ |
| | | font-size: 24px; |
| | | width: 24px; |
| | | height: 24px; |
| | | margin: 0 auto; |
| | | } |
| | | .iconList .iconItem .svgContent:hover{ |
| | | transform: scale(1.5); |