t1
/
ZLPMS


			
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009
							
@{
    ViewBag.Title = "NewProblemForProject";
    Layout = "~/Views/MobileProblem/_APPMain.cshtml";
}

    <link href="~/Content/Style/MobileProductRegist/NewProblemForProject.css?v=1.0" rel="stylesheet" />
    <link href="~/Content/Scripts/plugins/mui/css/webuploader.css" rel="stylesheet" />
    <link href="~/Content/Scripts/plugins/mui/css/mui.indexedlist.css" rel="stylesheet" />

    <script src="~/Content/Scripts/plugins/mui/js/mui.view.js"></script>
    <script src="~/Content/Scripts/plugins/mui/js/webuploader.js?v=1.2"></script>
    <script src="~/Content/Scripts/babel.min.js"></script>
    <script src="~/Content/Scripts/polyfill.min.js"></script>
    <script  src="~/Content/Scripts/plugins/mui/js/PlusUploader.js?v=2.7422"></script>
    <script src="~/Content/Scripts/plugins/mui/js/mui.indexedlist.js?v=1.3"></script>

    <script src="https://cdn.staticfile.org/vue-resource/1.5.1/vue-resource.min.js"></script>

<body class="mui-fullscreen">
    <style>
        .UplodImg {
            display: flex;
            justify-content: space-between;
            flex-direction: row;
            align-content: center;
            padding: 7px 27px;
        }

        .filep {
            -webkit-line-clamp: 1;
            overflow: hidden;
            word-break: break-all;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            text-overflow: ellipsis;
            position: absolute;
            bottom: 12px;
            background-color: rgba(0, 0, 0, 0.6);
            font-size: 13px;
            color: white;
            width: 100px;
        }

        .mui-input-row label {
            padding: 11px 20px 11px 13px;
            margin-left: 20px;
        }

        .mui-radio input[type='radio'] {
            left: 0;
        }

        .radiodiv {
            display: flex;
            flex-direction: row;
            background-color: white;
            font-size: 14px;
            padding: 0 10px;
        }

        .destory {
            position: absolute;
            top: 0;
            right: -6px;
            width: 10px;
            height: 10px;
            font-size: 20px;
            color: #cc9a9a;
            margin-bottom: 11px;
            transition: color 0.2s ease-out;
            background-color: transparent;
            border: transparent;
        }

            .destory:after {
                content: '×';
                position: absolute;
                top: -10px;
                right: 5px;
            }

        .nav-bar {
            border-radius: 10px;
            font-size: 15px !important;
            margin-bottom: 10px !important;
            height: 50px;
        }

        .onselect {
            padding: 0 20px;
            font-size: 14px;
            font-weight: 600;
        }

        .mui-indexed-list-bar {
            background-color: white;
        }

            .mui-indexed-list-bar.active {
                background-color: white !important;
            }

            .mui-indexed-list-bar a {
                color: black;
            }

        .search_title {
            position: absolute;
            left: 40px;
            border-bottom: none;
            width: 82%;
        }

        .mui-indexed-list {
            border-width: 0px;
        }

        .mui-search .mui-placeholder {
            font-size: 13px;
        }

        .hot_class {
            display: inline-block;
            line-height: 0.4rem;
            padding: 12px 23px;
            border-radius: 6px;
            color: #000;
            margin: 5px;
            font-size: 13px;
            text-align: center;
            list-style: none;
            border: solid 1px #dcd9d9;
        }

        .hot_active {
            color: #00aaff;
        }
    </style>
    <div id="vue">
        <!--页面主结构开始-->
        <div id="app" class="mui-views">
            <div class="mui-view">
                <div class="mui-navbar">
                </div>
                <div class="mui-pages">
                </div>
            </div>
        </div>
        @*选择项目机构界面
            <div id="InstitutionSelect" class="mui-page">
                <!--页面标题栏开始-->
                <div class="mui-navbar-inner mui-bar mui-bar-nav">
                    <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
                        <span class="mui-icon mui-icon-left-nav"></span>
                    </button>
                    <h1 class="mui-center mui-title">选择存在问题的项目机构</h1>
                    <button v-on:click="GoRegister" v-if="ProjectSelect" type="button" class="mui-right  mui-btn  mui-btn-link mui-btn-nav mui-pull-right">
                        <span class="mui-icon mui-icon-checkmarkempty" style="color:white;font-size:30px"></span>
                    </button>
                </div>
                <!--页面标题栏结束-->
                <!--页面主内容区开始-->
                <div class="mui-page-content">
                    <div class="onselect">已选:&nbsp;{{ProjectSelectName}}{{institutionSeleName}}</div>
                    <div class="mui-content mui-row mui-fullscreen" style="z-index:0;background-color:#efeff4;margin-top:70px">
                        <div class="mui-col-xs-3" style="width:35%">
                            <div id="segmentedControls" class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-vertical">
                                <div style="text-align:center">
                                    <input v-model="ProjectSearchText" style="font-size:15px; margin:auto" type="search" class="mui-input-clear" placeholder="项目名称搜索">
                                </div>
                                <a v-for="p in ProjectSearchData" v-bind:class="ProjectSelect==p.id?'mui-active':''" v-bind:id="p.text" class="mui-control-item " v-on:click="GetInstitution(p)">{{p.text}}</a>
                            </div>
                        </div>
                        <div id="segmentedControlContents" class="mui-col-xs-9" style="border-left: 1px solid #c8c7cc;width:65%">
                            <div id="content" class="mui-control-content mui-active">
                                <div style="text-align:center">
                                    <input v-model="searchText" style="font-size:15px; margin:auto" type="search" class="mui-input-clear" placeholder="机构名称搜索">
                                </div>
                                <ul style="margin-top:0" class="mui-table-view">

                                    <li v-for="i in InsitutionSearchData" class="mui-table-view-cell" v-bind:class="institutionSele==i.id?'mui-active':''" v-on:click="InstitutionSelect(i)">{{i.text}}</li>

                                </ul>
                            </div>

                        </div>

                    </div>
                </div>
                <!--页面主内容区结束-->

            </div>*@

        <div id="SelectNew" class="mui-page">
            <!--页面标题栏开始-->
            <div class="mui-navbar-inner mui-bar mui-bar-nav">
                <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
                    <span class="mui-icon mui-icon-left-nav"></span>
                </button>
                <h1 class="mui-center mui-title">选择存在问题的项目</h1>

            </div>
            <!--页面标题栏结束-->
            <!--页面主内容区开始-->
            <div id="modal" class="mui-page-content">
                <div id="list" class="mui-indexed-list">
                    <div>
                        <div class="mui-indexed-list-search mui-input-row mui-search  ">
                            <input type="search" class="mui-input-clear mui-indexed-list-search-input" placeholder="搜索项目名称/简码">
                        </div>
                    </div>
                    <div class="mui-indexed-list-bar">
                        <a v-if="ProjectSelectName">已选</a>
                        <a>历史</a>
                        <a v-for="item  in ProjectIndex">{{item.Index}}</a>
                    </div>
                    <div class="mui-indexed-list-alert"></div>
                    <div class="mui-indexed-list-inner">
                        <div class="mui-indexed-list-empty-alert">没有数据</div>
                        <ul class="mui-table-view" style="margin-top:0;padding-right: 23px;">
                            <template v-if="ProjectSelectName">
                                <li data-group="已选" class="mui-table-view-divider mui-indexed-list-group">已选项目</li>
                                <li class="hot_class hot_active">{{ProjectSelectName}}</li>
                            </template>
                            <li data-group="历史" class="mui-table-view-divider mui-indexed-list-group">历史记录</li>
                                <li v-if="UserHistoryProject.length>0"
                                    v-on:click="ProjectChooseCompleteHis(item.split('|'))"
                                    v-for="item in UserHistoryProject" class="hot_class">{{item.split('|')[1]}}</li>
                                <li v-if="!UserHistoryProject.length" class="hot_class">暂无</li>
                            <template v-for="item in ProjectIndex">
                                <li v-bind:data-group="item.Index" class="mui-table-view-divider mui-indexed-list-group">{{item.Index}}</li>
                                <li v-bind:class="project.ID==ProjectSelect?'hot_active':''" v-on:click="ProjectChooseComplete(project)" v-for="project in item.Data" v-bind:data-value="project.CodeName" v-bind:data-tags="project.CodeName" class="mui-table-view-cell mui-indexed-list-item">
                                    {{project.Name}}
                                </li>
                            </template>
                        </ul>
                    </div>
                </div>
            </div>
            <!--页面主内容区结束-->

        </div>
        @*登记主界面*@
        <div id="register" class="mui-page">
            <div class="mui-navbar-inner mui-bar mui-bar-nav">
                <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
                    <span class="mui-icon mui-icon-left-nav"></span>
                </button>
                <h1 class="mui-center mui-title">中联区卫问题登记</h1>
                @*<button v-on:click="Submit()" class="mui-btn mui-btn-blue mui-btn-link mui-pull-right" style="color:#ffffff">直接提交</button>*@
            </div>
            <nav class="mui-bar mui-bar-tab">
                <button v-on:click="Submit()" type="button" class="mui-btn mui-btn-primary" style="width:48%;background-color: #2ab8ff;border:none;margin-right:10px">直接提交</button>
                <button v-on:click="StatusSelect()" type="button" class="mui-btn mui-btn-danger" style="width:48%;border:none;background-color: #fb7e00">下一步（填写处理状态）</button>
            </nav>
            <div class="mui-page-content">

                <div class="mui-scroll-wrapper">
                    <div class="mui-scroll">
                        <input v-model="institutionSele" type="hidden" />
                        <div class="mui-input-row" style="margin-top: 7px">
                            <input v-on:blur="getde()" v-model="ProblemTitile" id="ProblemTitile" type="text" class="mui-input-speech mui-input-clear" placeholder="填写问题标题" style="font-size:15px">
                        </div>
                        <div class="mui-input-row" style="font-size:14px">
                            <textarea v-model="detail" id="detail" rows="8" placeholder="请填写具体的问题描述，以便我们更详细的了解您需要解决的问题。" style="font-size:15px;margin-bottom:-10px"></textarea>
                            <span id="deatilSpeech" class="mui-icon  mui-icon-speech" style="position:absolute;bottom:4px;right:0;color: #999;"></span>
                        </div>
                        <div style="background-color:white;margin-top:10px">
                            <div class="UplodImg" id="pickImg">
                                <h4 style="font-weight:400">图片</h4>
                                <div>
                                    @*<span class="mui-icon mui-icon-camera" id="pickCamera" style="color:#1296db;margin-right:20px;font-size:28px"></span>
        <span class="mui-icon mui-icon-image" id="pickPhoto" style="color:#1296db"></span>*@
                                    <span class="mui-icon mui-icon-camera" id="pickCamera" style="color:#1296db;"></span>
                                </div>

                            </div>
                            <ul id="ImgList" class="mui-table-view mui-grid-view mui-grid-9" style="background-color:white;border-color:transparent;margin:0"></ul>
                        </div>
                        <div style="background-color:white;border-top: solid 1px #efeff4;">
                            <div class="UplodImg" id="pickFlie">
                                <h4 style="font-weight:400">附件</h4>
                                <span class="mui-icon mui-icon-paperclip" style="color:#1296db"></span>
                            </div>
                            <ul id="FileList" class="mui-table-view mui-grid-view mui-grid-9" style="background-color:white;border-color:transparent;"></ul>
                        </div>


                        <div style="display:none" id="picker">选择文件</div>
                        <div style="display:none" id="picker2">选择文件</div>
                        <button style="margin-top: 30px;display:none;" id="ctlBtn" class="btn btn-default">图片上传</button>

                    </div>
                </div>
            </div>
        </div>
        @*处理状态选择界面*@
        <div id="DEALSTATUS" class="mui-page">
            <div class="mui-navbar-inner mui-bar mui-bar-nav">
                <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
                    <span class="mui-icon mui-icon-left-nav"></span>
                </button>
                <h1 class="mui-center mui-title">中联区卫问题登记</h1>
                @*<button v-on:click="Submit()" class="mui-btn mui-btn-blue mui-btn-link mui-pull-right" style="color:#ffffff">直接提交</button>*@
            </div>
            <nav class="mui-bar mui-bar-tab">
                @*<button v-on:click="Submit()" type="button" style="border-radius: 10px;font-size:15px;margin-bottom:10px;height:50px" class="mui-btn mui-btn-success mui-btn-block btn_2">提交</button>*@
                <button v-on:click="Submit()" type="button" class="mui-btn mui-btn-primary" style="width:90%;background-color: #2ab8ff;border:none;margin-left:5%">提交</button>
            </nav>
            <div class="mui-page-content">
                <div class="mui-scroll-wrapper">
                    <div class="mui-scroll">
                        <h5 class="mui-content-padded">登记来源</h5>
                        <select v-model="Origin" class="mui-btn mui-btn-block" style="font-size:15px;padding-left:20px">
                            <option v-for="os in OriginSelec" v-bind:value="os.代码">{{os.显示名}}</option>
                        </select>
                        <h5 class="mui-content-padded">问题性质</h5>
                        <div class="radiodiv">
                            <div v-for="pn in ProblemNatureSelec" class="mui-input-row mui-radio ">
                                <label>{{pn.显示名}}</label>
                                <input v-model="ProblemNature" name="radio3" type="radio" v-bind:value="pn.代码">
                            </div>
                        </div>
                        @*<select v-model="ProblemNature" class="mui-btn mui-btn-block" style="font-size:15px;padding-left:20px">
            <option v-for="pn in ProblemNatureSelec" v-bind:value="pn.代码">{{pn.显示名}}</option>
        </select>*@
                        @*  <h5 class="mui-content-padded">处理状态</h5>
        <div class="radiodiv">
               <div class="mui-input-row mui-radio ">
                   <label>未处理</label>
                   <input v-model="DealStatus" name="radio1" type="radio" value="0">
               </div>
               <div class="mui-input-row mui-radio ">
                   <label>已处理</label>
                   <input v-model="DealStatus" name="radio1" type="radio" value="1">
               </div>
               <div class="mui-input-row mui-radio ">
                   <label>向上提交</label>
                   <input v-model="DealStatus" name="radio1" type="radio" value="2">
               </div>
           </div>*@
                        <div v-if="DealStatus==1" class="mui-input-row" style="font-size:14px">
                            <textarea v-model="DealDetail" rows="6" placeholder="请填写处理描述说明" style="font-size:15px;margin-top:20px"></textarea>
                        </div>
                        <h5 class="mui-content-padded">紧急程度</h5>
                        <div class="radiodiv">
                            <div v-for="er in ErginSelec" class="mui-input-row mui-radio ">
                                <label>{{er.显示名}}</label>
                                <input v-model="ErginID" name="radio2" type="radio" v-bind:value="er.代码">
                            </div>
                        </div>
                        <ul class="mui-table-view">
                            <li class="mui-table-view-cell" style="font-size:14px">
                                要求时间
                                <button type="button" data-options='{"type":"date","beginYear":2017,"endYear":2029}' class="mui-btn time-btn">
                                    {{RequireTime}}
                                </button>
                            </li>
                        </ul>

                        <div class="mui-input-row" style="font-size:14px;margin-bottom:40px;margin-top:20px">
                            <textarea v-model="urgentDetail" id="urgentDetail" rows="6" placeholder="请填写紧急描述说明" style="font-size:15px;"></textarea>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <script >
        var IsPlus = mui.os.plus ? true : false;
        var Count = 0;
        var ProblemProcessIDtoImg;
        var lod;
        var Code = '@ViewBag.ProductCode';
        var PersonProperty = '@ViewBag.PersonProperty';
        var ProjectId = '@ViewBag.ProjectId';
        var OrgID = '@ViewBag.OrgID';
        "use strict";

        var vm = new Vue({
            el: '#vue',
            data: {
                ///项目机构
                ProjectAndInstitution: {},
                Institution: {},
                //选择的项目
                ProjectSelect: '',
                //已选项目名称
                ProjectSelectName: '',
                ///项目人员选择的机构
                institutionSele: "",
                //已选机构名称
                institutionSeleName: "",
                ///项目人员选择的处理状态
                DealStatus: 2,
                ///问题标题
                ProblemTitile: '',
                ///问题描述
                detail: '',
                ///处理描述说明
                DealDetail: '',
                ///紧急程度选择项
                ErginSelec: null,
                ///紧急程度
                ErginID: '',
                ///紧急描述
                urgentDetail: '',
                ///紧急处理时间
                RequireTime: '请选择时间',
                viewApi: null,
                ///登记来源
                Origin: '',
                ///登记来源选择项
                OriginSelec: null,
                ///问题性质
                ProblemNature: '',
                ///问题性质选择项
                ProblemNatureSelec: null,
                //项目搜索项
                ProjectSearchText: '',
                //机构搜索项
                searchText: '',
                FivePlusUploder: null,
                //项目索引列表
                ProjectIndex: null,
                AddProject: '',
                //用户的登记的历史项目
                UserHistoryProject: []
            },
            watch: {
                ProjectIndex: function ProjectIndex(newProject, oldProject) {
                    var that = this;
                    this.$nextTick(function () {
                        that.InitIndexSelect();
                    });
                }
            },
            methods: {
                ///获取项目
                GetProject: function GetProject() {
                    var that = this;
                    this.$http.get('/MobileProblem/GetProjectTreeByCode/' + Code).then(function (res) {
                        this.ProjectAndInstitution = res.body;
                        var UserSetProject = getCookie("UserSetProject");

                        if (UserSetProject && UserSetProject.split('|')[0]) {
                            ///判断获取的项目中是否存在设置的默认项目
                            var status = false;

                            for (var _iterator = res.body, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]() ; ;) {
                                var _ref;

                                if (_isArray) {
                                    if (_i >= _iterator.length) break;
                                    _ref = _iterator[_i++];
                                } else {
                                    _i = _iterator.next();
                                    if (_i.done) break;
                                    _ref = _i.value;
                                }

                                var item = _ref;

                                if (item.id == UserSetProject.split('|')[0]) {
                                    status = true;
                                    break;
                                }
                            }

                            if (status) {
                                that.SetProjectAndInstitution();
                                that.CheckInsitution(res.body, UserSetProject.split('|')[0]);
                            }
                        }
                    }, function (res) {
                        console.log(res.status);
                    });
                },
                //筛选机构
                CheckInsitution: function CheckInsitution(project, id) {
                    for (var _iterator2 = project, _isArray2 = Array.isArray(_iterator2), _i2 = 0, _iterator2 = _isArray2 ? _iterator2 : _iterator2[Symbol.iterator]() ; ;) {
                        var _ref2;

                        if (_isArray2) {
                            if (_i2 >= _iterator2.length) break;
                            _ref2 = _iterator2[_i2++];
                        } else {
                            _i2 = _iterator2.next();
                            if (_i2.done) break;
                            _ref2 = _i2.value;
                        }

                        var item = _ref2;

                        if (item.id == id) {
                            this.Institution = item.children;
                            return;
                        }
                    }
                },
                ///重置项目机构
                ResetProjectAndInstitution: function ResetProjectAndInstitution() {
                    this.ProjectSelect = '';
                    this.ProjectSelectName = '';
                    this.institutionSele = '';
                    this.institutionSeleName = '';
                },
                //设置默认项目机构
                SetProjectAndInstitution: function SetProjectAndInstitution() {
                    //判断是否设置默认项目和机构
                    var UserSetProject = getCookie("UserSetProject");

                    if (UserSetProject && UserSetProject.split('|')[0]) {
                        this.ProjectSelect = UserSetProject.split('|')[0];
                        this.ProjectSelectName = UserSetProject.split('|')[1] + "  ->";
                        var UserSetInstitution = getCookie("UserSetInstitution");

                        if (UserSetInstitution && UserSetInstitution.split('|')[0]) {
                            this.institutionSele = UserSetInstitution.split('|')[0];
                            this.institutionSeleName = UserSetInstitution.split('|')[1];
                        }
                    }
                },
                ///获取登记来源
                GetOriginSelec: function GetOriginSelec() {
                    this.$http.get('/MobileProblem/GetComboboxByCode/026').then(function (res) {
                        this.OriginSelec = res.body;
                        this.Origin = this.OriginSelec[1].代码;
                    }, function (res) {
                        console.log(res.status);
                    });
                },
                ///获取问题性质
                GetProblemNatureSelec: function GetProblemNatureSelec() {
                    this.$http.get('/MobileProblem/GetComboboxByCode/013').then(function (res) {
                        this.ProblemNatureSelec = res.body;
                        this.ProblemNature = this.ProblemNatureSelec[1].代码;
                    }, function (res) {
                        console.log(res.status);
                    });
                },
                ///获取机构
                GetInstitution: function GetInstitution(i) {
                    this.ProjectSelect = i.id;
                    this.ProjectSelectName = i.text + " ->";
                    this.institutionSele = '';
                    this.institutionSeleName = ''; //$(".mui-control-item ").removeClass("mui-active");
                    //$("#" + i.text).addClass("mui-active");

                    this.Institution = i.children;
                },
                ///获取紧急程度选择项
                GetErgin: function GetErgin() {
                    this.$http.get('/MobileProblem/GetComboboxByCode/014').then(function (res) {
                        this.ErginSelec = res.body;
                        this.ErginID = this.ErginSelec[0].代码;
                    }, function (res) {
                        console.log(res.status);
                    });
                },
                //只选择项目直接跳转页面
                GoRegister: function GoRegister() {
                    this.viewApi.go("#register");
                },
                ///选择机构并跳转登记主页面
                InstitutionSelect: function InstitutionSelect(i) {
                    this.institutionSele = i.id;
                    this.institutionSeleName = i.text;
                    this.viewApi.go("#register");
                },
                ///问题状态选择界面
                StatusSelect: function StatusSelect() {
                    if (Code == '') {
                        mui.toast('请重新选择产品', {
                            duration: 'long',
                            type: 'div'
                        });
                        return;
                    }

                    if (this.ProblemTitile == '') {
                        mui.toast('请输入问题标题', {
                            duration: 'long',
                            type: 'div'
                        });
                        return;
                    }

                    if (this.detail == '') {
                        mui.toast('请填写问题详细描述', {
                            duration: 'long',
                            type: 'div'
                        });
                        return;
                    }

                    if (this.ProjectSelect == '') {
                        mui.toast('至少选择一个存在问题的项目', {
                            duration: 'long',
                            type: 'div'
                        });
                        return;
                    }

                    this.viewApi.go("#DEALSTATUS");
                },
                ///紧急问题登记界面
                ErginSelect: function ErginSelect() {
                    this.viewApi.go("#Ergin");
                },
                ///提交问题
                Submit: function Submit() {
                    var that = this;
                    var param = {
                        ProblemTitile: this.ProblemTitile,
                        detail: this.detail,
                        InstitutionID: this.institutionSele,
                        ProjectID: this.ProjectSelect,
                        DealStatus: this.DealStatus,
                        DealDetail: this.DealDetail,
                        ErginID: this.ErginID,
                        urgentDetail: this.urgentDetail,
                        RequireTime: this.RequireTime,
                        Origin: this.Origin,
                        ProblemNature: this.ProblemNature,
                        ProductCode: Code
                    };

                    if (Code == '') {
                        mui.toast('请重新选择产品', {
                            duration: 'long',
                            type: 'div'
                        });
                        return;
                    }

                    if (this.ProblemTitile == '') {
                        mui.toast('请输入问题标题', {
                            duration: 'long',
                            type: 'div'
                        });
                        return;
                    }

                    if (this.detail == '') {
                        mui.toast('请填写问题详细描述', {
                            duration: 'long',
                            type: 'div'
                        });
                        return;
                    }

                    if (this.ProjectSelect == '') {
                        mui.toast('至少选择一个存在问题的项目', {
                            duration: 'long',
                            type: 'div'
                        });
                        return;
                    }

                    lod = mui.showLoading("正在提交，请稍后...", "div");
                    $.post("/MobileProblem/SubmitProblem", param, function (data) {
                        if (data.code == 200) {
                            ProblemProcessIDtoImg = data.msg;
                            $("#ctlBtn").click();
                        } else {
                            mui.toast("该项目下不存在该产品!", {
                                duration: 'long',
                                type: 'div'
                            });
                            mui.hideLoading(lod);
                        }
                    });
                },
                ///初始化页面
                init: function init() {
                    var that = this;
                    mui.init(); ///判断是否为机构管理员
                    //var defaultPages = '#InstitutionSelect';

                    var defaultPages = '#SelectNew';

                    if (PersonProperty == 4) {
                        this.institutionSele = OrgID;
                        this.ProjectSelect = ProjectId;
                        defaultPages = "#register";
                    } //初始化单页view


                    that.viewApi = mui('#app').view({
                        defaultPage: defaultPages
                    });
                    mui('.mui-scroll-wrapper').scroll(); //处理view的后退与webview后退

                    var oldBack = mui.back;
                    var view = that.viewApi.view;

                    mui.back = function () {
                        if (that.viewApi.canBack()) {
                            //如果view可以后退，则执行view的后退
                            that.viewApi.back();
                        } else {
                            //执行webview后退
                            oldBack();
                        }
                    };
                },
                ///实例化日期组件
                loadTime: function loadTime() {
                    var that = this;
                    var btns = $('.time-btn');
                    btns.each(function (i, btn) {
                        btn.addEventListener('tap', function () {
                            var _self = this;

                            if (_self.picker) {
                                _self.picker.show(function (rs) {
                                    btn.innerHTML = rs.text;

                                    _self.picker.dispose();

                                    _self.picker = null;
                                });
                            } else {
                                var optionsJson = this.getAttribute('data-options') || '{}';
                                var options = JSON.parse(optionsJson);
                                var id = this.getAttribute('id');
                                _self.picker = new mui.DtPicker(options);

                                _self.picker.show(function (rs) {
                                    that.RequireTime = rs.text;

                                    _self.picker.dispose();

                                    _self.picker = null;
                                });
                            }
                        }, false);
                    });
                },
                ///初始化图片上传插件
                ImagUploaderInit: function ImagUploaderInit() {
                    var that = this;
                    var $list = $("#ImgList");
                    var $list2 = $("#FileList");
                    var $btn = $("#ctlBtn");
                    var thumbnailWidth = 100;
                    var thumbnailHeight = 100;
                    var uploader = WebUploader.create({
                        // 选完文件后，是否自动上传。
                        auto: false,
                        // swf文件路径
                        swf: '/Content/Scripts/plugins/mui/js/Uploader.swf',
                        // 文件接收服务端。
                        server: '/MobileProblem/FlieUploadAndSave',
                        // 选择文件的按钮。可选。
                        // 内部根据当前运行是创建，可能是input元素，也可能是flash.
                        pick: '#picker2',
                        compress: {
                            width: 1600,
                            height: 1600,
                            // 图片质量，只有type为`image/jpeg`的时候才有效。
                            quality: 90,
                            // 是否允许放大，如果想要生成小图的时候不失真，此选项应该设置为false.
                            allowMagnify: false,
                            // 是否允许裁剪。
                            crop: false,
                            // 是否保留头部meta信息。
                            preserveHeaders: true,
                            // 如果发现压缩后文件大小比原来还大，则使用原来图片
                            // 此属性可能会影响图片自动纠正功能
                            noCompressIfLarger: false,
                            // 单位字节，如果图片大小小于此值，不会采用压缩。
                            compressSize: 0
                        }
                    });
                    uploader.on('fileQueued', function (file) {
                        var $li = $('<li id="' + file.id + '" class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><img > <button class="destory" ></button><p class="filep">' + file.name + '</p> </li>'),
                            $img = $li.find('img'); // $list为容器jQuery实例

                        if (file.type.substring(0, 5) == "image") {
                            $list.append($li);
                        } else {
                            $list2.append('<li id="' + file.id + '" class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><span class="mui-icon mui-icon-upload" style="padding-bottom:10px"></span><button class="destory" ></button>' + '<p class="filep">' + file.name + '</p> </li>');
                        }

                        $("#" + file.id).children(".destory").click(function () {
                            uploader.removeFile(file);
                            $("#" + file.id).remove();
                        }); // 创建缩略图
                        // 如果为非图片文件，可以不用调用此方法。
                        // thumbnailWidth x thumbnailHeight 为 100 x 100

                        uploader.makeThumb(file, function (error, src) {
                            if (error) {
                                $img.replaceWith('<span>不能预览</span>');
                                return;
                            }

                            $img.attr('src', src);
                        }, thumbnailWidth, thumbnailHeight);
                    }); // 文件上传成功，给item添加成功class, 用样式标记上传成功。

                    uploader.on('uploadSuccess', function (file, response) {
                        $('#' + file.id).addClass('upload-state-done');

                        if (response.msg = "1") {
                            Count += 1;
                        }
                    }); // 文件上传失败，显示上传出错。

                    uploader.on('uploadError', function (file) {
                        var $li = $('#' + file.id),
                            $error = $li.find('div.error'); // 避免重复创建

                        if (!$error.length) {
                            $error = $('<div class="error"></div>').appendTo($li);
                        }

                        $error.text('上传失败');
                    }); // 完成上传完了，成功或者失败，先删除进度条。

                    uploader.on('uploadComplete', function (file) {
                        $('#' + file.id).find('.progress').remove();
                    });
                    uploader.on('uploadFinished', function () {
                        mui.hideLoading(lod);

                        if (IsPlus) {
                            that.FivePlusUploder.uplod(ProblemProcessIDtoImg, lod);
                        } else {
                            mui.alert("问题反馈成功，请耐心等待，成功上传" + Count + "个附件!", "提交成功", "确定", function () {
                                window.location.href = "/MobileProblem/Home";
                            }, 'div');
                        }
                    });
                    $btn.on('click', function () {
                        uploader.options.formData.ProcessId = ProblemProcessIDtoImg;
                        uploader.upload();
                    });

                    if (!IsPlus) {
                        document.getElementById('pickImg').addEventListener('tap', function () {
                            $("#picker").find('.webuploader-element-invisible').click();
                        });
                    }

                    document.getElementById('pickFlie').addEventListener('tap', function () {
                        $("#picker2").find('.webuploader-element-invisible').click();
                    });
                    uploader.addButton({
                        id: '#picker',
                        innerHTML: '选择文件',
                        accept: {
                            title: 'Images',
                            extensions: 'gif,jpg,jpeg,bmp,png',
                            mimeTypes: 'image/*'
                        },
                        capture: 'camera'
                    });
                },
                getde: function getde() {
                    if (!this.detail) {
                        this.detail = this.ProblemTitile;
                    }
                },
                LoadUploder: function LoadUploder() {
                    this.ImagUploaderInit();

                    if (IsPlus) {
                        this.FivePlusUploder = new FivePlus();
                    }
                },
                //初始化索引列表
                InitIndexSelect: function InitIndexSelect() {
                    var header = document.querySelector('.mui-navbar-inner');
                    var list = document.getElementById('list');
                    var modal = document.getElementById('modal'); //calc hieght

                    list.style.height = modal.offsetHeight + 'px'; //create

                    window.indexedList = new mui.IndexedList(list);
                },
                //获取项目索引列表
                GetProjectIndex: function GetProjectIndex() {
                    var that = this;
                    $.get("/MobileProblem/GetProjectIndexByCode/" + Code, {}, function (data) {
                        that.ProjectIndex = data;
                    });
                },
                //索引选择项目
                ProjectChooseComplete: function ProjectChooseComplete(project) {
                    this.ProjectSelect = project.ID;
                    this.ProjectSelectName = project.Name;
                    this.AddHistoryProject(project);
                    this.viewApi.go("#register");
                },
                //从历史中选择
                ProjectChooseCompleteHis: function ProjectChooseCompleteHis(projectIn) {
                    var project = {
                        ID: projectIn[0],
                        Name: projectIn[1]
                    };
                    this.ProjectSelect = project.ID;
                    this.ProjectSelectName = project.Name;
                    this.AddHistoryProject(project);
                    this.viewApi.go("#register");
                },
                //获取历史登记项目
                GetHistoryProject: function GetHistoryProject() {
                    var UserHistoryProject = getCookie("UserHistoryProject");

                    if (UserHistoryProject) {
                        this.UserHistoryProject = JSON.parse(UserHistoryProject);
                    }
                },
                //增加历史登记项目
                AddHistoryProject: function AddHistoryProject(projectIn) {
                    var project = projectIn.ID + "|" + projectIn.Name;
                    var UserHistoryProject = getCookie("UserHistoryProject");

                    if (UserHistoryProject) {
                        var OldKeys = JSON.parse(UserHistoryProject);
                        var findIndex = OldKeys.indexOf(project);

                        if (findIndex == -1) {
                            OldKeys.unshift(project);
                        } else {
                            OldKeys.splice(findIndex, 1);
                            OldKeys.unshift(project);
                        } //最多5个纪录


                        OldKeys.length > 5 && OldKeys.pop();
                        setCookie("UserHistoryProject", JSON.stringify(OldKeys), 3);
                        this.UserHistoryProject = OldKeys; //更新历史搜索
                    } else {
                        var OldKeys = [project];
                        setCookie("UserHistoryProject", JSON.stringify(OldKeys), 3);
                        this.UserHistoryProject = OldKeys; //更新历史搜索
                    }
                },
                AddSpeech: function () {
                    var that = this;
                    if (IsPlus) {
                          
                        mui.plusReady(function () {
                            document.getElementById('deatilSpeech').addEventListener('tap', function () {
                                plus.speech.startRecognize({
                                    engine: 'baidu',
                                    lang: 'zh-cn'
                                }, function (s) {
                                    that.detail = s;
                                }, function (e) {
                                    console.log('语音识别失败：' + JSON.stringify(e));
                                });
                            });
                        });
                    } else {
                        $('#ProblemTitile').removeClass('mui-input-speech');
                        $('#deatilSpeech').remove();
                    }
                }
            },
            computed: {
                InsitutionSearchData: function InsitutionSearchData() {
                    var searchText = this.searchText;

                    if (searchText) {
                        return this.Institution.filter(function (Institutions) {
                            return Object.keys(Institutions).some(function (key) {
                                return String(Institutions[key]).toLowerCase().indexOf(searchText) > -1;
                            });
                        });
                    }

                    return this.Institution;
                },
                ProjectSearchData: function ProjectSearchData() {
                    var ProjectSearchText = this.ProjectSearchText;

                    if (ProjectSearchText) {
                        return this.ProjectAndInstitution.filter(function (ProjectAndInstitutions) {
                            return Object.keys(ProjectAndInstitutions).some(function (key) {
                                return String(ProjectAndInstitutions[key]).toLowerCase().indexOf(ProjectSearchText) > -1;
                            });
                        });
                    }

                    return this.ProjectAndInstitution;
                }
            },
            mounted: function mounted() {
                this.init();
                this.LoadUploder();
                this.loadTime(); //this.GetProject();
                this.AddSpeech();

                this.GetHistoryProject();
                this.GetErgin();
                this.GetOriginSelec();
                this.GetProblemNatureSelec();
                this.GetProjectIndex();
            }
        });
    </script>
</body>