{extend name="common/base"/}
{block name="style"}
<style>
  .layui-layer-content{color: #2d2d2d;}

</style>
{/block}
{block name="body"}
<form class="layui-form p-4">

  <h3 class="pb-3">编辑联系函</h3>
  <table class="layui-table layui-table-form">
    <tr>
      <td class="layui-td-gray">联系函名称<font>*</font></td>
      <td>
        <input type="text" name="title" lay-verify="required" lay-reqText="请输入文档名称" placeholder="请输入文档名称" class="layui-input" value="{$detail.title}">
      </td>
    </tr>
    <tr>
      <td class="layui-td-gray" style="vertical-align:top;">联系函内容<font>*</font></td>
      <td colspan="5">
        <textarea name="content" placeholder="请输入内容"  class="layui-textarea" id="container_content" style="border:0;padding:0">{$detail.content}</textarea>
      </td>
    </tr>

  </table>
  <div class="pt-3">
    <input type="hidden" name="id" value="{$detail.id}" />
    <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webform">立即提交</button>
    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
  </div>
</form>

<div class="layui-card border-y">
    <div class="layui-card-header" style="height:45px;">
        <div class="layui-row">
            <div class="layui-col-md6">
                <strong>联系函附件</strong>
            </div>
            <div class="layui-col-md6" style="text-align:right">
                <button type="button" class="layui-btn layui-btn-normal layui-btn-sm" id="uploadBtn">上传附件</button>
            </div>
        </div>
    </div>
    <div class="layui-row p-2" id="fileBox">
      {:fileCard($file_array)}
      {empty name="$file_array" }
      <div class="layui-data-none">暂无附件</div>
      {/empty}
    </div>
</div>


{/block}
<!-- /主体 -->

<!-- 脚本 -->
{block name="script"}
<script>
  const moduleInit = ['tool', 'tagpicker', 'tinymce','oaTool'];

  function gouguInit() {
    var form = layui.form,tool=layui.tool,oaTool = layui.oaTool;
    var file_id = '{$detail.file}';
    //编辑器初始化
    var editor = layui.tinymce;
    var edit = editor.render({
      selector: "#container_content",
      height: 500
    });

    let a = 1;
    //监听提交
    form.on('submit(webform)', function (data) {
      layer.confirm('<div style="color:red">提交后内容将无法更改，请检查内容是否准确无误！<br>点击”确认“按钮，提交报告</div>', {
        icon: 3,
        title: '提交确认'
      },function () {
        data.field.content = tinyMCE.editors['container_content'].getContent();
        if (data.field.content == '') {
          layer.msg('请先完善文章内容');
          return false;
        }
        if(a){
          let callback = function (e) {
          parent.layui.contactTable.reload();
          layer.msg(e.msg);
          if (e.code == 0) {
            tool.tabRefresh(71);
            tool.sideClose(1000);
            a = 1
          }
        }
        data.field.file = file_id;
        tool.post("/admin/project.contact/edit_company", data.field, callback);
        }
        
      })

      a = 0
      return false;
    });

    function fileCard(item){
            var host = window.location.host;
            var li = '';
            if(item.length>0){
                for(var a=0;a<item.length;a++){
                    let image = ['jpg','jpeg','png','gif'];
                    let doc = ['doc','docx','xls','xlsx','ppt','pptx','txt','pdf','zip','rar','7z'];
                    // let down = '<a href="'+item[a].filepath+'" target="_blank" class="layui-btn layui-btn-xs layui-btn-normal" download="'+item[a].name+'">下载</a>';
                    let down ='<a href="' + item[a]['filepath'] + '" target="_blank" class="layui-btn layui-btn-xs layui-btn-normal" download="' + item[a]['name'] + '">预览</a>';
                    // 判断元素是否在数组中
                    let path='/static/home/images/icon/file.png';
                    if (image.includes(item[a].fileext)) {
                        path=item[a].filepath;
                        down = '<span data-href="'+item[a].filepath+'" class="layui-btn layui-btn-xs layui-btn-normal file-view-img">预览</span>';
                    } else if (doc.includes(item[a].fileext)){
                        path='/static/home/images/icon/'+item[a].fileext+'.png';
                    }

                    if(item[a].fileext == 'pdf'){
                        down = '<span data-href="'+item[a].filepath+'" class="layui-btn layui-btn-xs layui-btn-normal file-view-pdf">预览</span>';
                    }
                    li += '<li id="'+item[a].id+'" data-id="'+item[a].id+'" data-title="'+item[a].name+'" data-ext="'+item[a].fileext+'"><img src="'+path+'" alt="'+item[a].filename+
                        '" style="object-fit: contain;" class="file-item"><p title="'+item[a].name+'">'+item[a].name+
                        '</p><div class="layui-btn-group">'+ down +
                        '<span class="layui-btn layui-btn-xs layui-btn-danger file-del">删除</span></div></li>';
                }

                return li;
            }
        }

        var emptyCard = ' <div class="layui-data-none">暂无附件</div>'
        $('#fileBox').on('click','.file-del',function(){
            layer.confirm('确定要删除该文件吗？', { icon: 3, title: '提示' }, function (index) {
                let callback = function (e) {
                    layer.closeAll();
                    file_id = null;
                    layer.msg(e.msg);
                    $('#' + file_id).remove();
                    $("#fileBox").html(emptyCard);
                }
                tool.delete("/admin/project.contact/delete_file", {id:file_id}, callback);
            });
        })

        oaTool.addFile({
            type: 1,
            isSave: true,
            ajaxDelete: function (file_id) {
                let callback = function (e) {
                    layer.msg(e.msg);
                    var emptyCard = ' <div class="layui-data-none">暂无附件</div>'
                    file_id = null;
                    if (e.code == 0) {
                        $('#fileItem' + file_id).remove();
                        $("#fileBox").html(emptyCard);
                    }
                }
                tool.delete("/admin/project.contact/delete_file", {id: file_id}, callback);
            },
            ajaxSave: function (res) {

                let callback = function (e) {
                    layer.msg('上传成功');
                    $("#fileBox").html(fileCard(e));
                    file_id = res.data.id

                }

                tool.post("/admin/project.contact/add_file", {

                    'file': res.data.id,
                }, callback);


            }
        });
  }

</script>
{/block}