其他分享
首页 > 其他分享> > ThinkCMF开发经验

ThinkCMF开发经验

作者:互联网

一、利用JavaScript展示图片

<img onclick="javascript:imagePreviewDialog('{:cmf_get_image_preview_url($value[\'a\'])}')" src = "{:cmf_get_image_preview_url($value['b'])}" style="max-height: 60px;max-width: 60px"/>

二、前端图片上传操作

<div class="form-group">
            <div class = "pic_num_one" style="display: none">
                <label for="banner" class="col-sm-2 control-label"><span class="form-required">*</span>弹窗图片</label>
                <div class="col-sm-10">
                    <div style="margin-bottom: 10px">
                        <input type="text" class="form-control" id="banner" name="banner"
                               style="display:none;" value="{$data['banner']}">
                        <a class="btn btn-primary"
                           href="javascript:uploadOneImage('图片上传','#banner');">上传图片</a>
                        <span style="margin-left: 10px">只能上传{:cmf_get_upload_setting()['file_types']['image']['extensions']}格式文件,文件不能超过{:intval(cmf_get_upload_setting()['file_types']['image']['upload_max_filesize'])/2048}MB</span>
                    </div>
                    <div>
                        <img id="notification_banner-preview" style="max-width:150px"
                        <notempty name="data">
                            src="{:cmf_get_image_preview_url($data['banner'])}"
                        </notempty>
                        />
                        <br>
                        <br>
                    </div>
                </div>
            </div>

该操作可以默认展示后端传回的图片url,并允许个人上传的图片url的数据发送给后端

三、利用JavaScript语言,使得前端页面可以随着按钮的点击而变换样式

html的代码为:

<div class="form-group">
            <label for="type" class="col-sm-2 control-label"><span class="text-center" style="color: #ff0000;">*</span>类型</label>
            <div class="col-md-6" id="type">
                <label class="radio-inline">
                    <input type="radio" name="type" value="1"<if condition="$notification_data.type eq 1">checked</if>>类型1
                </label>
                <label class="radio-inline">
                    <input type="radio" name="type" value="2"<if condition="$notification_data.type eq 2">checked</if>>类型2
                </label>
            </div>
        </div>

<div class="form-group pic_num_one" style="display: none;margin-left:0 ">
                <label for="title" class="col-sm-2 control-label"><span class="form-required">*</span>弹窗标题</label>
                <div class="col-sm-10">
                    <textarea type="text" class="form-control" id="title" name="title"
                              placeholder="请输入" style="width:300px;height:120px;display:inline-block;">{$notification_data['notification_title']}</textarea>
                </div>
            </div>

<div class="form-group pic_num_two" style="display: none;margin-left:0">
                <label for="desc" class="col-sm-2 control-label"><span
                        class="form-required">*</span>横幅文案</label>
                <div class="col-sm-10">
                    <textarea type="text" class="form-control" id="desc_1" name="desc_1"
                              placeholder="请输入" style="width:300px;height:120px;display:inline-block;">{$notification_data['notification_desc_1']}</textarea>
                </div>
            </div>

JavaScript的代码为:

<script>
    let pic_num = $('input[name="type"]:checked').val();
    if (pic_num === '1') {
        $('.pic_num_one').hide();
        $('.pic_num_two').show();
    } else if (pic_num === '2') {
        $('.pic_num_one').show();
        $('.pic_num_two').hide();
    }
    $('input[name="type"]').off('click').on('click', function(){
        let pic_num = $('input[name="type"]:checked').val();
        if (pic_num === '1') {
            // $('.pic_num_one').show();
            $('.pic_num_one').hide();
            $('.pic_num_two').show();
        } else if (pic_num === '2') {
            // $('.pic_num_one').hide();
            $('.pic_num_one').show();
            $('.pic_num_two').hide();
        }
    })
</script>

四、给后端的控制器传入参数

                        <a class="btn btn-sm btn-primary" href="{:url('GamefiLotteryNotification/editLotteryNotification',array('id'=>$data['id']))}">编辑</a>

url为后端的控制器的方法,array可以当作参数传递给后端

$params = $this->request->param();

五、利用Javascript获取当前页面中的文本框的值,如果需要的话可以传递给后端

<script>

    function getPreview () {
        var nft_file_url = document.getElementById("nft_file");// 这些是上述表单中的id
        var contract_id = document.getElementById("contract_id");// 这些是上述表单中的id
        var creator_uids = document.getElementById("creator_uids"); // 这些是上述表单中的id

        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function () {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("nft_info").innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.open('POST', "{:url('GamefiContract/nftPreview')}", true);
        // 3.5 POST发送请求必须设置请求头
        xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xmlhttp.send("nft_file_url="+nft_file_url.value+"&creator_uids="+creator_uids.value);
        // xmlhttp.open("GET","{:url('PresaleList/nftPreview')}",true);
        // xmlhttp.send();
    }
</script>

后端可以接受此参数:

$params = $this->request->param();

六、使用ImagIck获取图像的主色所存在的问题。

 $R = dechex($this->colorArr[0]['r']); // 这样获得的红色值的字符串长度可能只有一位
 $G = dechex($this->colorArr[0]['g']);  // 这样获得的绿色值的字符串长度可能只有一位
 $B = dechex($this->colorArr[0]['b']);   // 这样获得的蓝色值的字符串长度可能只有一位
 $dominantColor = $R . $G . $B; // 因为需要把上述的三个变量进行前缀补足
$R = dechex($this->colorArr[0]['r']);
$G = dechex($this->colorArr[0]['g']);
$B = dechex($this->colorArr[0]['b']);
if(strlen($R) == 1) {
      $R = '0'.$R; // 避免字符串前导0被自动损失的问题
}
if(strlen($G) == 1) {
			$G = '0'.$G;
}
if(strlen($B) == 1) {
      $B = '0'.$B;
}
$dominantColor = $R . $G . $B;

七、对进行查表的结果分析(判空的问题)

empty("0") //true;
empty("0.0000") false;

八、对查表操作尽量开启事务

$Model->startTrans();
try {
   $result = $Model->where([['id', '=', $requestData['id']]])->update($updateData);
   if (!$result){
       $Model->rollback();
       return ['code' => -1, 'msg' => "操作失败"];
    }
    $result = (new GamefiContractModel())->where([['id', '=', $requestData['id']]])->update($update); // update操作返回的结果比较重要
    if (!is_int($result)){
        $Model->rollback();
        return ['code' => -1, 'msg' => "操作失败"];
     }
        $Model->commit();
        return ['code' => 1, 'msg' => "操作成功"];
     } catch(\Exception $e){
        $Model->rollback();
        return ['code' => -1, 'msg' => sprintf('操作异常,请重试:ERROR %s', $e->getMessage())];
    }

标签:经验,xmlhttp,url,ThinkCMF,pic,dechex,num,开发,id
来源: https://www.cnblogs.com/success-zh/p/16612917.html