<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>标注中心</title>
    <script src="/bower_components/jquery/dist/jquery.min.js"></script>
    <link href="/dist/css/normalize.min.css" rel="stylesheet">
    <link href="/dist/css/animate.min.css" rel="stylesheet">
    <link rel="stylesheet" href="/dist/css/zz.css">
    <link rel="stylesheet" href="/dist/css/index.css">
    <script src="/dist/js/vue.min.js"></script>
    <script src="/dist/js/index.js"></script>
    <style>
        .add-tip {
            width: 24px;
            height: 22px;
            line-height: 22px;
            text-align: center;
            color: #fff;
            margin: 0;
            padding: 0;
            border: 1px solid #ccc;
            background-color: #fdfdfd;
        }

        .info-box > * {
            cursor: pointer;
        }

        .button-group {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
        }

        .button-group .info-box {
            margin-left: -60px;
        }

        .edit-box .edit.two .edit-title {
            padding-right: 4px;
        }

        .edit-box .edit .edit-input .label > span {
            max-width: unset;
            text-align: left;
            padding: 0 1em;
        }

        .a-button {
            color: #4169e3;
            margin: 8px 15px;
            padding: 4px 10px;
        }

        .button-box.delete-box {
            margin-right: 22px !important;
            margin-left: -419px !important;
        }

        .button-box.delete-box .pass {
            background-color: #f56c6c !important;
        }

        .pass.success {
            background-color: #09bb07 !important;
        }

        .pass.default {
            background-color: #adadad !important;
        }

        .el-table td, .el-table th {
            padding: 4px 0;
        }

        .top-button-group {
            margin-top: 20px;
        }

        .top-button-group button {
            margin-bottom: 12px;
        }

        .el-radio-button--mini.info .el-radio-button__inner {
            color: #909399 !important;
            background: #f4f4f5 !important;
            border-color: #d3d4d6 !important;
        }

        .default .el-radio-button__orig-radio + .el-radio-button__inner {
            color: #409eff;
            background: #ecf5ff;
            border-color: #b3d8ff;
        }

        .success .el-radio-button__orig-radio + .el-radio-button__inner {
            color: #67c23a;
            background: #f0f9eb;
            border-color: #c2e7b0;
        }

        .success .el-radio-button__orig-radio:checked + .el-radio-button__inner,
        .default .el-radio-button__orig-radio:checked + .el-radio-button__inner {
            color: #FFF;
            background-color: #409EFF;
            border-color: #409EFF;
            -webkit-box-shadow: -1px 0 0 0 #409EFF;
            box-shadow: -1px 0 0 0 #409EFF
        }


    </style>
    <script>
        function prettyPrint(obj) {
            var ENDLINE = "\n";
            var COMMA_ENDLINE = ",\n";
            var OBJ_BEGIN = "{";
            var OBJ_END = "}";
            var ARR_BEGIN = "[";
            var ARR_END = "]";
            var INDNET_SPACES = 4;

            return (function innerPrettyPrint(obj, spaces) {
                var type = typeof obj;
                if (type == "number" || type == "boolean") {
                    return obj.toString();
                } else if (type == "string") {
                    if (obj != "" && !isNaN(Number(obj))) {
                        return Number(obj)
                    }
                    return '"' + obj + '"';
                } else {
                    var entries = [];
                    var thisIndent = ' '.repeat(spaces);
                    var subIndent = thisIndent + ' '.repeat(INDNET_SPACES);
                    var subSpaces = spaces + INDNET_SPACES;
                    if (Object.prototype.toString.call(obj) == '[object Object]') {
                        for (var k in obj) {
                            entries.push('"' + k + '": ' + innerPrettyPrint(obj[k], subSpaces));
                        }
                        return OBJ_BEGIN + ENDLINE + subIndent + entries.join(COMMA_ENDLINE + subIndent) + ENDLINE + thisIndent + OBJ_END;
                    } else if (Object.prototype.toString.call(obj) == '[object Array]') {
                        obj.forEach(function (a) {
                            entries.push(innerPrettyPrint(a, subSpaces));
                        });
                        return ARR_BEGIN + ENDLINE + subIndent + entries.join(COMMA_ENDLINE + subIndent) + ENDLINE + thisIndent + ARR_END;
                    } else if (obj === null) {
                        return "null";
                    } else {
                        return obj.toString();
                    }
                }
            })(obj, 0);
        }
    </script>
</head>
<body>
<main id="app">
    <div class="content" :class="{mm:showPop}">
        <!--文章区-->
        <div class="article">
            <div class="top-button-group">
                <el-radio-group v-model="activeLabel" size="mini">
                    <el-radio-button class="default" label="原文"></el-radio-button>
                    {{if .T.info.filetext}}
                    <el-radio-button class="default" label="附件"></el-radio-button>
                    {{end}}
                </el-radio-group>

                <el-radio-group v-model="activeLabel" v-for="(item, index) in otherInfo" size="mini">
                    <el-radio-button class="success" :label="item.id">[[item.subtype]]</el-radio-button>
                    <el-radio-button class="success" :label="item.id + '-附件'">附件</el-radio-button>
                </el-radio-group>

                <el-radio-group v-if="moreInfo&&moreInfo.length > 0" size="mini">
                    <el-popover
                            placement="right-end"
                            trigger="hover">
                        <el-table :data="moreInfo" max-height="300">
                            <el-table-column width="50" property="subtype" label="类型"></el-table-column>
                            <el-table-column width="180" property="publishtime" label="发布日期"></el-table-column>
                            <el-table-column width="220" property="title" label="标题">
                                <template slot-scope="scope">
                                    <a href="#" @click="openLink(scope.row.href)">[[scope.row.title]]</a>
                                </template>
                            </el-table-column>
                        </el-table>
                        <el-radio-button class="info" slot="reference" style="border-color: #d3d4d6;">更多
                        </el-radio-button>
                    </el-popover>
                </el-radio-group>
            </div>

            <hr style="border: 1px;" width="100%">
            <br><a v-if="getPageInfo.href.length > 0" :href="getPageInfo.href" target="_blank">查看原文</a>
            <!--<a href="{{.T.jyhref}}" target="_blank">剑鱼链接</a>-->
            <h3>[[getPageInfo.title]]</h3><br>

            <div v-html="pageHtml"></div>
        </div>
        <!--操作区-->
        <div class="operation">
            <!--edit-box-->
            <div class="edit-box">
                <!--edit-->
                <div class="edit one" v-for="(one,oindex) in editData" :key="oindex">
                    <!--one-->
                    <div class="edit-title" @click="one.show = !one.show">
                        <span>[[one.title]]</span>
                        <div class="button-group">
                            <div v-if="one.showCheck">
                                <input :id="one.title" v-show="one.title == '标的信息'" @click.stop type="checkbox"
                                       v-model="one.checkAllTag">
                                <label @click.stop v-show="one.title == '标的信息'" :for="one.title">全部标注</label>
                            </div>
                            <!-- &nbsp;
                             <div v-if="one.showCheck">
                                 <input :id="one.title" @click.stop type="checkbox" v-model="one.checkType">
                                 <label @click.stop :for="one.title">是否抽取</label>
                             </div>-->
                            <div class="button-box">
                                <!--v-show="one.title == '基本字段'"-->
                                <button class="pass success" @click.stop="saveDataOne(one,'1')"
                                        style="font-size: 14px;width: auto;float:left;">通过
                                </button>
                                <button class="pass default" @click.stop="saveDataOne(one,'-1')"
                                        style="font-size: 14px;width: auto;float:left">取消
                                </button>
                                <!--              						  <button class="pass" @click.stop="open(one, true)"  style="font-size: 14px;width: auto;float:left">保存</button>-->
                            </div>
                            <!--<button class="add" v-show="one.title != '基本'" @click.stop="one.content.push(getTemp(2));goMark2(500)">+</button>-->
                            <!--<button class="add" v-show="one.title == '基本'" @click.stop="one.content[0].content.push(getTemp(3));goMark2(60)">+</button>-->
                            <div class="info-box" @click.stop v-show="one.showCheck">
                                <div :class="{default: one.status == '-1'}" @click="setStatus(one,'-1')"></div>
                                <!--<div :class="{ok: one.status == '1'}" @click="one.status = '1'"></div>-->
                                <div :class="{ok: one.status == '1'}" @click="setStatus(one,'1')"></div>
                                <!--<div :class="{err: one.status == '0'}" @click="one.status = '0'"></div>-->
                                <div class="add-tip" :class="{err: (one.status != '1' && one.status != '-1')}"
                                     @click="setStatus(one,'2')"></div>
                            </div>

                        </div>
                    </div>
                    <transition tag="div">
                        <div>
                            <div class="button-box" v-if="one.showCheck&&one.show">
                                <button class="pass a-button" @click.stop="addChild(one, oindex)"
                                        style="font-size: 14px;width: auto;float:left;">新增[[one.title]]
                                </button>
                            </div>
                            <div class="edit-content" :class="{t:one.title == '基本字段'}" v-show="one.show">
                                <!--two-->

                                <span v-show="one.content.length === 0">当前您还没有添加子包</span>
                                <div class="edit two" v-for="(two,index) in one.content" :key="index">
                                    <div class="edit-title" v-if="two.title" @click="two.show = !two.show">
                                        <span>[[two.title]]</span>
                                        <div class="button-box"
                                             :style="one.title == '多包信息' ? 'margin-right: 193px' : ''">
                                            <button v-if="one.title == '多包信息'" class="pass a-button"
                                                    @click.stop="addThreeChild(two,'2',one)"
                                                    style="font-size: 14px;margin: 0;width: auto;float:left;">新增子包中标信息
                                            </button>
                                            <button class="pass success" @click.stop="saveDataTwo(two,'1',one)"
                                                    style="font-size: 14px;width: auto;float:left;">通过
                                            </button>
                                            <button class="pass default" @click.stop="saveDataTwo(two,'-1',one)"
                                                    style="font-size: 14px;width: auto;float:left">取消
                                            </button>
                                        </div>
                                        <div class="button-box delete-box">
                                            <button class="pass" @click.stop="delNewTwo(one, index, two)">删除</button>
                                        </div>
                                    </div>
                                    <transition tag="div">
                                        <div class="edit-content" v-show="two.show">
                                            <!--input-->
                                            <div class="edit-input">
                                                <div v-for="(uin, uindex) of two.uInput" class="input-box"
                                                     :key="uin.title">
                                                    <div class="label" v-if="uin.selectArr">
                                                        <span>[[uin.title]]&nbsp;:&nbsp;</span>
                                                        <select v-model="uin.select"
                                                                @change="focusFn(uin, oindex,index,uindex, two, one)">
                                                            <option disabled value="">请选择</option>
                                                            <option v-for="o in uin.selectArr">[[o]]</option>
                                                        </select>
                                                        <div class="info-box">
                                                            <div :class="{default: uin.status == '-1'}"
                                                                 @click="setStatus(uin,'-1', two, one)"></div>
                                                            <div :class="{ok: uin.status == '1'}"
                                                                 @click="setStatus(uin,'1', two, one)"></div>
                                                            <!--<div :class="{err: uin.status == '0'}" @click="uin.status = '0'"></div>-->
                                                            <div class="add-tip" @click="setStatus(uin,'2', two, one)"
                                                                 :class="{err: (uin.status != '1' && uin.status != '-1')}"></div>

                                                        </div>
                                                    </div>
                                                    <div class="label" v-else :title="uin.input">
                                                        <span @click="goText(uin.title)">[[uin.title]]&nbsp;:&nbsp;</span>
                                                        <input type="text" v-model="uin.input"
                                                               @focus="goText(uin.input)" @click="goText(uin.input)"
                                                               @blur="focusFn(uin, oindex, index, uindex,two,one)">
                                                        <div class="info-box">
                                                            <div :class="{default: uin.status == '-1'}"
                                                                 @click="setStatus(uin,'-1', two, one)"></div>
                                                            <div :class="{ok: uin.status == '1'}"
                                                                 @click="setStatus(uin,'1', two, one)"></div>
                                                            <!--<div :class="{err: uin.status == '0'}" @click="uin.status = '0'"></div>-->
                                                            <div class="add-tip" @click="setStatus(uin,'2', two, one)"
                                                                 :class="{err: (uin.status != '1' && uin.status != '-1')}"></div>

                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <!--three-->
                                            <!--<div>
                                                                     <div class="edit-title" v-show="one.title == '基本字段'">
                                                    <span>候选人</span>
                                                    <div class="info-box" >
                                                        <div :class="{default: two.wstatus == '-1'}" @click="two.wstatus = '-1'"></div>
                                                        <div :class="{ok: two.wstatus == '1'}" @click="two.wstatus = '1'"></div>
                                                        <el-popover trigger="click" >
                                                          <div style="text-align: right; margin: 0">
                                                            <el-button type="success" size="mini" @click="two.wstatus = '2'">新增</el-button>
                                                            <el-button type="warning" size="mini" @click="two.wstatus = '3'">修改</el-button>
                                                            <el-button type="danger" size="mini" @click="two.wstatus = '4'">删除</el-button>
                                                          </div>
                                                          <div class="add-tip" slot="reference" :class="{err: (two.wstatus != '1' && two.wstatus != '-1')}">[[textMap[two.wstatus] || '']]</div>
                                                        </el-popover>
                                                    </div>
                                                </div>
                                                <div class="edit three" v-for="(three,index) in two.content" :key="index">
                                                    <div class="edit-title" @click="three.show = !three.show">
                                                        <span>[[three.title]]</span>
                                                    </div>
                                                    <div class="edit-content" v-show="three.show">
                                                        <div class="edit-input">
                                                            <div class="input-box" v-for="(threeUin,index) in three.uInput" :key="threeUin.title">
                                                                <div class="label">
                                                                    <span @click="goText(threeUin.title)">[[threeUin.title]]&nbsp;:&nbsp;</span>
                                                                    <input type="text" v-model="threeUin.input" @focus="goText(threeUin.input)" @click="goText(threeUin.input)">
                                                                    <div class="info-box">
                                                                        <div :class="{default: threeUin.status == '-1'}" @click="threeUin.status = '-1'"></div>
                                                                        <div :class="{ok: threeUin.status == '1'}" @click="threeUin.status = '1'"></div>
                                                                      <el-popover trigger="click" >
                                                                        <div style="text-align: right; margin: 0">
                                                                          <el-button type="success" size="mini" @click="threeUin.status = '2'">新增</el-button>
                                                                          <el-button type="warning" size="mini" @click="threeUin.status = '3'">修改</el-button>
                                                                          <el-button type="danger" size="mini" @click="threeUin.status = '4'">删除</el-button>
                                                                        </div>
                                                                        <div class="add-tip" slot="reference" :class="{err: (threeUin.status != '1' && threeUin.status != '-1')}">[[textMap[threeUin.status] || '']]</div>
                                                                      </el-popover>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>-->

                                        </div>
                                    </transition>
                                </div>
                            </div>
                        </div>
                    </transition>
                </div>
            </div>
            <div class="save-box">
<!--                 <button  class="code" @click.stop="showPop = true" style="width:100px">源码</button>&nbsp;&nbsp;-->
                <!--                 <button  class="code" @click.stop="open(1)" style="width:100px">全部验证</button> -->
<!--                <button class="code" @click.stop="open(2)" style="width:100px">字段验证</button>-->
                <button  class="code" @click.stop="open(2)" style="width:100px">保存</button>&nbsp;&nbsp;
                <button class="code" @click.stop="openHref" style="width:100px">下一条</button>
                <!--<button  class="code" @click.stop="window.location.href='/'" style="width:100px">下一条</button>-->
            </div>
        </div>
    </div>
    <!--弹出层-->
    <dialog class="dialog" v-if="showPop">
        <span class="close" @click="showPop = false;changeText()">x</span>
        <div class="pop">
            <div class="title">源码</div>
            <div class="con" ref="text" contentEditable="true">
                <pre v-html="addStyle(editData)"></pre>
            </div>
            <button @click="showPop = false;changeText();upChange()">保&nbsp;存</button>
        </div>
    </dialog>
    <dialog id="com-alert" class="dialog" style="background: rgba(124, 124, 125, 0.1);z-index:9999;display: none;">
        <div class="pop" style="background: rgba(124, 124, 125, 0.1);">
            <div id="com-alert-val" class="title" style="color:red">保存成功</div>
        </div>
    </dialog>
</main>

</body>

<script>

    let did = {{ .T.did }}      // 数据id
    let pid = {{ .T.pid }}      // 项目id
    let tid = {{ .T.tid }}
    let coll = {{ .T.coll }}    // 表名
    var allCheckFields = {{ .T.fields }}          //本次需标注的所有字段
    console.log(allCheckFields)
    var moreInfo = {{ .T.moreInfo }}            // 更多关联信息
    var otherInfo = {{ .T.otherInfo }}          //公告关联信息

    let purchasing_status = {{ .T.ck_purchasinglist }}      //标的物标记
    let purchasing_all_tag = {{ .T.ck_pclistag }}           // 标的物是否全部标记
    let package_status = {{ .T.ck_package }}                //包标记
    let winneroder_status = {{ .T.ck_winnerorder }}         //中标候选人标记
    // 页面数据
    var pageDataMap = {
        '原文': {
            title: '{{.T.info.title}}',
            href: '{{.T.info.href}}',
            // html: '{{Html (Regexp (Regexp .T.info.detail "(\\n|\\\\n)\\s+" "\n") "(`|\\n|\\\\n)+" "<br/>")}}',
            html: '{{ .T.info.detail }}',
        },
        '附件': {
            title: '附件内容',
            href: '',
            // html:{{if .T.info.filetext}}{{.T.info.filetext}}.replace(/(\\n|\\\\n)\\s+/, '\n').replace(/(`|\\n|\\\\n)+/, '<br>'){{else}}``{{end}} }
            html: '{{ .T.info.filetext }}',
        },
    }

    //快捷键
    $(document).keydown(function (event) {
        if (!event.shiftKey) {
            var text = getSelectedContents();//获取选中文本
            if (!text.trim().length) {
                return
            }
        }

        if (event.keyCode === 82) {//项目名称快捷键r
            if (event.shiftKey) {
                app.changeBaseValue(0, '', 2) //删除对应文本
            } else {
                app.changeBaseValue(0, text, 2)//填充
            }
        } else if (event.keyCode === 81) {//省份快捷键q
            if (event.shiftKey) {
                app.changeBaseValue(1, '', 2) //删除对应文本
            } else {
                app.changeBaseValue(1, text, 2)//填充
            }
        } else if (event.keyCode === 84) {//项目编号快捷键t
            if (event.shiftKey) {
                app.changeBaseValue(2, '', 2) //删除对应文本
            } else {
                app.changeBaseValue(2, text, 2)//填充
            }
        } else if (event.keyCode === 87) {//城市快捷键w
            if (event.shiftKey) {
                app.changeBaseValue(3, '', 2) //删除对应文本
            } else {
                app.changeBaseValue(3, text, 2)//填充
            }
        } else if (event.keyCode === 69) {//区县快捷键e
            if (event.shiftKey) {
                app.changeBaseValue(5, '', 2) //删除对应文本
            } else {
                app.changeBaseValue(5, text, 2)//填充
            }
        } else if (event.keyCode === 65) {//预算快捷键a
            if (event.shiftKey) {
                app.changeBaseValue(6, '', 2) //删除对应文本
            } else {
                app.changeBaseValue(6, text, 2)//填充
            }
        } else if (event.keyCode === 90) {//中标金额快捷键z
            if (event.shiftKey) {
                app.changeBaseValue(7, '', 2) //删除对应文本
            } else {
                app.changeBaseValue(7, text, 2)//填充
            }
        } else if (event.keyCode === 83) {//采购单位快捷键s
            if (event.shiftKey) {
                app.changeBaseValue(8, '', 2) //删除对应文本
            } else {
                app.changeBaseValue(8, text, 2)//填充
            }
        } else if (event.keyCode === 88) {//代理机构快捷键x
            if (event.shiftKey) {
                app.changeBaseValue(9, '', 2) //删除对应文本
            } else {
                app.changeBaseValue(9, text, 2)//填充
            }
        } else if (event.keyCode === 68) {//中标单位快捷键d
            if (event.shiftKey) {
                app.changeBaseValue(10, '', 2) //删除对应文本
            } else {
                app.changeBaseValue(10, text, 2)//填充
            }
        }
    });

    //获取鼠标选中的文本
    function getSelectedContents() {
        var text = "";
        if (window.getSelection) { //chrome,firefox,opera
            var range = window.getSelection().getRangeAt(0);
            var container = document.createElement('div');
            container.appendChild(range.cloneContents());
            text = container.innerHTML;
            //return container.innerHTML;
            //return window.getSelection(); //只复制文本
        } else if (document.getSelection) { //其他
            var range = document.getSelection().getRangeAt(0);
            var container = document.createElement('div');
            container.appendChild(range.cloneContents());
            text = container.innerHTML;
            //return container.innerHTML;
            //return document.getSelection(); //只复制文本
        } else if (document.selection) { //IE特有的
            text = document.selection.createRange().htmlText;
            //return document.selection.createRange().htmlText;
            //return document.selection.createRange().text; //只复制文本
        }
        text = text.replace(/(\r|\n|\s+|&nbsp;|<[^>]*>|<\/[^>]*)/g, "")
        return text;
    }

    //记录是否点击保存
    var issave = false;
    var nextid = {{ .T.nextid }}
    //基本信息
    var common = {{ .T.common }}
    var uInput = [];
    for (k in common) {
        var tmp = {}
        tmp.title = common[k].descript
        tmp.input = common[k].value
        tmp.key = common[k].key
        if (common[k].key === "subtype") {
            tmp.select = common[k].value
            tmp.selectArr = {{ .T.topsubtype }}
        }
        if (common[k].key === "attach_discern") {
            tmp.select = common[k].value
            tmp.selectArr = ['识别有效', '识别无效']
        }
        if (common[k].key === "attach_ext") {
            tmp.select = common[k].value
            tmp.selectArr = ['抽取正确', '抽取错误']
        }
        if (common[k].key === "isrepeat") {
            tmp.select = common[k].value
            tmp.selectArr = ['是', '否']
        }
        tmp.status = common[k].status
        if (common[k].key === "bidamounttype") {
            tmp.select = common[k].value ? common[k].value : '金额'
            tmp.selectArr = ['金额', '折扣率', '单价']
            tmp.status = 1
        }
        uInput[k] = tmp
    }
    //时间地点
    var timeplace = {{ .T.timeplace }}
    var tpInput = [];
    for (k in timeplace) {
        var tmp = {}
        tmp.title = timeplace[k].descript
        tmp.input = timeplace[k].value
        tmp.key = timeplace[k].key
        tmp.status = timeplace[k].status
        tpInput[k] = tmp
    }

    //其他信息
    var other = {{ .T.other }}
    var otherInput = [];
    for (k in other) {
        var tmp = {}
        tmp.title = other[k].descript
        tmp.input = other[k].value
        tmp.key = other[k].key
        tmp.status = other[k].status
        if (other[k].key === "isppp" || other[k].key === "contract_guarantee" || other[k].key === "bid_guarantee") {
            tmp.select = other[k].value
            tmp.selectArr = ['是', '否']
        }
        otherInput[k] = tmp
    }

    //中标候选人
    var c_worder = {{ .T.worder }}
    var worder_new = {{ .T.worder_new }}
    var c_content = [];
    for (k in c_worder) {
        var c_uInput = [];
        for (i in c_worder[k]) {
            var tmp = {}
            tmp.title = c_worder[k][i].descript
            tmp.input = c_worder[k][i].value || ''
            tmp.key = c_worder[k][i].key
            tmp.status = c_worder[k][i].status
            c_uInput[i] = tmp
        }
        var content = {};
        content.title = "候选人"
        content.show = true
        content.status = worder_new[k]["status"]
        content.uInput = c_uInput
        content.isnew = worder_new[k]["isnew"] || false
        content.content = []
        c_content[k] = content
    }

    //标的信息
    var purchasinglist = {{ .T.purchasinglist }}
    var pcl_new = {{ .T.pcl_new }}
    var pcl_content = [];
    for (k in purchasinglist) {
        var c_uInput = [];
        for (i in purchasinglist[k]) {
            var tmp = {}
            tmp.title = purchasinglist[k][i].descript
            tmp.input = purchasinglist[k][i].value
            tmp.key = purchasinglist[k][i].key
            tmp.status = purchasinglist[k][i].status
            //if(purchasinglist[k][i].key== "pclisover"){
            //  tmp.select = purchasinglist[k][i].value ? purchasinglist[k][i].value : '是'
            //  //tmp.select=purchasinglist[k][i].value
            //  tmp.selectArr=['是','否']
            //}
            c_uInput[i] = tmp
        }
        var content = {};
        content.title = "标的物"
        content.show = true
        content.status = pcl_new[k]["status"]
        content.uInput = c_uInput
        content.isnew = pcl_new[k]["isnew"] || false
        content.content = []
        pcl_content[k] = content
    }

    //var ispackage='{{.T.ispackage}}'
    //子包信息
    var packs = {{ .T.packs }}
    var packskey = {{ .T.packskey }}
    var pkg_new = {{ .T.pkg_new }}
    //分包抽查，若果有分包，默认ok
    //if(packs.length>0&&ispackage=="1"){
    //	ck_package="1"
    //}
    var p_content = [];
    for (k in packs) {
        //子包基本信息
        var uInputs = [];
        var pack = packs[k]["pack"]
        for (i in pack) {
            var tmp = {}
            tmp.title = pack[i].descript
            tmp.input = pack[i].value
            tmp.key = pack[i].key
            tmp.status = pack[i].status
            if (pack[i].key === "bidamounttype") {
                tmp.select = pack[i].value ? pack[i].value : '金额'
                tmp.selectArr = ['金额', '折扣率', '单价']
                tmp.status = 1
            }
            uInputs[i] = tmp
        }

        //中标人信息
        var winnerall = packs[k]["winnerall"]
        for (i in winnerall) {
            var tmp = {}
            tmp.title = winnerall[i].descript
            tmp.input = winnerall[i].value
            tmp.key = winnerall[i].key
            tmp.status = winnerall[i].status
            uInputs.push(tmp)
        }
        var content = {};
        content.title = "子包";
        content.show = true;
        content.status = packs[k]["packstatus"];
        content.uInput = uInputs;
        content.isnew = pkg_new[k] || false
        content.num = packskey[k];
        p_content[k] = content;

    }

    var pclf = {{ .T.PurchasinglistField }}
    var pclfInput = []
    for (i in pclf) {
        for (key in pclf[i]) {
            var tempNode = {
                input: "",
                key: key,
                status: "2",
                title: pclf[i][key]
            }
            //if(key== "pclisover"){
            //  tempNode.select= '是'
            //  tempNode.selectArr=['是','否']
            //}
            pclfInput.push(tempNode)
        }
    }


    var wodf = {{ .T.WinnerorderField }}
    var wodfInput = []
    for (i in wodf) {
        for (key in wodf[i]) {
            wodfInput.push({
                input: "",
                key: key,
                status: "2",
                title: wodf[i][key]
            })
        }
    }
    var pf = {{ .T.PackageField }}
    var pfInput = []
    for (i in pf) {
        for (key in pf[i]) {
            var tempNode = {
                input: "",
                key: key,
                status: "2",
                title: pf[i][key]
            }
            if (key === "bidamounttype") {
                tempNode.select = '金额'
                tempNode.selectArr = ['金额', '折扣率', '单价']
            }
            pfInput.push(tempNode)
        }
    }
    var app = new Vue({
        el: '#app',
        delimiters: ["[[", "]]"],
        data: {
            activeLabel: '原文',
            nowLabel: ['原文'],
            otherInfo: otherInfo,
            moreInfo: moreInfo,
            scrollCache: {
                value: '',
                index: 0
            },
            textMap: ['', '', '增', '改', '删'],
            // pageHtml: `{{Html (Regexp (Regexp .T.info.detail "(\\n|\\\\n)\\s+" "\n") "(`|\\n|\\\\n)+" "<br/>")}}`,
            pageHtml: '{{ .T.info.detail }}',
            showPop: false,
            editData:[{
                title: '基本字段',
                show: true,
                status: "1",
                content: [{
                    title: '',
                    show: true,
                    delete: false,
                    //wstatus:"-1",
                    uInput: uInput
                    //content: c_content
                    }]
                }, {
                title: '时间地点',
                show: false,
                status: "1",
                content: [{
                    title: '',
                    show: true,
                    delete: false,
                    //wstatus:"-1",
                    uInput: tpInput
                    }]
                }, {
                title: '标的信息',
                show: false,
                showCheck: true,
                key: 'purchasinglist',
                //checkType: {{.T.ck_pclisext}},
                checkAllTag: purchasing_all_tag,
                status: purchasing_status,
                content: pcl_content
                }, {
                title: '多包信息',
                show:false,
                showCheck: true,
                key: 'package',
                // checkType: {{.T.ck_pkgisext}},
                status: package_status,
                content: p_content
                }, {
                title: '中标候选人信息',
                show: false,
                showCheck: true,
                key: 'winnerorder',
                // checkType: {{.T.ck_wodrisext}},
                status: winneroder_status,
                content: c_content
                }, {
                title: '其余信息',
                show:false,
                status:"1",
                content:[{
                    title: '',
                    show: true,
                    delete: false,
                    //wstatus:"-1",
                    uInput: otherInput
                  }]
                }],
            originData: []},
            watch: {
                //切换标签时更改正文内容
                'activeLabel':
                function () {
                    this.pageHtml = this.getPageInfo.html
                }},
            computed: {
                getPageInfo() {
                    var tempData = {
                        title: '',
                        html: this.pageHtml,
                        href: ''
                    }
                    //匹配原文或者原文附件
                    var originData = pageDataMap[this.activeLabel]
                    if (originData) {
                        tempData.title = originData.title
                        tempData.html = originData.html
                        tempData.href = originData.href
                    } else {//匹配原公告关联信息
                        var tempS = this.activeLabel.split('-')
                        var isFile = tempS.length === 2
                        var otherData = this.otherInfo.filter(v => v.id == tempS[0])
                        if (otherData.length > 0) {
                            tempData.title = otherData[0].title
                            tempData.html = otherData[0].detail
                            tempData.href = otherData[0].href
                            if (isFile) {
                                tempData.title = '附件内容'
                                tempData.html = otherData[0].filetext
                                tempData.href = ''
                            }
                        }
                    }
                    return tempData
                }
            },
            mounted() {
                // 缓存原始数据
                this.originData = JSON.parse(JSON.stringify([].concat(this.editData)))
            },
            methods: {
                // 当前输入框数据与原始数据比较
                focusFn(uin, oIndex, tIndex, uIndex, two, one) {
                    if (uin.key === "bidendtime" || uin.key === "bidopentime" || uin.key === "project_startdate" || uin.key === "project_completedate" ||
                        uin.key === "publishtime" || uin.key === "signaturedate") {
                        var val = uin.input
                        if (val !== "") {
                              var reg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])\s+(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/;
                              var regExp = new RegExp(reg);
                              if (!regExp.test(val)) {
                                  this.$message({
                                      message: uin.title + ",日期格式错误！正确格式：2006-01-02 15:04:05",
                                      type: 'warning',
                                      duration: 2000,
                                      offset: 300
                                  });
                                  return
                            }
                        }
                    }
                    var newNode = this.originData[oIndex].content[tIndex]
                    if (newNode == null) {//新增子模块处理
                        return
                    }
                    var oNode = newNode.uInput[uIndex]
                    if (oNode == null) {//新增中标人信息处理
                        return
                    }
                    var changeStatus = uin.input === oNode.input//多包中新增的中标信息报错
                    if (uin.select) {
                        changeStatus = uin.select === oNode.select
                    }
                    uin.status = changeStatus ? "1" : "2"
                        this.setStatus(uin, uin.status, two, one);
                    },
                openLink(link) {
                        window.open(link, '_blank')
                    },
                // 改变基本字段属性
                changeBaseValue(index, input, status) {
                    if (this.editData[0].content[0].uInput[index].input !== input) {
                        this.editData[0].content[0].uInput[index].input = input
                        this.editData[0].content[0].uInput[index].status = status
                    }
                },
                selectChange(uni, status, two, one) {
                        //状态更新
                        if (uni.status === '-1' || uni.status === '2') {
                            status = "2"
                        }
                        this.setStatus(uni, status, two, one)
                    },
                openHref() {
                    if (!issave) {
                        alert("请先保存数据！")
                    } else {
                        if (nextid === "") {
                            alert("数据已经全部标注完")
                        } else {
                            window.location.href = "/front/user/check/detail/?pid="+pid+"&tid="+tid+"&did="+nextid+"&s_sourceinfo="+coll
                        }
                    }
                },
                // 检查一级是否需要改变状态
                checkOneStatus: function (config) {
                    var tempObj = {
                        obj: config.type ? config.one : config.two
                    }
                    if (config.type) {
                        tempObj.list = config.one.content
                    } else {
                        tempObj.list = config.two.uInput
                    }
                    var statusList = [0, 0, 0, 0, 0]
                    for (var i in tempObj.list) {
                    var tempList = tempObj.list[i]
                    var tempIndex = Number(tempList.status)
                    if (tempIndex === -1) {
                        tempIndex = 0
                    }
                        statusList[tempIndex] = Number(statusList[tempIndex]) + 1
                    }
                    if (statusList[1] > 0) {
                        tempObj.obj.status = "1"
                    }
                    if (statusList[4] > 0 || statusList[3] > 0 || statusList[2] > 0) {
                        tempObj.obj.status = "2"
                    }
                    if (statusList[4] === tempObj.list.length) {
                        tempObj.obj.status = "4"
                    if (tempObj.obj.title === "标的信息" || tempObj.obj.title === "多包信息" || tempObj.obj.title === "中标候选人信息") {
                        tempObj.obj.status = "2"
                        }
                    }
                    if (statusList[3] === tempObj.list.length) {
                        tempObj.obj.status = "2"
                    }
                    if (statusList[2] === tempObj.list.length) {
                        tempObj.obj.status = "2"
                    }
                    if (statusList[0] === tempObj.list.length) {
                        tempObj.obj.status = "-1"
                    }
                    if (!config.type) {
                        this.checkOneStatus({
                            one: config.one,
                            two: config.two,
                            type: true
                        })
                    }
                },
                //切换状态按钮
                setStatus:function (witch, s, two, one) {
                    var key = witch.key
                    //校验日期格式
                    if (key === "bidendtime" || key === "bidopentime" || key === "project_startdate" || key === "project_completedate" ||
                        key === "publishtime" || key === "signaturedate") {
                        var val = witch.input
                        if (val !== "") {
                            var reg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])\s+(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/;
                            var regExp = new RegExp(reg);
                            if (!regExp.test(val)) {
                                this.$message({
                                    message: witch.title + ",日期格式错误！正确格式：2006-01-02 15:04:05",
                                    type: 'warning',
                                    duration: 2000,
                                    offset: 300
                                });
                                //alert(witch.title+",日期格式错误！正确格式：2006-01-02 15:04:05")
                                return
                            }
                        }
                    }
                    if (s === '2' && !one && !two && witch.content.length === 0) {
                        return
                    }
                    witch.status = s;
                    if (two) {
                        this.checkOneStatus({
                            one: one,
                            two: two,
                            type: false
                        })
                    }
                },
                //二级删除
                delNewTwo: function (one, index, two) {
                    //two.ck_isnew = false //目前点删除按钮页面直接不显示，但是集合索引位置不变，所以加了此代码
                    //two.show = false
                    if (two.isnew) {
                        one.content.splice(index, 1)
                    } else {
                        two.show = false
                        two.status = "4"
                        this.saveDataTwo(two, "4", one)
                    }
                    this.checkOneStatus({
                        one: one,
                        two: two,
                        type: true
                    })
                },
                /*add style*/
                addStyle: function (data) {
                    return prettyPrint(data).replace(/(checkAllTag|checkType|showCheck|wstatus|status|key|title|input|content|uInput|selectArr|select|show|true)/g, "<mark>$1</mark>")
                },
                /*同步修改源码*/
                changeText: function (boolean) {
                    try {
                        var tempText = JSON.parse(this.$refs.text.innerText.replace(/(\n|\s)/g, ''))
                        if (boolean) {
                            this.tagvalues = tempText
                        } else {
                            this.editData = tempText
                        }
                    } catch (err) {
                        alert('源码修改失败')
                    }
                },
                goText: function (value) {
                    /*重置Html*/
                    this.pageHtml = this.getPageInfo.html
                    if (!value) {
                        return false
                    }
                    var rs = new RegExp('(' + value + ')', 'gi')
                    //选中input框值文本高亮
                    if (rs.test(this.pageHtml)) {
                        this.pageHtml = this.pageHtml.replace(rs, '<mark>$1</mark>')
                        /*延迟查询dom,防止dom未插入*/
                        var $this = this
                        setTimeout(function () {
                            $this.goMark(value)
                        }, 150)
                    } else {
                        /*重置Html*/
                        this.pageHtml = this.getPageInfo.html
                    }
                },
                goMark: function (value) {
                    var mLength = document.querySelectorAll('mark').length
                    if (this.scrollCache.value === value) {
                        this.scrollCache.index = (this.scrollCache.index + 1) % mLength
                    } else {
                        this.scrollCache.index = 0
                    }
                    this.scrollCache.value = value
                    /*滚动到第一个mark*/
                    var temp = document.querySelectorAll('mark')[this.scrollCache.index]
                    $("mark").removeClass('focus')
                    $(temp).addClass('focus')
                    document.querySelector('.article').scrollTop = offset(temp).top - window.screen.height / 2
                },
                // markTag:function(n){
                //    $.ajax({
                //        url:"/markTag",
                //        method:"post",
                //        data: {tag:n,_id: did},
                //        success:function(res){
                //            if(res){
                //                document.getElementById("com-alert-val").innerHtml="标记成功";
                //                var label1 = document.getElementById("com-alert");
                //                label1.style.display="block";
                //                setTimeout(function(){label1.style.display="none";},1000)
                //            }
                //        }
                //    });
                // },
                addChild: function (one, oindex) {
                    var tempNode = {}
                    switch (one.title) {
                        case "标的信息": {
                            tempNode = {
                                //content: [],
                                show: true,
                                isnew: true,
                                status: "2",
                                title: "标的物",
                                uInput: JSON.parse(JSON.stringify(pclfInput))
                            }
                            break
                        }
                        case "多包信息": {
                            tempNode = {
                                //content: [],
                                show: true,
                                status: "2",
                                isnew: true,
                                title: "子包",
                                uInput: JSON.parse(JSON.stringify(pfInput))
                            }
                            break
                        }
                        case "中标候选人信息": {
                            tempNode = {
                                //content: [],
                                show: true,
                                status: "2",
                                isnew: true,
                                title: "候选人",
                                uInput: JSON.parse(JSON.stringify(wodfInput))
                            }
                            break
                        }
                    }
                    // if (one.status >= "2") {
                    //     one.status = '2'
                    // }
                    one.content.push(tempNode)
                    this.checkOneStatus({
                        one: one,
                        type: true
                    })
                    this.$nextTick(() => {
                        var tempN = $(".edit.one").eq(oindex).find(".edit-title")
                        var goTop = tempN.eq(tempN.length - 1).offset().top
                        setTimeout(() => {
                            $(".operation").scrollTop($(".operation").scrollTop() + goTop)
                        }, 150)
                    })
                },
                // 新增子包中标信息字段
                addThreeChild:function (two, n, one) {
                    two.uInput.push({
                        input: "",
                        key: 'winner',
                        status: "2",
                        title: '标段（包）中标单位'
                    })
                    two.uInput.push({
                        input: "",
                        key: 'bidamount',
                        status: "2",
                        title: '标段（包）中标金额'
                    })
                    two.status = "2"
                    this.checkOneStatus({
                        one: one,
                        two: two,
                        type: false
                    })
                },
                //保存
                saveDataTwo:function (two, n, one) {
                    two.uInput.forEach(function (v) {
                        var key = v.key
                        if (key === "bidendtime" || key === "bidopentime" || key === "project_startdate" || key === "project_completedate" ||
                            key === "publishtime" || key === "signaturedate") {
                            var val = v.input
                            if (val !== "") {
                                var reg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])\s+(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/;
                                var regExp = new RegExp(reg);
                                if (!regExp.test(val)) {
                                    this.$message({
                                        message: v.title + ",日期格式错误！正确格式：2006-01-02 15:04:05",
                                        type: 'warning',
                                        duration: 2000,
                                        offset: 300
                                    });
                                    //alert(v.title+",日期格式错误！正确格式：2006-01-02 15:04:05")
                                    return
                                }
                            }
                        }
                        if (n === "1" && v.status === "-1") {
                            v.status = n
                        } else if (n === "-1") {
                            v.status = n
                        } else if (n === "2") {
                            v.status = n
                        } else if (n === "4") {
                            v.status = n
                        }
                    });
                    two.status = n
                    this.checkOneStatus({
                        one: one,
                        two: two,
                        type: false
                    })
                  /**
                   two.content.forEach(function(v) {
                      v.uInput.forEach(function(value) {
                          if (value.input && value.input != '') {
                              value.status = n
                          }
                      })
                  })
                   */
                },
                saveDataOne:function (one, n) {
                    //保存后的样式
                    var _this = this
                    one.content.forEach(function (v) {
                        v.uInput.forEach(function (value) {
                            var key = value.key
                            if (n === "1") {
                                if (key === "bidendtime" || key === "bidopentime" || key === "project_startdate" || key === "project_completedate" ||
                                    key === "publishtime" || key === "signaturedate") {
                                    var val = value.input
                                    if (val !== "") {
                                        var reg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])\s+(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/;
                                        var regExp = new RegExp(reg);
                                        if (!regExp.test(val)) {
                                            this.$message({
                                                message: value.title + ",日期格式错误！正确格式：2006-01-02 15:04:05",
                                                type: 'warning',
                                                duration: 2000,
                                                offset: 300
                                            });
                                            //alert(value.title+",日期格式错误！正确格式：2006-01-02 15:04:05")
                                            return
                                        }
                                    }
                                }
                            }
                            // 取消全部，通过时判断状态是否处于修改新增等
                            if (n === "1" && value.status === "-1") {
                                value.status = n
                            } else if (n === "-1") {
                                value.status = n
                            }
                        })

                        _this.checkOneStatus({
                            two: v,
                            one: one,
                            type: false
                        })
                    });
                },
                //验证保存提示
                open:function (stype) {
                    this.$confirm('是否保存?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        this.upChange(stype)
                    }).catch(() => {
                    });
                },
                //保存事件
                upChange: function (stype) {
                    var noTagKey = [];
                    this.editData.filter(function (one) {
                        if (one.title === "标的信息" || one.title === "多包信息" || one.title === "中标候选人信息") {
                            if (allCheckFields[one.key] && one.status === "-1") {
                                noTagKey.push(one.title);
                            }
                        } else {
                            one.content.filter(function (v) {
                                v.uInput.filter(function (u) {
                                    if (allCheckFields[u.key] && u.status === "-1") {
                                        noTagKey.push(u.title);
                                    }
                                })
                            })
                        }
                    })
                    if (noTagKey.length > 0) {
                        var fieldText = noTagKey.join(",");
                        fieldText = fieldText.replace(/\([^\)]*\)/g, "");
                        this.$alert("未标注字段：" + fieldText);
                        return
                    }
                    var resultStatus = false
                    if (stype === 1) {//全部字段验证
                        var checkAllKey = this.editData.filter(function (one) {
                            var otherOne = one.content.filter(function (v) {
                                return v.uInput.filter(function (u) {
                                    return u.status === '-1'
                                }).length
                            })
                            if ((one.title === "标的信息" || one.title === "多包信息" || one.title === "中标候选人信息") && (one.status === "-1")) {
                                return true
                            } else {
                                return otherOne.length
                            }
                        })
                        resultStatus = !Boolean(checkAllKey.length)
                    } else {//部分字段验证
                        var otherTag = 0 //标注状态 0:没标 1:标注成功 2:标注失败
                        var baseTag = 0
                        this.editData.filter(function (one) {
                            //多包信息、中标候选人信息在为标注失败的前提下检测标注状态，一个失败不能保存
                            if (otherTag < 2) {
                                if (one.title === "标的信息" || one.title === "多包信息" || one.title === "中标候选人信息") {
                                    if (one.status === "-1") {//没标
                                        if (otherTag !== 1) {//前一个标注成功不用记录后一个是否未标
                                            otherTag = 0
                                        }
                                    } else {
                                        if (one.content.length === 0) {//不含子包
                                            if (one.status === '2') {
                                                otherTag = 2 //失败
                                            } else {
                                                otherTag = 1 //成功
                                            }
                                        } else {//含子包
                                            if (one.title === "标的信息") {
                                                var otherOne = one.content.filter(function (v) {
                                                    if (v.status >= 1) {//子信息标注
                                                        var twoLength = v.uInput.filter(function (u) {
                                                            return u.status === '-1'
                                                        })
                                                        if (twoLength.length > 0) {
                                                            otherTag = 2
                                                        }
                                                        return true //返回此条信息被标注
                                                    }
                                                })
                                                if (otherTag !== 2) {
                                                    if (otherOne.length > 0) {//
                                                        otherTag = 1
                                                    } else {
                                                        otherTag = 2
                                                    }
                                                }
                                            } else {
                                                var otherOne = one.content.filter(function (v) {
                                                    return v.uInput.filter(function (u) {
                                                        return u.status === '-1'
                                                    }).length
                                                })
                                                if (otherOne.length > 0) {//
                                                    otherTag = 2
                                                } else {
                                                    otherTag = 1
                                                }
                                            }
                                        }
                                    }
                                } else {
                                    var baseOne = one.content.filter(function (v) {
                                        return v.uInput.filter(function (u) {
                                            return u.status !== '-1'
                                        }).length
                                    })
                                    if (baseOne.length > 0) {//基本字段
                                        baseTag = 1
                                    }
                                }
                            }
                        })
                        if (otherTag === 0 && baseTag === 1) {
                            resultStatus = true
                        } else if (otherTag === 1) {
                            resultStatus = true
                        }
                    }
                    if (!resultStatus) {
                        this.$alert("未标注完成");
                        return
                    }
                    var d = JSON.stringify(this.editData);
                    var _this = this
                    $.ajax({
                        url: "/front/user/check/save",
                        type: "POST",
                        data: {"data": d, "s_infoid": did, "pid": pid, "s_sourceinfo": coll},
                        success: function(res) {
                            console.log(res)
                            if (res) {
                                _this.$message({
                                    message: '保存成功',
                                    type: 'success',
                                    duration: 1000,
                                    offset: 300
                                });
                                issave = true//保存成功
                            }
                        },
                        error: function(err) {
                            console.log(err)
                            alert(err);
                        }
                    });
                }
                //保存提示
                // open:function(one, type) {
                //     this.$confirm('是否保存?', '提示', {
                //         confirmButtonText: '确定',
                //         cancelButtonText: '取消',
                //         type: 'warning'
                //     }).then(() => {
                //         if (type) {
                //             this.saveOneData(one)
                //         } else {
                //             this.upChange()
                //         }
                //     }).catch(() => {
                //     });
                // },
                //一级保存
                //    saveOneData: function (one) {
                //        if (one.title==="标的信息"||one.title==="多包信息"||one.title==="中标候选人信息"){
                //            if(one.status ===  "-1"){
                //                this.$alert(one.title+" 未标注完成")
                //                return
                //            }else if (one.status !=="-1"){
                //                var isAlert = one.content.filter(function(v) {
                //                    return v.uInput.filter(function (u) {
                //                        return u.status === '-1'
                //                    }).length
                //                })
                //                if (isAlert.length) {
                //                    this.$alert(one.title+" 未标注完成")
                //                    return
                //                }
                //            }
                //        }
                //        onetext = "["+ JSON.stringify(one) +"]";
                //        $.ajax({
                //            url:"/center/biaozhu",
                //            method:"post",
                //            data: {key:onetext,_id:did},
                //            success:function(res){
                //                if(res){
                //                    document.getElementById("com-alert-val").innerHtml="保存成功";
                //                    var label1 = document.getElementById("com-alert");
                //                    label1.style.display="block";
                //                    setTimeout(function(){
                //                            label1.style.display="none";
                //                        },
                //                        1000)
                //                }
                //            },
                //            error:function(err){
                //                alert(err);
                //            }
                //        });
                //    },
      }
    })

    function offset(elem) {
        if (!elem) elem = this;

        var x = elem.offsetLeft;
        var y = elem.offsetTop;

        while (elem === elem.offsetParent) {
            x += elem.offsetLeft;
            y += elem.offsetTop;
        }
        return {left: x, top: y};
    }
</script>
</html>