tianyunperfect
/
web-base--


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
							<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="css/bootstrap.css">
    <script src="js/jquery-3.2.1.js"></script>
    <script src="js/bootstrap.js"></script>
    <script src="js/vue.js"></script>
    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico"/>
    <script src="https://web.tianyunperfect.cn/simple/js/util.js"></script>
    <title>记梦模版</title>
    <script src="js/jquery.flexText.js"></script>
    <link rel="stylesheet" href="css/style.css">
    <style>
        body {
            /*padding-top: 70px;*/
        }
    </style>
</head>

<body class="container">
<br>
<div id="mydiv" data-spy="scroll" data-target="#navbar-example" data-offset="0">
    <form class="form-horizontal" role="form">
        <div class="form-group" id="time">
            <label for="dreamtime" class="col-sm-1 control-label">时间：</label>
            <div class="col-sm-2">
                <input type="date" class="form-control select" id="dreamtime" v-model="dream_time">
            </div>
        </div>
        <div class="form-group" id="method">
            <label for="dream_method" class="col-sm-1 control-label">方法：</label>
            <div class="col-sm-2">
                <input type="text" id="dream_method" class="form-control" v-model="dream_method" placeholder="回笼、暗示">
            </div>
        </div>
        <div class="form-group" id="type">
            <label class="col-sm-1 control-label">类型：</label>

            <div class="col-sm-1" v-for="(type, index) in ['普通梦','半明梦','清明梦']" :key="index">
                <label>
                    <input type="radio" :name="type" :value="type" v-model="dream_type"> {{ type }}
                </label>
            </div>
        </div>
        <div class="form-group" id="name">
            <label for="dream_name" class="col-sm-1 control-label">梦名：</label>
            <div class="col-sm-2">
                <input type="text" id="dream_name" class="form-control" v-model="dream_name" placeholder="梦的名字">
            </div>
        </div>

        <div class="form-group" id="data">
            <label for="dream_data" class="col-sm-1 control-label">内容：</label>
            <div class="col-sm-11">
                <textarea id="dream_data" class="form-control" v-model="dream_data" v-on:input="change" placeholder="你梦见什么了？"> </textarea>
            </div>
        </div>
        <div class="form-group" id="all">
            <label for="" class="col-sm-1 control-label">结果：</label>
            <div class="col-sm-11">
                <div class="dreamall">
                    <p>
                        <b>时间：</b>{{ dream_time }} ;

                        <b>方法：</b>{{ dream_method }} ;

                        <b>类型：</b>{{ dream_type }}
                        <br>
                        <b>梦名：</b>{{ dream_name }}
                        <br><br>
                        <b>内容：</b><br><span v-html="dreamdata_html">{{dreamdata_html}}</span>
                    </p>
                </div>
            </div>
        </div>
        <button type="button" @click="send">发送</button>
    </form>
</div>
<script>
    function IsBig(m) {
        if (m < 10) {
            return "0" + m;
        } else {
            return m
        }
    }

    function getDate() {
        date = new Date();
        y = date.getFullYear();
        m = date.getMonth() + 1;
        d = date.getDate();
        m = IsBig(m)
        d = IsBig(d)
        return y + "-" + m + "-" + d
    }

    function gethtml(strContent) {
        strContent = String(strContent);
        strContent = strContent.replace(/\r\n/g, '<br/>'); //IE9、FF、chrome
        strContent = strContent.replace(/\n/g, '<br/>'); //IE7-8
        strContent = strContent.replace(/\s/g, ' '); //空格处理
        return strContent;
    }

    let app = new Vue({
        el: "#mydiv",
        data: {
            dream_time: getDate(),
            dream_method: "无",
            dream_type: "普通梦",
            dream_name: "",
            dream_data: "",
            dream_summary: "",
            dreamdata_html: "",
            dreamsummary_html: "",
        },
        computed: {},
        methods: {
            change: function () {
                this.dreamdata_html = gethtml(this.dream_data);
                this.dreamsummary_html = gethtml(this.dream_summary);
            },
            //发送梦境数据
            send: function () {
                let data = {
                    content: `时间：${app.dream_time} ; 梦名：${app.dream_name} ; 方法：${app.dream_method} ; 类型：${app.dream_type}
                                ${app.dream_data}
                                #梦记`
                }
                requestUtil.async('https://memos.tianyunperfect.cn/api/v1/memo?openId=043a086f-e0a3-4711-aa79-5c3cbe89f97c', 'post', data, {'Content-type': 'application/json'}).then(res => {
                    if (res['id']) {
                        window.location.href = `https://memos.tianyunperfect.cn/m/${res['id']}`;
                    }
                });
            }

        }
    });
</script>
<script>
    $(function () {
        $("#dream_data").flexText();
        $("#dream_summary").flexText();


    });
</script>
</body>

</html>