123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626 |
- {extend name="public/layout"/} {block name="title"}VR楼书{/block} {block name="body"}
- <link rel="stylesheet" href="__STATIC__/css/csspc.css">
- <link rel="stylesheet" href="__STATIC__/css/font.css">
- <style type="text/css">
- html,body{height: 100%;min-width:1110px;}
- .body{background: #fff;height: 100%;overflow-y:auto;width:100%;box-sizing: border-box;padding: 25px;}
- .layui-form-box .layui-form-label{width:136px;text-align: right;float:left;line-height: 46px;padding: 0 10px;}
- .layui-form-box .layui-input-block{float:left;margin-left:0;max-width: 25%;width: 100%;}
- .layui-input{height: 46px;}
- .addImages {display: inline-block;width: 145px !important;height:87px !important;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border: 1px dashed darkgray;background: #f8f8f8;position: relative;overflow: hidden;}
- .addImages .upload_ico{font-size: 50px;color:#28A1FF;margin-top: 5px;display: inline-block;}
- .imageDiv div {width: 100%;height: 100%;position: absolute;top: 0px;background-color: #e6e6e600;}
- .imageDiv div:hover {background-color: #e6e6e680;}
- .imageDiv div:hover i {display: block;cursor: pointer;}
- .text-detail{text-align: center;}
- .imageDiv div i{display: none; font-size: 31px;line-height: 142px;text-align: center;}
- .isshow{display: none;}
- .vrdelbtn{height: 46px;}
- .lanse{color:#28A1FF;}
- .addlp_top .layui-form-item{float:left;width:32.33%;box-sizing: border-box;clear: none;}
- .addlp_top .layui-input-block{max-width:58%;}
- .time-ico{left:3%;top:31%;color:#999;}
- .layui-input-li{border:1px solid #e6e6e6;height: 44px;}
- .layui-form-box .layui-form-label{width:110px;}
- .relative {
- position: relative;
- }
- .noneClass {
- display: none !important;
- }
- .li_active {
- font-weight: 700;
- background-color: #249EFB;
- color: #fff;
- }
- .c_wordlist {
- width: 20px;
- position: absolute;
- top: 43px;
- left: 279px;
- display: flex;
- flex-direction: column;
- z-index: 99999;
- height: auto;
- justify-content: flex-start;
- align-items: center;
- box-sizing: border-box;
- padding: 4px 0px;
- overflow: hidden;
- max-height: 297px;
- -ms-overflow-style: none;
- /* IE 10+ */
- scrollbar-width: none;
- /* Firefox */
- overflow-y: scroll;
- background-color: #f5f5f5;
- }
- .c_wordlist::-webkit-scrollbar {
- display: none;
- /* Chrome Safari */
- }
- .c_wordlist>li {
- width: 20px;
- height: 37px;
- cursor: pointer;
- display: flex;
- justify-content: center;
- align-items: center;
- margin-bottom: 0px;
- line-height: 37px;
- }
- dd {
- border-bottom: 1px solid #EFEFEF;
- }
- .layui-anim-upbit {
- -ms-overflow-style: none;
- /* IE 10+ */
- scrollbar-width: none;
- /* Firefox */
- overflow-y: scroll;
- background-color: #fff;
- }
- .layui-anim-upbit::-webkit-scrollbar {
- display: none;
- /* Chrome Safari */
- }
- .layui-icon {
- font-size: 24px !important;
- line-height: 46px;
- }
- .adding {
- cursor: pointer;
- }
- .layui-form-select dl {
- width: 100% !important;
- }
- .imageDiv {
- display: inline-block;
- width: 145px;
- height: 87px;
- -webkit-box-sizing: border-box;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- border: 1px dashed darkgray;
- background: #f8f8f8;
- position: relative;
- overflow: hidden;
- margin-right: 10px;
- }
- .imageDiv div {
- width: 100%;
- height: 100%;
- position: absolute;
- top: 0px;
- background-color: #e6e6e600;
- }
- .imageDiv div:hover {
- background-color: #e6e6e680;
- }
- .imageDiv div:hover i {
- display: block;
- cursor: pointer;
- }
- .text-detail {
- text-align: center;
- }
- .imageDiv div i {
- display: none;
- font-size: 31px;
- line-height: 90px;
- text-align: center;
- }
- </style>
- <body>
- <div class="body">
- <form class="layui-form layui-form-box font14">
-
- <div class=" addlp_top">
- <div class="layui-form-item relative">
- <label class="layui-form-label" style="width: 110px;"><i style="color:red;">*</i> 小区:</label>
- <!-- <div class="layui-input-block">
- <input type="text" name="name" required lay-verify="required" placeholder="请输入小区名称" autocomplete="off" class="layui-input" value="{$data['name']}">
- </div> -->
- <div class="layui-input-inline" id="box212">
- <select name="community_id" id="label" lay-verify="required" value="{$data['community_id']}" lay-search>
- <option value="">请选择小区</option>
- {notempty name="communities"}
- {volist name="communities.arr" id="vo"}
- {if $data['community_id']==$vo.id}
- <option data-py="{$vo.s}" value="{$vo.id}" selected>{$vo.name}</option>
- {else /}
- <option data-py="{$vo.s}" value="{$vo.id}">{$vo.name}</option>
- {/if}
- {/volist}
- {/notempty}
- </select>
- </div>
- <ul class="c_wordlist noneClass">
- {notempty name="communities"}
- {volist name="communities.sort" id="vo"}
- <li data-py="{$vo}">{$vo}</li>
- {/volist}
- {/notempty}
- </ul>
- <i class="layui-icon layui-icon-add-circle adding" id="community-add"></i>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label"><!--<i style="color:red;">*</i>--> 交房时间:</label>
- <div class="layui-input-block layui-input-li">
- <i class="fa fa-calendar-minus-o wpsa time-ico" aria-hidden="true"></i>
- <input type="text" class="pdl40 huise999 ds" name="duetime" id="time_date" placeholder="请选择时间" autocomplete="off" class="layui-input" value="{$data['duetime']}">
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label"><i style="color:red;">*</i> 地址:</label>
- <div class="layui-input-block">
- <input type="text" name="address" value="{$data['address']}" required lay-verify="required" placeholder="请输入地址" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label"> 签约户数:</label>
- <div class="layui-input-block">
- <input type="number" name="sign_num" min="0" value="{$data['sign_num']}" id="sign_num" required placeholder="请填写签约户数" autocomplete="off" class="layui-input" onkeyup="value=zhzs(this.value)">
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label"> 开工户数:</label>
- <div class="layui-input-block">
- <input type="number" name="start_num" id="start_num" min="0" value="{$data['start_num']}" required placeholder="请填写开工户数" autocomplete="off" class="layui-input" onkeyup="value=zhzs(this.value)">
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label"> 完工户数:</label>
- <div class="layui-input-block">
- <input type="number" name="finish_num" id="finish_num" min="0" value="{$data['finish_num']}" required placeholder="请填写完工户数" autocomplete="off" class="layui-input" onkeyup="value=zhzs(this.value)">
- </div>
- </div>
-
- </div>
-
- <div class="layui-form-item mdt20">
- <label class="layui-form-label"><i style="color:red;">*</i> 图片:</label>
- <div class="layui-input-block" style="max-width: 50%;">
- <div class="picDiv" id="draggable" style="margin: 20px 0px;">
- {volist name='data.cover' id='vo'}
- <div class="imageDiv">
- <img style="width:100%;height:100%" class="layui-upload-img" src="{$vo}" alt="">
- <div class="imgDivico"><i class="layui-icon layui-icon-delete" prop="del"></i> <i class="layui-icon layui-icon-search" prop="view" data-image="{$vo}" style="margin-left:25px;"></i></div>
- <input type="hidden" name="img_exist[]" value="{$vo}" />
- </div>
- {/volist}
- <div class="addImages" id="img">
- <div class="text-detail">
- <i class="layui-icon upload_ico"></i>
- <p>选择单、多图</p>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label"></label>
- <div style="margin-left: 108px;"><i style="color:red;margin-right: 5px;">*</i><span>注:不支持拖拽文件 宽:高=5:3</span></div>
- </div>
- <div class="layui-form-item mdt20">
- <label class="layui-form-label">分享封面:</label>
- <div class="layui-input-block" style="max-width: 776px">
- <div style="margin: 20px 0px;overflow: hidden;" id="cover_share_img" class="images-op">
- {if $data.cover_share_img}
- <div class="imageDiv">
- <img src="{$data.cover_share_img}" alt="" style="width:100%;height:100%;">
- </div>
- {else/}
- <div class="addImages">
- <div class="text-detail">
- <i class="layui-icon upload_ico"></i>
- <p>请选择分享封面</p>
- </div>
- </div>
- {/if}
- </div>
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label"></label>
- <div style="margin-left: 109px;"><i style="color:red;margin-right: 5px;">*</i><span>注:不支持拖拽文件 宽:高=5:4</span></div>
- </div>
- <div class="layui-form-item woverflow mdt20">
- <label class="layui-form-label">VR类型:</label>
- <div class="layui-input-block lh45 mdl20" style="max-width: 400px !important;">
- {if $data.vr}
- <input type="radio" id="1" class="radio_input" lay-filter="types" name="type" value="vr"
- title="VR链接" checked>
- <input type="radio" id="2" class="radio_input" lay-filter="types" name="type" value="group"
- title="VR作品">
- {elseif($data.vr_group_ids)/}
- <input type="radio" id="1" class="radio_input" lay-filter="types" name="type" value="vr"
- title="VR链接">
- <input type="radio" id="2" class="radio_input" lay-filter="types" name="type" value="group"
- title="VR作品" checked>
- {else/}
- <input type="radio" id="1" class="radio_input" lay-filter="types" name="type" value="vr"
- title="VR链接" checked>
- <input type="radio" id="2" class="radio_input" lay-filter="types" name="type" value="group"
- title="VR作品">
- {/if}
- </div>
- </div>
- {if $data.vr}
- <div class="layui-form-item mdt40 vrlinkEle">
- <label class="layui-form-label">小区VR链接:</label>
- <div class="layui-input-block">
- <input type="text" name="vr_link" value="{$data['vr_link']}" placeholder="请输入VR链接" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="vrAuthEle layui-hide">
- <label class="layui-form-label">VR作品</label>
- <div class="layui-input-inline" style="width: 400px;display: block;">
- <a class="layui-btn btn layui-border-btn" style="margin-top: 5px;" id="selectVRCreate" href="javascript:void(0);">选择VR作品</a>
- <span id="vrWorks"></span>
- </div>
- </div>
- {elseif($data.vr_group_ids)/}
- <div class="layui-form-item mdt40 vrlinkEle layui-hide">
- <label class="layui-form-label">小区VR链接:</label>
- <div class="layui-input-block">
- <input type="text" name="vr_link" value="{$data['vr_link']}" placeholder="请输入VR链接" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="vrAuthEle">
- <label class="layui-form-label">VR作品</label>
- <div class="layui-input-inline" style="width: 400px;display: block;">
- <a class="layui-btn btn layui-border-btn" style="margin-top: 5px;" id="selectVRCreate" href="javascript:void(0);">选择VR作品</a>
- <span id="vrWorks">{$data.group_name}</span>
- </div>
- </div>
- {else/}
- <div class="layui-form-item mdt40 vrlinkEle">
- <label class="layui-form-label">小区VR链接:</label>
- <div class="layui-input-block">
- <input type="text" name="vr_link" value="{$data['vr_link']}" placeholder="请输入VR链接" autocomplete="off" class="layui-input">
- </div>
- </div>
- <div class="vrAuthEle layui-hide">
- <label class="layui-form-label">VR作品</label>
- <div class="layui-input-inline" style="width: 400px;display: block;">
- <a class="layui-btn btn layui-border-btn" style="margin-top: 5px;" id="selectVRCreate" href="javascript:void(0);">选择VR作品</a>
- <span id="vrWorks"></span>
- </div>
- </div>
- {/if}
- <div class="layui-form-item woverflow mdt40">
- <label class="layui-form-label"><i style="color:red;">*</i> 简介:</label>
- <div class="layui-input-block mdl20 wleft" style="max-width: 70%;">
- <textarea name="content" id="content" required lay-verify="required" rows="10" autocomplete="off" class="layui-textarea width100_ pdtb15">{$data['content']}</textarea>
- </div>
- </div>
-
- <div class="mdt50 mdl110">
- <button type="button" class="layui-btn layui-btn-normal layuiSubmit pdlr30" lay-submit lay-filter="building-submit" id="building-submit">保存</button>
- </div>
-
- </form>
- </div>
- </body>
- {/block} {block name="js"}
- <script src="__STATIC__/layui/layui/lay/modules/xm-select.js" type="text/javascript" charset="utf-8"></script>
- <script type="text/javascript">
- //转化正整数
- function zhzs(value){
- value = value.replace(/[^\d]/g,'');
- if(''!=value){
- value = parseInt(value);
- }
- return value;
- }
- </script>
- <script>
- layui.config({
- base: '__LAYUI__/',
- urlbase: '/sys'
- }).extend({
- index: 'lib/index' //主入口模块
- }).use(['index','element','upload','laydate','form'], function() {
- var $ = layui.$,
- layer = layui.layer,
- upload = layui.upload,
- form = layui.form,
- element = layui.element,
- laydate = layui.laydate;
- files = [];
- var vrlinkVal = '';
- laydate.render({
- elem: '#time_date'
- ,format: 'yyyy-MM-dd',
- trigger: 'click'
- });
- //拖拽上传
- // upload.render({
- // elem: '#anlicoverimg',
- // accept: 'image',
- // exts: 'jpg|png|bmp|jpeg|JPG|PNG|BMP|JPEG',
- // auto: false,
- // field: 'cover',
- // size: 1 * 1024,
- // choose: function(obj) {
- // obj.preview(function(index, file, result) {
- // $('#anlicoverimg').html('<img src="' + result + '" style="height: 100%;width:100%;">');
- // });
- // }
- // });
- //多图片上传
- upload.render({
- elem: '#img',
- accept: 'images',
- url: '/upload/',
- exts: 'jpg|png|bmp|jpeg|JPG|PNG|BMP|JPEG',
- field: 'img',
- size: 5 * 1024,
- auto: false,
- multiple: true,
- choose: function(obj) {
- files = obj.pushFile();
- length = $('.imageDiv').length;
- obj.preview(function(index, file, result) {
- length++;
- if(length > 9) {
- if(length == 10) layer.msg('限制九张图片以下');
- delete files[index];
- } else {
- $('.picDiv').prepend('<div class="imageDiv" data-id="' + index + '"><img src="' + result + '" alt="' + file.name + '" class="layui-upload-img" width="100%" height="100%"><div><i class="layui-icon layui-icon-delete" prop="del"></i> <i class="layui-icon layui-icon-search" prop="view" data-image="'+result+'" style="margin-left:25px;"></i></div></div>');
- }
- });
- }
- });
- upload.render({
- elem: '#cover_share_img',
- accept: 'images',
- url: '{:url("fileupload")}',
- exts: 'jpg|png|bmp|jpeg|JPG|PNG|BMP|JPEG',
- field: 'cover_share_img',
- size: 5 * 1024,
- auto: false,
- choose: function(obj) {
- obj.preview(function(index, file, result) {
- $('#cover_share_img').html('<div class="imageDiv"><img src="' + result + '" alt="' + file.name + '" class="layui-upload-img" width="100%" height="100%"></div>');
- });
- }
- });
- form.on('radio(types)', function (data) {
- if (data.value == 'vr') {
- $(".vrlinkEle").removeClass('layui-hide');
- $(".vrAuthEle").addClass('layui-hide');
- } else {
- $(".vrlinkEle").addClass('layui-hide');
- $(".vrAuthEle").removeClass('layui-hide');
- }
- });
- //vr作品
- $('#selectVRCreate').click(function(){
- layer.open({
- type: 2,
- title: ['选择VR作品', 'color:#333333;background-color:#D8E6F1;'],
- content: '{:url("building/group")}?id=' + "{$data.vr_group_ids}",
- area: ['80%', '80%'],
- btn: ['确定', '取消'],
- yes: function (index, layero) {
- let data = layero.find('iframe').contents().find("#hiddentext").val();
- if (data) {
- let vrObject = JSON.parse(data);
- vrlinkVal = vrObject.id;
- $("#vrWorks").text(vrObject.name);
- }
- layer.close(index);
- //点击确认触发 iframe 内容中的按钮提交
- }
- });
- })
- $('.picDiv').on('click', 'i', function(e) {
- var that = this;
- console.log(e.target)
- if (e.target.attributes[1].nodeValue === 'del') {
- layer.confirm('确定删除该图片么?',{title: ['信息', 'color:#333333;background-color:#D8E6F1;'],}, function(index) {
- var imgDiv = $(that).closest('.imageDiv');
- if(id = imgDiv.data('id')) {
- delete files[id];
- }
- imgDiv.remove();
- layer.close(index);
- });
- } else {
- layer.photos({ photos: {"data": [{"src": e.target.attributes[2].nodeValue}]} ,closeBtn:true});
- }
- });
-
- $(document).click((e) => {
- let c_element = $('#label').next();
- if (c_element[0].className.indexOf('layui-form-selected') < 0) {
- $('.c_wordlist').addClass('noneClass');
- }
- })
- var addcommunity = function () {
- layer.prompt({
- title: ['小区添加', 'color:#333333;background-color:#D8E6F1;'],
- }, function (value, index, elem) {
- var value = $.trim(value);
- if (value == '') {
- layer.msg('请输入小区名称', { anim: 6 });
- return false;
- }
- if (value.length > 20) {
- layer.msg('小区名称超长', { anim: 6 });
- return false;
- }
- $.post('{:url("material/apicommunityadding")}', {
- community: value
- }, function (res) {
- if (res.code == 0) {
- $('#label').append("<option selected value='" + res.data.id + "'>" + res.data.name + "</option>")
- form.render('select');
- layer.msg(res.msg, {
- anim: 0
- }, function () {
- layer.close(index); //再执行关闭
- });
- } else {
- layer.msg(res.msg, {
- anim: 6
- });
- }
- });
- });
- }
- $('#community-add').on('click', function () {
- addcommunity();
- });
- $('dd').click(() => {
- $('.c_wordlist').addClass('noneClass');
- })
- $('#box212').click(() => {
- $('.c_wordlist').toggleClass('noneClass');
- })
- let xqElement = $('.layui-anim-upbit')[0];
- xqElement.classList.add('xqElement');
- let options = [];
- let xqDatalist = $('#label').children();
- for (let i = 0; i < xqDatalist.length; i++) {
- if (xqDatalist[i].dataset.py) {
- options.push(xqDatalist[i].dataset.py)
- }
- }
- $('.c_wordlist').click((e) => {
- if (e.target.localName != 'li') {
- e.stopPropagation();
- return;
- }
- let index = 0;
- let curWord = e.target.dataset.py;
- let lilist = $('.c_wordlist').children();
- for (let i = 0; i < lilist.length; i++) {
- lilist[i].className = '';
- }
- if (parseInt(curWord) != NaN) {
- let word1 = curWord.toLowerCase();
- index = options.indexOf(word1)
- } else {
- index = options.indexOf(curWord)
- }
- setTimeout(() => {
- e.target.className = 'li_active';
- let num = index * 37 + 37;
- $('.xqElement').scrollTop(num);
- }, 50)
- e.stopPropagation();
- })
- $('.layui-select-title input').on('input',function(e) {
- if (e.target.placeholder == '请选择小区') {
- let val = $(this).val();
- if (!val) {
- $('.c_wordlist').removeClass('noneClass');
- return;
- }
- $('.c_wordlist').addClass('noneClass');
- }
- })
- //添加保存
- form.on('submit(building-submit)', function(data) {
- // if ($('.addImages').find('img').length==0) {
- // layer.msg('请选择封面图', {anim: 0,time: 1000,icon: 5});
- // return false;
- // }
- var formData = new FormData(data.form);
- Object.keys(files).forEach((v,i) => {
- formData.append(`cover[${i}]`, files[v])
- })
- if (!Object.keys(files).length && !data.field["img_exist[0]"]) {
- layer.msg('请添加图片')
- return;
- }
- if (!vrlinkVal) {
- formData.append('vr_group_ids', "{$data.vr_group_ids}");
- } else {
- formData.append('vr_group_ids', vrlinkVal);
- }
-
- // if (data.field.duetime=="" || data.field.duetime==null || data.field.duetime==undefined) {
- // layer.msg('请选择时间', {anim: 0,time: 1000,icon: 5});
- // return false;
- // }
-
- formData.append('id',{$id});
- $.ajax({
- url: '{:url("building/edit")}',
- type: 'post',
- data: formData,
- dataType: 'json',
- processData: false,
- contentType: false,
- success: function(res) {
- if(res.code === 0) {
- layer.msg(res.msg,{
- anim: 0,time: 1000,icon: 6,
- }, function() {
- var index = parent.layer.getFrameIndex(window.name);
- // parent.layui.table.reload('company-activity'); //重载表格
- parent.layer.close(index); //再执行关闭
- });
- } else {
- layer.msg(res.msg, {anim: 0,time: 1000,icon: 5});
- }
- },
- error : function(e){
- $(target).removeClass(DISABLED);
- $(target).removeAttr('disabled');
- }
- });
- return false;
- });
- })
- </script>
- {/block}
|