123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>首页菜单</title>
- <style>
- .box_left {
- display: block;
- width: 375px;
- height: 667px;
- border: 5px solid #26B3A0;
- position: relative;
- }
- .box_right {
- display: block;
- position: absolute;
- width: 375px;
- right: 0px;
- height: 95%;
- height: 650px;
- overflow-y: scroll
- }
- .lanmu a {
- margin-top: 10px;
- }
- .settexts {
- position: absolute;
- font-size: 16px;
- cursor: pointer;
- z-index: 100;
- }
- .fountsizes {
- width: 80px !important;
- position: absolute;
- display: inline !important;
- height: 24px !important;
- }
- .selects {
- border: 1px solid #26B3A0;
- border-radius: 3px
- }
- .setimgsrc {
- width: 80px;
- }
- .setimgs {
- position: absolute;
- cursor: pointer;
- z-index: 50;
- width: auto;
- height: auto;
- box-shadow: rgba(255,255,255,0.4);
- padding:5px;
- }
- .selectimgs {
- border: 1px solid #26B3A0;
- padding: 2px;
- border-radius: 3px
- }
- .nbts {
- width: 360px;
- position: absolute;
- bottom: 20px;
- z-index: 101;
- right: 0px;
- }
- .box_left{
- width: 375px;
- height: auto;
- }
- .bg-img{
- display: block;
- width: 100%;
- height: auto;
- }
- </style>
- </head>
- <body class="laytp-container">
- <div class="layui-card" id="search-form">
- <div class="layui-card-body">
- <blockquote class="layui-elem-quote">使用方法:1. 上传背景图,2. 点击左侧二维码,并选中二维码元素拖动,3. 保存配置</blockquote>
- <a type="button" href="https://source.iduomi.cc/poster_bg.jpg" target="_blank" download="poster_bg.jpg" class="laytp-btn laytp-btn-primary laytp-btn-sm" >
- <i class="layui-icon layui-icon-download-circle"></i>
- 下载海报背景图
- </a>
- <a type="button" href="https://source.iduomi.cc/gpt%E6%B5%B7%E6%8A%A5.ai" target="_blank" download="poster_bg.ai" class="laytp-btn laytp-btn-warning laytp-btn-sm" >
- <i class="layui-icon layui-icon-download-circle"></i>
- 下载海报源文件
- </a>
- </div>
- </div>
- <div class="layui-row layui-col-space10">
- <div class="layui-col-xs6 layui-col-sm6 layui-col-md8">
- <div class="layui-card">
- <div class="layui-card-body" style="display: flex;
- justify-content: center;
- align-items: center;">
- <div class="box_left">
- <img class="bg-img" id="bg-img" src="" alt="">
- </div>
- </div>
- </div>
- </div>
- <div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
- <div class="layui-card">
- <div class="layui-card-body">
- <div class="layui-form-item">
- <label class="layui-form-label">背景图片:</label>
- <div class="layui-input-block">
- <img class="layui-upload-img" id="backimgtmp" style="width: 80px"
- src="" />
- </div>
- <div class="layui-form-mid layui-word-aux" style="margin-left: 30px">当前背景图片尺寸: <span class="bg-width"></span> * <span class="bg-height"></span></div>
- <div class="layui-form-mid layui-word-aux" style="margin-left: 30px">建议背景图片尺寸: 375 * 667</span></div>
- </div>
- <div class="layui-form-item posteryuansu" >
- <label class="layui-form-label">海报元素:</label>
- <div class="layui-input-block lanmu">
- <a href="javascript:;" onclick="setimg('qrcode','二维码',1)"
- class="layui-btn layui-btn-primary layui-btn-xs"><i class="layui-icon layui-icon-addition"></i>二维码</a>
- </div>
- </div>
- <div class="layui-form-item" style="display:none">
- <label class="layui-form-label">二维码x位置:</label>
- <div class="layui-input-block">
- <input type="text" class="layui-input" name="name" id="qrcode-x"
- value="0" onblur="saveimg()" disabled style="width: 180px;" />
- </div>
- </div>
- <div class="layui-form-item" style="display:none">
- <label class="layui-form-label">二维码y位置:</label>
- <div class="layui-input-block">
- <input type="text" class="layui-input" name="name" id="qrcode-y"
- value="0" onblur="saveimg()" disabled style="width: 180px;" />
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label">二维码宽度:</label>
- <div class="layui-input-block">
- <input class="layui-input" type="number" fountsizes value="80" id="qrcode-width" onblur="onQrcodeBlur()" style="width: 180px;" />
- </div>
- </div>
- <!-- <div class="layui-form-item" id="posternum"></div> -->
- <div class="layui-form-item" style="position: absolute; bottom: 20px; margin-left: 36px">
- <input type="hidden" value="" name="bg-width" id="bg-width" />
- <input type="hidden" value="" name="textvalue" id="bg-height" />
- <input type="hidden" value="" name="setvalue" id="bg-img-id" />
- <input type="hidden" value="" name="settitle" id="settitle" />
- <input type="hidden" value="{$poster['id']}" name="ids" />
- </div>
- <!-- <a href="javascript:;" onclick="delimg()" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-left: 110px;margin-bottom: 100px;">重置二维码</a> -->
- <button type="submit" class="submit laytp-btn laytp-btn-primary laytp-btn-sm" lay-submit="" lay-filter="add" >
- <i class="layui-icon layui-icon-ok"></i>
- 保存配置
- </button>
- </div>
- </div>
- </div>
- </div>
- <script src="https://s3.pstatp.com/cdn/expire-1-M/jquery/3.2.1/jquery.min.js"></script>
- <script>
- if(localStorage.getItem("staticDomain")){
- document.write("<link rel='stylesheet' href='" + localStorage.getItem("staticDomain") +
- "/component/layui/css/layui.css?v=" + localStorage.getItem("version") + "'>");
- document.write("<script src='" + localStorage.getItem("staticDomain") + "/component/layui/layui.js?v="+localStorage.getItem("version")+"'><\/script>");
- document.write("<script src='" + localStorage.getItem("staticDomain") + "/component/laytp/layuiConfig.js?v="+localStorage.getItem("version")+"'><\/script>");
- document.write("<script src='" + localStorage.getItem("staticDomain") + "/component/jquery.event.ue.js?v="+localStorage.getItem("version")+"'><\/script>");
- document.write("<script src='" + localStorage.getItem("staticDomain") + "/component/jquery.udraggable.js?v="+localStorage.getItem("version")+"'><\/script>");
- }else{
- document.write("<link rel='stylesheet' href='" + localStorage.getItem("staticDomain") +
- "/component/layui/css/layui.css?v=" + localStorage.getItem("version") + "'>");
- document.write("<script src='" + localStorage.getItem("staticDomain") + "/component/layui/layui.js?v="+localStorage.getItem("version")+"'><\/script>");
- document.write("<script src='/static/component/layui/layui.js?v="+localStorage.getItem("version")+"'><\/script>");
- document.write("<script src='/static/component/laytp/layuiConfig.js?v="+localStorage.getItem("version")+"'><\/script>");
- document.write("<script src='/static/component/jquery.event.ue.js?v="+localStorage.getItem("version")+"'><\/script>");
- document.write("<script src='/static/component/jquery.udraggable.js?v="+localStorage.getItem("version")+"'><\/script>");
- }
- </script>
- <script>
- let dom,ratio=0,qrcode_ratio_width,qrcode_ratio_height;
- layui.use(['laytp', 'drawer','element'], function() {
- var group = "system.commission";
- var upload = layui.upload;
- var drawer = layui.drawer;
- var element = layui.element;
- let form = layui.form;
- let $ = layui.jquery;
- // 先获取数据,渲染表单
- // 渲染完表单之后,设置滚动条
- facade.ajax({
- route: "/admin.conf/getGroupConf",
- data: {
- "group": group
- },
- successAlert: false,
- showLoading: true
- }).done(function(res) {
- if (res.code === 0) {
- // layui.laytpl($("#form").html()).render(res.data, function (string) {
- // $("form").html(string);
- // layui.laytpForm.render();
- // form.render();
- // });
- if(res.data.poster_bg_img){
- $('#backimgtmp').attr('src', res.data.poster_bg_img_path);
- $('#bg-img').attr('src', res.data.poster_bg_img_path);
- $('#bg-img-id').val(res.data.poster_bg_img)
- }else{
- $('#backimgtmp').attr('src', localStorage.getItem("staticDomain")+'/admin/images/uploadimg.png');
- }
- if(res.data.poster_bg_width){
- $('.bg-width').text(res.data.poster_bg_width)
- $('.bg-height').text(res.data.poster_bg_height)
- $('#bg-width').val(res.data.poster_bg_width)
- $('#bg-height').val(res.data.poster_bg_height)
- ratio = res.data.poster_bg_width/375;
- qrcode_ratio_width = res.data.poster_qrcode_width/ratio;
- qrcode_ratio_height = res.data.poster_qrcode_width/ratio;
- console.log(qrcode_ratio_width);
- }
- if(res.data.poster_qrcode_x){
- $('#qrcode-width').val(res.data.poster_qrcode_width)
- $('#qrcode-x').val(res.data.poster_qrcode_x/ratio)
- $('#qrcode-y').val(res.data.poster_qrcode_y/ratio)
- $('.box_left').prepend('<div class="setimgs" id="qrcode"><img src="'+localStorage.getItem("staticDomain")+'/admin/images/qrcode.png'+'" onclick="imgstyle(\'' + 'qrcode' + '\')" class="setimgsrc" style="width:' + res.data.poster_qrcode_width/ratio + 'px;height:' + res.data.poster_qrcode_width/ratio + 'px;" id="qrcode-img" /></div>');
- $('#qrcode').css("inset", res.data.poster_qrcode_y/ratio + "px auto auto " + res.data.poster_qrcode_x/ratio + "px");
- }
- }
- });
- $('#btnClose').on('click',function(){
- dom.close();
- });
- var ajaxHeaders = {};
- ajaxHeaders[layui.context.get("tokenKey")] = facade.getCookie(layui.context.get("tokenCookieKey"));
- var uploadInst = upload.render({
- headers: ajaxHeaders,
- elem: '#backimgtmp',
- data: {
- accept: "image",
- height: "0",
- upload_type: "local",
- width: "0",
- is_get_image_info: "1",
- },
- accept: 'image',
- multiple:false,
- field: "laytpUploadFile",
- url: facade.url("/admin.common/upload"),
- before: function (obj) {
- obj.preview(function (index, file, result) {
- $('#backimgtmp').attr('src', result); //图片链接(base64)
- //图片链接(base64)
- });
- },
- done: function (res) {
- if (res.code === 1) {
- facade.error(res["msg"], "失败提示");
- return;
- }
- facade.success(res.msg);
- // $('.box_left').css('background', 'url("' + res.data.path + '") no-repeat');
- $('#bg-img').attr('src', res.data.path);
- $('.bg-width').text(res.data.width)
- $('.bg-height').text(res.data.height)
- $('#bg-width').val(res.data.width)
- $('#bg-height').val(res.data.height)
- $('#bg-img-id').val(res.data.id)
- ratio = res.data.width/375;
- // getposter()
- },
- error: function () {
- return layer.msg('上传失败');
- },
- });
- })
- $('.submit').on('click',function(){
- // alert(ratio)
- // return;
- var field = {
- 'poster_bg_width': $('#bg-width').val(),
- 'form_type[poster_bg_width]': 'input',
- 'poster_bg_height': $('#bg-height').val(),
- 'form_type[poster_bg_height]': 'input',
- 'poster_qrcode_x': $('#qrcode-x').val()*ratio,
- 'form_type[poster_qrcode_x]': 'input',
- 'poster_qrcode_y': $('#qrcode-y').val()*ratio,
- 'form_type[poster_qrcode_y]': 'input',
- 'poster_bg_img': $('#bg-img-id').val(),
- 'form_type[poster_bg_img]': 'upload',
- 'poster_qrcode_width': $('#qrcode-width').val(),
- 'form_type[poster_qrcode_width]': 'upload'
- };
- field.group = "system.commission";
- facade.ajax({
- route: '/admin.conf/saveGroupConf',
- data: field
- }).done(function (res) {
- if (res.code === 0) {
- parent.layui.layer.close(parent.layui.layer.getFrameIndex(window
- .name)); //关闭当前页
- parent.layui.table.reload("laytp-table");
- }
- // btnAnim.stop();
- }).fail(function () {
- // btnAnim.stop();
- });
- })
- </script>
- <script>
- function onQrcodeBlur(){
- console.log(ratio)
- $('.setimgsrc').css('width',$('#qrcode-width').val()/ratio )
- $('.setimgsrc').css('height',$('#qrcode-width').val()/ratio )
- }
- function requesturl(action = '') {
- var tourl = '{:addons_url("poster/lists/xxxx")}';
- return tourl.replace(new RegExp('xxxx', 'g'), action);
- }
- function initBgImg(){}
- function getposter() {
- $(".box_left").html("");
- // $.post(requesturl('getposter'), $('#addform').serialize(), function (r) {
- // if (r.backimg) {
- $('.box_left').css('background', 'url("' + 'https://dev.iduomi.cc/attachment/headimg_2.jpg?time=1684491452' + '") no-repeat');
- $('#backimgtmp').attr('src', 'https://dev.iduomi.cc/attachment/headimg_2.jpg?time=1684491452');
- $('.posteryuansu').show();
- // }
- // if (r.text) {
- // for (var i = 0; i < r.text.length; i++) {
- // if ($('#' + r.text[i].name).length > 0) {
- //
- // } else {
- // $('.box_left').prepend('<div onclick="textstyle(\'' + r.text[i].name + '\')" class="settexts" id="' + r.text[i].name + '">' + r.text[i].data.title + '</div>');
- // }
- // $('#' + r.text[i].name).css("color", r.text[i].data.color ? r.text[i].data.color : "#000000");
- // $('#' + r.text[i].name).css("font-size", (r.text[i].data.size ? r.text[i].data.size : 16) + "px");
- // $('#' + r.text[i].name).html(r.text[i].data.title ? r.text[i].data.title : "文字");
- // $('#' + r.text[i].name).css("inset", r.text[i].data.y + "px auto auto " + r.text[i].data.x + "px");
- // }
- // }
- // if (r.image) {
- // for (var i = 0; i < r.image.length; i++) {
- // if ($('#' + r.image[i].name).length > 0) {
- //
- // } else {
- // if(r.image[i].name=='qrcode'||r.image[i].name=='syscode'){
- // $('.box_left').prepend('<div class="setimgs" id="' + r.image[i].name + '" ><img src="{$codeurl}static/web/image/'+r.image[i].name+'.png" onclick="imgstyle(\'' + r.image[i].name + '\')" class="setimgsrc" style="width:' + r.image[i].data.width + 'px;height:' + r.image[i].data.height + 'px;" id="' + r.image[i].name + 'img" /></div>');
- // } else {
- // $('.box_left').prepend('<div class="setimgs" id="' + r.image[i].name + '" ><img src="' + r.image[i].data.saveurl + '" onclick="imgstyle(\'' + r.image[i].name + '\')" class="setimgsrc" style="width:' + r.image[i].data.width + 'px;height:' + r.image[i].data.height + 'px;" id="' + r.image[i].name + 'img" /></div>');
- // }
- // }
- // $('#' + r.image[i].name).css("inset", r.image[i].data.y + "px auto auto " + r.image[i].data.x + "px");
- // }
- // }
- // if (r.name) {
- // $('#poster_name').val(r.name);
- // }
- // });
- }
- function settext(textid, title, tps = 0) {
- var tpsnum = '';
- if ($('#' + textid).length > 0 && tps == 1) {
- layer.msg('元素已存在');
- return;
- } else {
- if (tps == 0) {
- var thistimes = new Date();
- tpsnum = thistimes.getHours().toString() + thistimes.getMinutes().toString() + thistimes.getSeconds().toString();
- }
- }
- $('.box_left').prepend('<div onclick="textstyle(\'' + textid + tpsnum + '\')" class="settexts" id="' + textid + tpsnum + '">' + title + '</div>');
- textstyle(textid + tpsnum, tps);
- $('#setvalue').val(textid + tpsnum);
- $('#settitle').val(title);
- console.log(tps);
- }
- function textstyle(textid, tps = 0) {
- // $('#posternum').html("");
- $('.settexts').removeClass("selects");
- $('.setimgs').removeClass("selectimgs");
- $('#setvalue').val(textid);
- $('#textvalue').val(textid);
- $("#" + textid).addClass("selects");
- // console.log($('#' + textid + 'muninfo').length);
- if ($('#' + textid + 'muninfo').length < 1 || $('#' + textid + 'muninfo').val() != 1 || $('#' + textid + 'muninfo').val() == undefined) {
- $.get(requesturl('gettext'), $('#addform').serialize(), function (r) {
- $html = '<label class="layui-form-label">文字设置:</label><div class="layui-input-block lanmu"><label>颜色</label><div id="' +
- textid +
- 'bt" style="margin-left:10px;"></div><input onblur="savetxt()" id="' +
- textid +
- 'color" name="color" type="hidden" value="' +
- (r.color ? r.color : '#000000') +
- '" /></br><div class="numitems"><label>字体大小</label><input onblur="savetxt()" type="number" id="' +
- textid +
- 'size" name="size" class="layui-input fountsizes" value="' +
- (r.size ? r.size : 16) +
- '" style="margin-left:10px;" /><span style="margin-left: 100px">px</span></div></br><div class="numitems"><label>位置 </label>X:<input onblur="savetxt()" type="number" id="' +
- textid +
- 'x" name="x" class="layui-input fountsizes" value="' +
- (r.x ? r.x : 0) +
- '" style="margin-left:10px;" /></div></br><div class="numitems">位置 Y:<input onblur="savetxt()" type="number" id="' +
- textid +
- 'y" name="y" class="layui-input fountsizes" value="' +
- (r.y ? r.y : 0) +
- '" style="margin-left:10px;" /></div></br>';
- if (r.texttypes > 0 || tps > 0) {
- $html += '<div class="numitems">' +
- (r.title ? r.title : ($('#settitle').val() ? $('#settitle').val() : '文字')) +
- '</div>'
- } else {
- $html += '<div class="numitems">自定义文字:<input onblur="savetxt()" type="text" id="' +
- textid +
- 'txt" name="txt" class="layui-input fountsizes" value="' +
- (r.title ? r.title : ($('#settitle').val() ? $('#settitle').val() : '文字')) +
- '" style="margin-left:10px;width: 150px !important;" /></div>'
- }
- $html += '</div></br><input type="hidden" value="1" name="' +
- textid +
- 'muninfo" id="' +
- textid +
- 'muninfo" /><a href="javascript:;" onclick="deltext()" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-left: 110px;margin-bottom: 100px;">删除元素</a>'
- $('#posternum').html($html);
- $('#texttypes').val(r.texttypes ? r.texttypes : tps);
- $('#settitle').val(r.title ? r.title : ($('#settitle').val() ? $('#settitle').val() : '文字'));
- setcolor(textid, r.color ? r.color : '#000000');
- });
- }
- udraggables(textid);
- }
- function setcolor(textid, colors = '#000000') {
- layui.use('colorpicker', function () {
- var colorpicker = layui.colorpicker;
- colorpicker.render({
- elem: '#' + textid + 'bt',
- color: colors,
- done: function (color) {
- $('#' + textid + 'color').val(color);
- $('#' + textid).css("color", color);
- $('#setvalue').val(textid);
- savetxt();
- },
- });
- });
- }
- function savetxt() {
- $.post(requesturl('settext'), $('#addform').serialize(), function (r) {
- getposter();
- });
- }
- function saveimg() {
- $.post(requesturl('saveimage'), $('#addform').serialize(), function (r) {
- getposter();
- });
- }
- function udraggables(textid) {
- $('#' + textid).udraggable({
- distance: 0,
- containment: 'parent',
- disable: true,
- start: function () {
- $('#setvalue').val(textid);
- $('#textvalue').val(textid);
- },
- positionElement: function ($el, dragging, x, y) {
- if (dragging) {
- $el.css({
- left: 'auto',
- top: 'auto',
- transform: 'translate(' + x + 'px,' + y + 'px)',
- });
- $('#' + textid + 'x').val(x);
- $('#' + textid + 'y').val(y);
- } else {
- $el.css({
- left: x,
- top: y,
- transform: 'none',
- });
- $('#' + textid + 'x').val(x);
- $('#' + textid + 'y').val(y);
- $('#setvalue').val(textid), $.post(requesturl('settext'), $('#addform').serialize(), function (r) {
- $('#textvalue').val(textid);
- $("#" + textid).addClass("selects");
- getposter();
- });
- }
- }
- });
- }
- function deltext() {
- layer.msg('你确定删除?删除后不可恢复', {
- time: 0 //不自动关闭
- , btn: ['删除', '取消']
- , yes: function (index) {
- layer.close(index);
- $.post(requesturl('deltext'), $('#addform').serialize(), function (r) {
- $("#" + $('#setvalue').val()).remove();
- $('#posternum').html("");
- getposter();
- });
- }
- });
- }
- function delimg() {
- layer.msg('你确定删除?删除后不可恢复', {
- time: 0 //不自动关闭
- , btn: ['删除', '取消']
- , yes: function (index) {
- layer.close(index);
- $("#" + $('#setvalue').val()).remove();
- $('#qrcode').html("");
- $('.settexts').removeClass("selects");
- $('.setimgs').removeClass("selectimgs");
- $('#qrcode-x').val(0)
- $('#qrcode-y').val(0)
- }
- });
- }
- function setimg(textid, title, tps = 0) {
- var thistimes = new Date();
- var tpsnum = '';
- if(!$('#bg-img-id').val()){
- layer.msg('请上传背景图');
- return;
- }
- if ($('#' + textid).length > 0 && tps == 1) {
- layer.msg('元素已存在');
- return;
- } else {
- if (tps == 0) {
- var thistimes = new Date();
- tpsnum = thistimes.getHours().toString() + thistimes.getMinutes().toString() + thistimes.getSeconds().toString();
- }
- }
- $('.box_left').prepend('<div class="setimgs" id="' + textid + tpsnum + '"><img src="'+localStorage.getItem("staticDomain")+'/admin/images/qrcode.png'+'" style="width:' + 80/ratio + 'px;height:' + 80/ratio + 'px;" onclick="imgstyle(\'' + textid + tpsnum + '\')" class="setimgsrc" id="' + textid + tpsnum + 'img" /></div>');
- imgstyle(textid + tpsnum);
- $('#setvalue').val(textid + tpsnum);
- $('#settitle').val(title);
- }
- function imgstyle(textid) {
- if ($('#' + textid + 'muninfo').length > 0 || $('#' + textid + 'muninfo').val() > 0 || $('#' + textid + 'muninfo').val() != undefined) {
- setTimeout(function () {
- loadimg(textid);
- }, 100);
- }
- $('.settexts').removeClass("selects");
- $('.setimgs').removeClass("selectimgs");
- $('#setvalue').val(textid);
- $('#textvalue').val(textid);
- $('#' + textid).addClass("selectimgs");
- // return;
- // $.get(requesturl('getimg'), $('#addform').serialize(), function (r) {
- $('#posternum').html(
- '<label class="layui-form-label">图片设置:</label><input id="' +
- textid + 'savepath" name="savepath" type="hidden" value="https://dev.iduomi.cc/attachment/headimg_2.jpg?time=1685440884" /><input id="' +
- textid + 'saveurl" name="saveurl" type="hidden" value="https://dev.iduomi.cc/attachment/headimg_2.jpg?time=1685440884" /></br></br><div class="numitems"><label>位置 </label>X:<input onblur="saveimg()" type="number" id="' +
- textid +
- 'x" name="x" class="layui-input fountsizes" value="' +
- ( 0) +
- '" style="margin-left:10px;" /></div></br><div class="numitems">位置 Y:<input onblur="saveimg()" type="number" id="' +
- textid +
- 'y" name="y" class="layui-input fountsizes" value="' +
- (0) +
- '" style="margin-left:10px;" /></div></br><div class="numitems">宽度 :<input onblur="saveimg()" type="number" id="' +
- textid +
- 'width" name="width" class="layui-input fountsizes" value="' +
- (80) +
- '" style="margin-left:10px;" /></div></br><div class="numitems">高度 :<input onblur="saveimg()" type="number" id="' +
- textid +
- 'height" name="height" class="layui-input fountsizes" value="' +
- (80) +
- '" style="margin-left:10px;" /></div></br></div></br><input type="hidden" value="1" name="' +
- textid +
- 'muninfo" id="' +
- textid +
- 'muninfo" /><a href="javascript:;" onclick="delimg()" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-left: 110px;margin-bottom: 100px;">删除元素</a>'
- );
- setcolor(textid, '#000000');
- // });
- udraggableimgs(textid);
- }
- function udraggableimgs(textid) {
- $('#' + textid).udraggable({
- distance: 15,
- containment: 'parent',
- disable: true,
- start: function () {
- $('#setvalue').val(textid);
- $('#textvalue').val(textid);
- },
- positionElement: function ($el, dragging, x, y) {
- if (dragging) {
- $el.css({
- left: 'auto',
- top: 'auto',
- transform: 'translate(' + x + 'px,' + y + 'px)',
- });
- $('#' + textid + '-x').val(x);
- $('#' + textid + '-y').val(y);
- } else {
- $el.css({
- left: x,
- top: y,
- transform: 'none',
- });
- $('#' + textid + '-x').val(x);
- $('#' + textid + '-y').val(y);
- // $('#setvalue').val(textid);
- // $('#textvalue').val(textid);
- $("#" + textid).addClass("selectimgs");
- }
- }
- });
- }
- function loadimg(textid) {
- // console.log(textid)
- var upurl = requesturl('upimage');
- layui.use(['upload', 'element', 'layer'], function () {
- var upload = layui.upload,
- element = layui.element,
- form = layui.form,
- layer = layui.layer;
- console.log(textid)
- var uploadInst = upload.render({
- elem: '#' + textid + 'upimg',
- data: form.val('addform'),
- url: upurl,
- done: function (res) {
- console.log(res);
- if (res.code != 1) {
- return layer.msg('上传失败');
- } else {
- $('#' + textid + 'upimg').attr("src", res.saveurl);
- $('#' + textid + 'img').attr("src", res.saveurl);
- $('#' + textid + 'savepath').val(res.savepath);
- $('#' + textid + 'saveurl').val(res.saveurl);
- $('#setvalue').val(textid), $.post(requesturl('saveimage'), $('#addform').serialize(), function (r) {
- $('#textvalue').val(textid);
- $("#" + textid).addClass("selectimgs");
- getposter();
- });
- }
- },
- error: function () {
- return layer.msg('上传失败');
- },
- });
- });
- }
- function saveall() {
- getposter();
- }
- function showposter(ids,types){
- var title='输入职位ID,并确认!请在职位处获取ID';
- if(types==2){
- title='输入简历ID,并确认!请在简历处获取ID';
- }
- layer.prompt({title: title, formType: 3}, function(text, index){
- layer.close(index);
- $.get(requesturl('showposter'),{ids:ids,postids:text} , function (r) {
- if(r.code>0){
- layer.msg(r.data);
- } else {
- layer.open({
- type: 1,
- title: '海报预览',
- shadeClose: true,
- shade: 0.8,
- area: ['395px', '737px'],
- content: '<img style="width:375px;height:667px;margin-left: 10px;margin-top:10px;" src="'+r.data+'" />',
- });
- }
- });
- });
- }
- </script>
- </body>
- </html>
|