pda-h5
/
test-vue.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <style>
        * {
            margin: 0;
            padding: 0;
        }
    </style>
    <title>接单列表</title>
    <link rel="stylesheet" type="text/css" href="css/mui.css">
    <link rel="stylesheet" type="text/css" href="css/custom.css">
    <link rel="stylesheet" type="text/css" href="css/common.css">

</head>

<body style="width: 100%;height: 100%;padding: 0px">
    <div class="app">
        <p>{{ msg }}</p>
        <input type="button" value="点击登录" @click="sendLogon">

        <div class="mui-content mui-row">
            <div class="mui-col-xs-3">
                <div class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-vertical">
                    <div v-for="(item,idx) in tabs">
                        <a @click="clickRecOrdTab(item)" class="mui-control-item" :href="idx">{{item}}</a>
                    </div>

                </div>
            </div>

            <div class="mui-col-xs-9" style="border-left: 1px solid #c8c7cc;">
                <div class="mui-table-view-cell" v-for="(itm,idx) in resRevList">
                    <div>
                        <span class="mui-badge">{{itm.infuseState}}</span>
                    </div>
                    <div class="fontBold">{{itm.arcimDesc}}</div>
                    <div>{{itm.recOrdDateTime}} {{itm.recOrdUser}}</div>
                    <div>{{itm.phOrdQtyUnit}} {{itm.doseQtyUnit}}</div>
                </div>
            </div>
        </div>
    </div>
</body>

<script src="js/vue.min.js"></script>
<script src="js/mui.min.js"></script>

<script type="text/javascript">
    var vm = new Vue({
        el: '.app',
        data: {
            msg: '欢迎学习Vue',
            tabs: ["全部接单", "本次接单", "上次接单"],
            resRevList: [{
                "arcimDesc": "0.9%氯化钠注射液(塑瓶)[100ml]氯化钠注射液氯化钠注射液",
                "doseQtyUnit": "100 ml",
                "infuseState": "已输完",
                "oeoreId": "107||12||1",
                "overTime": "00:20:17",
                "phOrdQtyUnit": "2 瓶",
                "recDate": "2021-01-06",
                "recOrdDateTime": "2021-01-06 11:34",
                "recOrdNo": "本次接单",
                "recOrdStatus": "已接单",
                "recOrdUser": "护士01",
                "recTime": "11:34",
                "recUserName": "护士01",
                "sttDate": "2020-07-08"

            }],
        },
        mounted() {
            //将要给原生调用的方法挂载到 window 上面
            window.Config = this.Config
            window.Logon = this.Logon
            window.getScanMsg = this.getScanMsg
            window.getRevOrdList = this.getRevOrdList
            window.save = this.save
        },
        methods: {
            //获取配置
            Config() {
                var content = {
                    title: "测试",
                    hideToolBar: "",
                    toolBar: {
                        show: "1",
                        type: "text",
                        text: "确定",
                        image: "",
                        method: "save"
                    }
                }
                var content = JSON.stringify(content)
                window.android.callAndroid(content, "config");
            },
            //保存
            save() {
                alert("save")
            },
            clickRecOrdTab(e) {
                console.log(e)
            },
            //点击登录
            sendLogon() {
                if (window.android != null) {
                    window.android.callAndroid("show", "loading");
                    var content = {
                        params: {
                            password: "1",
                            logonWardId: "",
                            userCode: "hs01"
                        },
                        method: "Logon",
                        version: "3.3"
                    }
                    var content = JSON.stringify(content)

                    window.android.callAndroid(content, "request");

                } else {
                    alert("本地加载");

                }

            },
            //登录回调
            Logon(objs, msg) {
                window.android.callAndroid("", "loading");
                if (objs.status == "0") {
                    alert("Js收到消息-->Logon , name:" + objs.userName.toString() + "  参数2:" + msg);
                } else {
                    window.android.callAndroid("fail:" + objs.msg, "dialog");
                }
            },
            //获取扫码
            getScanMsg(scanInfo) {
                if (window.android != null) {
                    window.android.callAndroid("show", "loading");
                    var content = {
                        params: {
                            regNo: "" + scanInfo
                        },
                        method: "getRevOrdList",
                        version: "3.3"
                    }
                    var content = JSON.stringify(content)

                    window.android.callAndroid(content, "request");

                } else {
                    alert(typeof(window.android));
                }
            },
            //接单列表
            getRevOrdList(objs, msg) {
                window.android.callAndroid("", "loading");
                if (objs.status == "0") {
                    this.resRevList = objs.data
                } else {
                    window.android.callAndroid("fail:" + objs.msg, "dialog");
                }
            }
        }
    })
</script>

</html>