ZLPMS/PMS.WebUI/Views/SmartForm/MobileSmartDetailPreview.cshtml


@{
    ViewBag.Title = "MobileSmartDetailPreview";
    Layout = "~/Views/MobileProblem/_APPMain.cshtml";

}
<link href="~/Content/Scripts/plugins/mui/css/mui.imageviewer.css" rel="stylesheet" />
<link href="~/Content/Scripts/plugins/element/elementui.css" rel="stylesheet" />
@*<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">*@
<link href="~/Content/Scripts/plugins/form-making-advanced@1.4.4.00/dist/FormMaking.css" rel="stylesheet" />
<script src="~/Content/Scripts/plugins/mui/js/mui.zoom.js"></script>
<!-- 引入组件库 -->
@*<script src="https://unpkg.com/element-ui/lib/index.js"></script>*@
<script src="~/Content/Scripts/plugins/element/elementui.js"></script>
<script src="~/Content/Scripts/plugins/form-making-advanced@1.4.4.00/dist/FormMaking.umd.js"></script>
<style>
    .message-title {
        font-size: 16px;
        font-weight: 500;
        padding: 1rem 1rem;
    }

    .message-detail {
        font-size: 14px;
        padding: 1rem 1rem;
        display: inline-block
    }

    .message-person {
        font-size: 12px;
        padding: 0 1rem;
        color: #adadb5;
    }

    .mui-content {
        background-color: white
    }

    div {
        word-wrap: break-word;
        word-break: break-all;
    }

    p {
        word-wrap: break-word;
        word-break: break-all;
    }
</style>
<div id="fill">
    <header class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" style="color:#ffffff"></a>
        <h1 class="mui-title" style="color:white">{{BDM}}</h1>
    </header>
    <div class="mui-content mui-scroll-wrapper" style="margin-bottom: 25px; ">
        <div id="slider" class="mui-slider mui-fullscreen">
            <div id="sliderSegmentedControl" class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
                <div class="titleList" style="border-bottom: solid 1px #e1e1e6;">
                    <a class="mui-control-item paddingNone mui-active " href="#all" data-id="0">
                        表单内容
                    </a>
                    <a class="mui-control-item paddingNone" href="#Unsolve" data-id="1">
                        回复内容
                    </a>

                </div>
            </div>

            <div class="mui-slider-group">

                <!--表单内容-->
                <div id="all" class="mui-slider-item mui-control-content mui-active">
                    <div class="mui-scroll-wrapper">
                        <div class="mui-scroll">
                            <div title="填报内容表单" style="padding: 5px 10px;  height: 100%;">
                                <fm-generate-form v-if="isshow" :data="jsonData" :value="editData" :edit="false"></fm-generate-form>
                            </div>

                        </div>
                    </div>
                </div>

                <!--回复内容-->
                <div id="Unsolve" class="mui-slider-item mui-control-content">
                    <div class="mui-scroll-wrapper">
                        <div class="mui-scroll-wrapper">
                            <div class="mui-scroll">
                                <div title="填报内容表单" style="padding: 5px 10px;  height: 100%;">
                                    <fm-generate-form v-if="isreplyshow" :data="replyjsonData" :value="replyeditData" :edit="false"></fm-generate-form>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>


            </div>
        </div>

    </div>
    <nav class="mui-bar mui-bar-tab">
        <button v-on:click="MySmart()" type="button" class="mui-btn mui-btn-primary" style="width: 48%; background-color: #2ab8ff; border: none; margin-right: 10px">返回首页</button>
    </nav>
</div>
    <script>



    var vm = new Vue({
        el: '#fill',
        data: {
            /// 表单数据
            jsonData: {},
            editData: {},
            replyjsonData: {},
            replyeditData: {},
            isshow: false,
            isreplyshow: false,
            BDM: "",
        },
        computed: {},
        methods: {
            init: function init() {
                var that = this;
                $.post('/SmartForm/MyRecordList', { id: '@ViewBag.ID' }, function (data) {
                    that.isshow = false
                    that.isreplyshow = false;
                    that.BDM = data[0].BDM;
                    that.jsonData = JSON.parse(data[0].BDNR == "" ? "{}" : data[0].BDNR);
                    that.editData = JSON.parse(data[0].BDJG == "" ? "{}" : data[0].BDJG);
                    that.replyjsonData = JSON.parse(data[0].BDCLNR == "" ? "{}" : data[0].BDCLNR);
                    that.replyeditData = JSON.parse(data[0].BDCLJG == "" ? "{}" : data[0].BDCLJG);
                    that.$nextTick(() => {
                        that.isshow = true
                        that.isreplyshow = true
                    })
                })
            },
            ///返回首页
            MySmart: function MySmart() {
                window.location.href = '/MobileProblem/Home';
            }
        },
        watch: {

        },
        mounted: function mounted() {
            this.init();
            mui.init({
                swipeBack: true //启用右滑关闭功能
            });
            mui('.mui-scroll-wrapper').scroll();

        }
    });

    </script>