UtilitechAS.amsreader-firmware/web/mqtt.html

    <form method="post" action="/save">
        <input type="hidden" name="mqc" value="true"/>
        <div class="my-3 p-3 bg-white rounded shadow">
            <h6>MQTT</h6>
            <label class="m-2"><input id="m" type="checkbox" name="m" value="true" {m}/> Enable</label>
            <div class="row">
                <div class="col-xl-4 col-lg-5 col-md-6">
                    <div class="m-2 input-group input-group-sm">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Host</span>
                        </div>
                        <input type="text" class="form-control mc" name="h" value="{h}" maxlength="127"/>
                    </div>
                </div>
                <div class="col-xl-2 col-lg-3 col-md-3 col-sm-4">
                    <div class="m-2 input-group input-group-sm">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Port</span>
                        </div>
                        <input id="p" type="number" class="form-control mc" name="p" value="{p}" min="1024" max="65535" placeholder="1883"/>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4 col-md-6 col-sm-8">
                    <div class="m-2 input-group input-group-sm">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Client ID</span>
                        </div>
                        <input type="text" class="form-control mc" name="i" value="{i}" maxlength="31"/>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4 col-md-6">
                    <div class="m-2 input-group input-group-sm">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Publish topic</span>
                        </div>
                        <input type="text" class="form-control mc" name="t" value="{t}" maxlength="63"/>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4 col-md-6 col-sm-6">
                    <div class="m-2 input-group input-group-sm">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Username</span>
                        </div>
                        <input type="text" class="form-control mc" name="u" value="{u}" maxlength="127"/>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4 col-md-6 col-sm-6">
                    <div class="m-2 input-group input-group-sm">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Password</span>
                        </div>
                        <input type="password" class="form-control mc" name="pw" value="{pw}" maxlength="255"/>
                    </div>
                </div>
                <div class="col-lg-3 col-md-4 col-sm-6">
                    <div class="m-2 input-group input-group-sm">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Payload</span>
                        </div>
                        <select id="f" class="form-control mc" name="f">
                            <option value="0" {f0}>JSON</option>
                            <option value="1" {f1}>Raw (minimal)</option>
                            <option value="2" {f2}>Raw (full)</option>
                            <option value="3" {f3}>Domoticz</option>
                        </select>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6 f3-s">
                    <div class="m-2">
                        <a href="/domoticz" class="btn btn-sm btn-outline-secondary">Configuration</a>
                    </div>
                </div>
            </div>
        </div>
        <div class="my-3 p-3 bg-white rounded shadow">
            <div class="row">
                <div class="col-md-2">
                    <label class="m-2"><input id="s" type="checkbox" name="s" value="true" {s}/> SSL</label>
                </div>
                <div class="col-lg-2 col-md-3">
                    <div class="m-2 input-group input-group-sm">
                        <div class="input-group-prepend">
                            <span class="input-group-text">CA</span>
                        </div>
                        <div class="input-group-append">
                            <span style="display: {dcu};">
                                <a href="/mqtt-ca" class="btn btn-sm btn-outline-secondary">Upload</a>
                            </span>
                            <span style="display: {dcf};">
                                <a href="/mqtt-ca" class="btn btn-sm btn-danger">Delete</a>
                            </span>
                        </div>
                    </div>
                </div>
                <div class="col-xl-2 col-md-3">
                    <div class="m-2 input-group input-group-sm">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Certificate</span>
                        </div>
                        <div class="input-group-append">
                            <span style="display: {deu};">
                                <a href="/mqtt-cert" class="btn btn-sm btn-outline-secondary">Upload</a>
                            </span>
                            <span style="display: {def};">
                                <a href="/mqtt-cert" class="btn btn-sm btn-danger">Delete</a>
                            </span>
                        </div>
                    </div>
                </div>
                <div class="col-xl-2 col-md-4">
                    <div class="m-2 input-group input-group-sm">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Private key</span>
                        </div>
                        <div class="input-group-append">
                            <span style="display: {dku};">
                                <a href="/mqtt-key" class="btn btn-sm btn-outline-secondary">Upload</a>
                            </span>
                            <span style="display: {dkf};">
                                <a href="/mqtt-key" class="btn btn-sm btn-danger">Delete</a>
                            </span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <hr/>
        <div class="row form-group">
            <div class="col-6">
                <a href="/" class="btn btn-outline-secondary">Back</a>
            </div>
            <div class="col-6 text-right">
                <button class="btn btn-primary">Save</button>
            </div>
        </div>
    </form>