zhangyanpeng
2024-05-29 1f227a1cf627526701c652ba84bae3e430bba8d3
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>资信情况</title>
        <script src="../../js/vue/vue.js"></script>
        <script src="../../js/vue/element-ui/lib/index.js"></script>
        <!-- <script src="="../../"></script> -->
        <script src="../../js/vue/page.js"></script>
        <script src="../../js/myelement.js"></script>
        
        <link href="../../js/vue/element-ui/lib/theme-chalk/index.css" rel="stylesheet">
        <link href="../../css/myelement.css" rel="stylesheet">
        <link href="../../css/iconfont.css" rel="stylesheet">
        <link href="../../css/page.css" rel="stylesheet">
        <link href="//at.alicdn.com/t/font_2374495_mkoo966o0uo.css" rel="stylesheet">
    </head>
    
    <body style="margin: 0px;">
        <div id="vbody">
            <div id="page_root">
                <div ref="popup_body" style="width: 500px;padding-right: 20px;">
                    <div class="el-dialog__header">
                        <div class="dialog-title">
                          <i class="iconfont icon-customermanagement"></i>
                          <span> {{formAttr.title}} </span>
                        </div>
                    </div>    
                    
                    <div class="el-dialog__body" style="padding: 20px 0px;">
                        <div style="height: 20px; line-height: 20px; padding: 0px 30px 10px 30px;">
                            <span style="float: left;"> {{formData.md_code}} </span>
                            <span style="float: left; margin-left: 10px;"> {{formData.md_description}} </span>
                            <el-button-group style="float: right;">
                                <el-upload action="https://jsonplaceholder.typicode.com/posts/" style="float: right;">
                                    <el-button type="primary" v-if="upload">点击上传</el-button>
                                </el-upload>
                                <el-button-group style="float: right;">
                                    <!-- <el-button @click="">协议查看</el-button> -->
                                </el-button-group>
                            </el-button-group>
                            
                        </div>
                        <!-- <div  style="height: 20px; line-height: 20px; padding: 0px 30px 10px 30px;">
                            <div>
                                <span style="float: left;">资信等级:</span>
                                <span style="float: left; margin-left: 10px;"> {{customerInfo.creditStatus}} </span>
                            </div>
                        </div> -->
                        
                        <div style="padding: 0px 100px;">
                            <h-form
                                ref="form1"
                                :form-attr="formAttr"
                                :table-fields="formFields"
                                :form-data="customerInfo"
                            >
                        </div>
                        <div  style="height: 20px; line-height: 20px; padding: 20px 70px 0px 70px;">
                            <div style="float: right;">
                                <span style="float: left;">信用额度:</span>
                                <span style="float: left; margin-left: 10px;"> 20600 </span>
                            </div>
                        </div>
                    </div>
                    <div class="el-dialog__footer">
                      <el-button type="default" @click="closeDialog">取 消</el-button>
                    </div>
                </div>
            </div>
            
            <div id="page_loading" style="position: absolute; top:0px; width: 100vw; height: 50vh;">
                <div class="spinner">
                  <div class="cube1"></div>
                  <div class="cube2"></div>
                </div>
            </div>
        </div>    
        
        <script type="text/javascript">
            new Vue({
                el: "#vbody",
                data: {
                    upload:false,
                    formAttr: {
                        istitle: false,
                        title: "资信信息",
                        columnnumber: 1,
                        labelwidth: "100px",
                        labelposition: "left",
                        size: "medium",
                        border: "0px solid #c6c6c600"
                    },
                    customerInfo: {
                        customerCode: "D2039348",
                        customerName: "兰州强生医药集团有限公司",
                        creditStatus: "AAA",
                        creditLine: "50000",
                        rebatesAvailable: "20000",
                        unPaid: "38200 (逾期20天未付款)",
                        intransit: "11200"
                    },
                    formFields: [
                        // {field: "creditLine", name: "授信", isshow: "T", align: "right", disabled: true},
                        {field: "rebatesAvailable", name: "可用返利", isshow: "T", align: "right", disabled: true},
                        {field: "unPaid", name: "未付款", isshow: "T", align: "right", disabled: true},
                        // {field: "intransit", name: "在途金额", isshow: "T", align: "right", disabled: true},
                    ],
                    
                    formData: {},
                },
                
                created() {
                    this.tableData_new = dataRoot.database.docNumber;
                    this.tableData_old = clone(dataRoot.database.docNumber);
                    this.popupParames = clone(Root.popupParames);
                },
                
                mounted() {
                    if (this.popupParames.disabledone) {
                        this.upload=true;
                    }
                    if (this.popupParames.data) {
                        this.formData = clone(this.popupParames.data);
                        let  result = [];
                        if (this.formData.field1) {
                            result = this.tableData_new.filter(item => {
                                let bo = true;
                                let k_val = this.formData.field1;
                                let bo_ = item.field1.toLowerCase().indexOf(k_val.toLowerCase()) > -1;
                                if (!bo_) {
                                    return false;
                                }
                                return bo;
                            });
                        }
                        
                        this.tableData2 = result;
                    }
                    this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
                        document.getElementById('page_root').style.display =  "block";
                        document.getElementById('page_loading').style.display =  "none";
                        
                        //重新设置弹窗宽高
                        this.$nextTick(function(){
                            let w_ = this.$refs.popup_body.offsetWidth + "px";
                            let h_ = this.$refs.popup_body.offsetHeight + "px";
                            Root.setPopupWH(w_, h_);
                        })
                    });
                },
                
                methods:{
                    closeDialog() {
                        Root.hidePopup();
                    },
                    //表单
                    showPopup(obj) {
                        this.selectFormField = obj.obj;
                        this.popupByFieldsDialog = true;
                    },
                    saveFormValByField(val) {
                        this.popupByFieldsDialog = false;
                        this.$refs.form1.setFormValByField(this.selectFormField, val);
                    },
                    
                }
            });
        </script>
    </body>
</html>