123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>layui</title>
- <meta http-equiv="pragma" content="no-cache"/>
- <meta http-equiv="cache-control" content="no-cache,must-revalidate"/>
- <meta http-equiv="expires" content="0"/>
- <meta name="renderer" content="webkit">
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
- {% include '/common/layui_css.html' %}
- <link rel="stylesheet" href="/static/lib/layuimini-2/js/lay-module/step-lay/step.css" media="all">
- <style>
- body {
- background-color: #ffffff;
- }
- .lay-step {
- padding-left: 100px!important;
- }
- .layui-form-select dl {
- max-height: 200px;
- }
- .layui-form-label {
- width: 80px;
- }
- .layui-form-label.required:after {
- content: ' *';
- color: red;
- }
- </style>
- </head>
- <body>
- <div>
- <div class="layuimini-main">
- <div class="layui-fluid">
- <div class="layui-card-body">
- <div class="layui-carousel" id="stepForm" lay-filter="stepForm" style="margin: 0 auto;">
- <div carousel-item>
- <div>
- <form class="layui-form" style="margin: 0 auto;padding-top: 20px;">
- <div class="layui-form-item">
- <label class="layui-form-label required">指标名称:</label>
- <div class="layui-input-block">
- <input type="text" name="name" placeholder="请填写入指标名称" class="layui-input" lay-verify="required" value="新指标001" />
- </div>
- </div>
-
- <div class="layui-form-item">
- <label class="layui-form-label">所在平台:</label>
- <div class="layui-input-inline" style="width:300px;">
- <select name="type" lay-verify="required">
- <option value=""></option>
- {% for pt in ptxx_list %}
- <option value="{{pt.id}}">{{pt.name}}</option>
- {% endfor %}
- </select>
- </div>
- </div>
-
- <div style="text-align: center;">
- <div class="layui-input-block" style="margin-left:0;">
- <button type="button" class="layui-btn layui-btn-primary exit">关闭</button>
- <button class="layui-btn" lay-submit lay-filter="formStep">下一步</button>
- </div>
- </div>
- </form>
- </div>
- <div>
- <form class="layui-form" style="margin: 0 auto;padding-top: 20px;">
- <div class="layui-form-item">
- <label class="layui-form-label required">app_id:</label>
- <div class="layui-input-block">
- <input type="text" name="app_id" placeholder="" class="layui-input" lay-verify="required" value="maomingywtg_4409" />
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label required">app_secret</label>
- <div class="layui-input-block">
- <input type="text" name="app_secret" placeholder="" class="layui-input" lay-verify="required" value="3pfe0wne6yp7iYyghgzIrPiL7RT25k" />
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label required">passid:</label>
- <div class="layui-input-block">
- <input type="text" name="passid" placeholder="" class="layui-input" lay-verify="required" value="C90-44001100" />
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label required">passtoken:</label>
- <div class="layui-input-block">
- <input type="text" name="passtoken" placeholder="" class="layui-input" lay-verify="required" value="f94a69b96ff74f1e8bd0b4dac0d4f28e" />
- </div>
- </div>
- <div class="layui-form-item">
- <label class="layui-form-label required">service_id:</label>
- <div class="layui-input-block">
- <input type="text" name="service_id" placeholder="" class="layui-input" lay-verify="required" value="" autocomplete="off" />
- </div>
- </div>
- <div style="text-align: center;">
- <div class="layui-input-block" style="margin-left:0;">
- <button type="button" class="layui-btn layui-btn-primary pre">上一步</button>
- <button class="layui-btn" lay-submit lay-filter="formStep2">下一步</button>
- </div>
- </div>
- </form>
- </div>
- <div>
- <form class="layui-form" style="margin: 0 auto;padding-top: 20px;">
- <div style="margin-bottom: 20px;">
- <div class="x-ce-xace-container" id="jscript-editor" style="height: 300px;width:100%;"></div>
- </div>
- <div style="text-align: center;">
- <div class="layui-input-block" style="margin-left:0;">
- <button type="button" class="layui-btn layui-btn-primary pre">上一步</button>
- <button class="layui-btn" lay-submit lay-filter="formStep3">确认保存</button>
- </div>
- </div>
- </form>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- {% include '/common/layui_js.html' %}
- <script>
- var post_url = "{{post_url}}";
- var editor;
- layui.use(['form', 'step', 'xAce'], function () {
- var $ = layui.jquery,
- form = layui.form,
- xAce = layui.xAce,
- step = layui.step,
- layer = layui.layer;
- step.render({
- elem: '#stepForm',
- filter: 'stepForm',
- width: '100%',
- stepWidth: '500px',
- height: '400px',
- stepItems: [{
- title: '基本信息'
- }, {
- title: '平台参数'
- }, {
- title: '数据处理'
- }]
- });
- form.on('submit(formStep)', function (data) {
- step.next('#stepForm');
- return false;
- });
- form.on('submit(formStep2)', function (data) {
- $.get("/static/js/blank.js?rnd="+new Date(), function(data, status) {
- xAce.render({
- id: "jscript-editor",
- theme: 'eclipse',
- lang: "javascript",
- initValue: data,
- readOnly: false
- }).then(res => {
- editor = res;
- step.next('#stepForm');
- return false;
- });
- }, "text");
- return false;
- });
- form.on('submit(formStep3)', function (data) {
- var param = {
- name: $("input[name='name']").val(),
- type: $("select[name='type']").val()
- };
- if (param['type'] == 'ztn_data') {
- param['app_id'] = $("input[name='app_id']").val();
- param['app_secret'] = $("input[name='app_secret']").val();
- param['passid'] = $("input[name='passid']").val();
- param['passtoken'] = $("input[name='passtoken']").val();
- param['service_id'] = $("input[name='service_id']").val();
- }
- param['params'] = editor.getValue();
- console.log(param);
-
- $.post(post_url, JSON.stringify(param), function(r) {
- if(r.ret == 0) {
- var iframeIndex = parent.layer.getFrameIndex(window.name);
- parent.layer.close(iframeIndex);
- }
- else {
- layer.alert(r.msg, { icon: 2 });
- }
- return false;
- });
- return false;
- });
- $('.exit').click(function () {
- var iframeIndex = parent.layer.getFrameIndex(window.name);
- parent.layer.close(iframeIndex);
- });
- $('.pre').click(function () {
- step.pre('#stepForm');
- });
- $('.next').click(function () {
- step.next('#stepForm');
- });
- });
- </script>
- </body>
- </html>
|