apply-clients 3.0.2 → 3.0.5-2

package/src/components/product/Function/functions/BuyerMessage.vue

@@ -0,0 +1,522 @@
+<template>
+  <div class="auto col-sm-12" style="padding-right:5px;" v-if="templateshow">
+    <div class="panel panel-info">
+      <div class="panel-heading" v-if="title_show">
+        <h3 class="panel-title text-center"><span style="cursor: pointer;" class="pull-left">{{title}}</span></h3>
+      </div>
+      <div class="col-sm-12" v-for="(i,datagrid) in data.onetomany">
+        <table v-show="!datagrid.hidden" class="table table-bordered table-striped table-hover">
+          <tr style="background-color: #00A3F0">
+            <th style="border-color: #00A3F0"><font color="white">序号</font></th>
+            <th v-for="labels in datagrid.fields" style="text-align: center;border-color: #00A3F0">
+              <nobr><font color="white">{{labels.label}}</font></nobr>
+            </th>
+            <th style="text-align: center;border-color: #00A3F0;padding: 0px" v-if="showprint">
+              <button type="button" @click="$dispatch('add',i)" class="btn btn-warning">
+                +
+              </button>
+            </th>
+          </tr>
+          <tr v-for="(j,row) in model.rows[i]">
+            <td style="text-align: center">{{$index+1}}</td>
+            <td v-for="key in surBodyData[i]" style="text-align: center">
+              {{row[key]}}
+            </td>
+            <td style="text-align: center">
+              <a href="#" @click="revise(i,j)" v-if="showprint">修改</a>
+              |<a href="#" @click="deleted(i,j)" v-if="showprint">删除</a>
+            </td>
+          </tr>
+        </table>
+      </div>
+      <!-- onetomany新增模态框 -->
+      <div class="auto"
+           style="margin-left: 20vw;max-width: 700px;max-hight:500px;z-index:8888;box-shadow: 0px 0px 100px 10px grey;position: fixed;"
+           v-if="showadd">
+        <div class="auto" style="background-color:white;">
+          <div style="padding-top: 15px;padding-left: 15px;padding-right: 15px;border-bottom: 0px solid #e5e5e5;">
+            <span><font size="3">{{modeltitle}}</font></span>
+            <button type="button;float:right" class="close" @click="closemodal(modeltitle)"><span>&times;</span>
+            </button>
+          </div>
+                     
+          <div style="padding-top: 15px;border-top: 1px solid #e5e5e5;border-bottom: 1px solid #e5e5e5;">
+            <div class="col-sm-12" v-for="(index,showadd_field) in showadd_fields.fields" v-if="refresh_modal">
+              <label
+                :class="showadd_field.required&&!showadd_fields.fields[index].value?'has-error control-label col-sm-3' : 'control-label col-sm-3'"
+                style="margin-top: 10px" v-if="!showadd_field.hidden">{{showadd_field.label}}：</label>
+              <div class="col-sm-7">
+                <!--时间datepicker-->
+                <div v-if="showadd_field.type=='datepicker'"
+                     :class="[showadd_fields[index].required&&!(showadd_fields.fields[index].value) ? 'has-error' : '']">
+                  <div>
+                    <datepicker
+                      :width="'100%'"
+                      :placeholder="showadd_field.placeholder"
+                      :value.sync="showadd_fields.fields[index].value"
+                      :format="'yyyy-MM-dd HH:mm:ss'"
+                      v-model="showadd_fields.fields[index].value"
+                      :readonly=true
+                      :disabled="showadd_fields.fields[index].disabled"
+                      @blur="check_disable"
+                      :show-reset-button="reset">
+                    </datepicker>
+                  </div>
+                </div>
+                <!--select-->
+                <input-select
+                  @change="select_change_modal(index),disabled_check_modal(showadd_fields.fields[index].required,showadd_fields.fields[index].value)"
+                  v-if="showadd_field.type=='select'"
+                  :value.sync="showadd_fields.fields[index].value"
+                  v-model="showadd_fields.fields[index].value"
+                  :options='showadd_fields.fields[index].options'
+                  :class="showadd_field.required&&!showadd_fields.fields[index].value?'has-error form-control' : 'form-control'"
+                  @blur="check_disable_modal,disabled_check_modal(showadd_fields.fields[index].required,showadd_fields.fields[index].value)"
+                  :mouseout="check_disable_modal,disabled_check_modal(showadd_fields.fields[index].required,showadd_fields.fields[index].value)">
+                </input-select>
+                <!-- input -->
+                <input :for="showadd_fields.fields[index].value" :type="showadd_field.type"
+                       @change="select_change_modal(index),check_disable_modal,disabled_check_modal(showadd_fields.fields[index].required,showadd_fields.fields[index].value)"
+                       v-if="(showadd_field.type=='input'||showadd_field.type=='number'||showadd_field.type=='email'||showadd_field.type=='url'||showadd_field.type=='range'||showadd_field.type=='search'||showadd_field.type=='color')&&!showadd_field.hidden"
+                       v-model="showadd_fields.fields[index].value"
+                       :value.sync="showadd_fields[index].value"
+                       @blur="check_disable_modal,disabled_check_modal(showadd_fields.fields[index].required,showadd_fields.fields[index].value)"
+                       class="form-control"
+                       :mouseout="check_disable_modal,disabled_check_modal(showadd_fields.fields[index].required,showadd_fields.fields[index].value)"/>
+                <span
+                  v-if="showadd_fields.fields[index].error&&showadd_fields.fields[index].error.msg&&showadd_fields.fields[index].error.flag"
+                  style="color: red">{{showadd_fields.fields[index].error.msg}}</span>
+              </div>
+            </div>
+                     
+          </div>
+          <div
+            style="padding-top: 15px;padding-left: 15px;padding-right: 15px;text-align: right;border-top: 0px solid #e5e5e5;">
+            <button :class="disable_button_modal?'btn btn-default':'btn btn-primary'" v-show="showadd"
+                    :disabled="disable_button_modal" type="button" @click="acknowledge(modeltitle)">
+              确认
+            </button>
+          </div>
+           
+        </div>
+      </div>
+
+    </div>
+  </div>
+</template>
+<script>
+  import {HttpResetClass} from 'vue-client'
+  import Vue from 'vue'
+
+  export default {
+    title: '基本信息',
+    // props: ['griddata', 'gridtitle', 'selectdata'],
+    props: {
+      griddata: {
+        type: Object,
+        default: {}
+      },
+      selectdata: {
+        type: Object,
+        default: {}
+      },
+      showprint: {
+        type: Boolean,
+        default: true,
+      }
+    },
+    data() {
+      return {
+        templateshow: true,
+        title: '',
+        title_show: true,
+        tempid: null,
+        data: null,
+        surBodyData: [],
+        refresh: true, // 控制重新渲染
+        model: {
+          rows: [],
+          button: {
+            button_name: null,
+            button_index: null
+          },
+          f_filiale: null,
+          f_parentname: null,
+          f_operate_date: null,
+          f_operator: null
+        },
+        showadd: false, // onetomany 新增模态框
+        showadd_fields: [],  // onetomany 新增模态框的字段配置
+        data: null,
+        showadd_index: null,
+        showmodal: false,
+        modeltitle: null,
+        refresh_modal: true,
+        disable_button_modal: true,
+      }
+    },
+    ready() {
+      this.title = '购买方信息'
+      this.data = {
+        onetomany: [
+          {
+            tables: ["t_buyer_info"],
+            safedelete: true,
+            hidden: false,
+            fields: [
+              {
+                label: "购货方名称",
+                type: "input",
+                bootstraped: "col-sm-4",
+                label_bootstraped: "col-sm-3",
+                value_bootstraped: "col-sm-9",
+                field: "f_buyer_name",
+                placeholder: "请输入",
+                required: true,
+                readonly: false
+              },
+              {
+                label: "购货方纳税人识别号",
+                type: "input",
+                bootstraped: "col-sm-4",
+                label_bootstraped: "col-sm-3",
+                value_bootstraped: "col-sm-9",
+                field: "f_buyer_identify",
+                placeholder: "请输入",
+                readonly: false,
+                required: true,
+                disabled: false,
+                error: {
+                  flag: false,
+                  msg: '购货方纳税人识别号必须为15位，18位或者20位'
+                }
+              },
+              {
+                label: "购货方地址、电话",
+                type: "input",
+                bootstraped: "col-sm-4",
+                label_bootstraped: "col-sm-3",
+                value_bootstraped: "col-sm-9",
+                field: "f_buyer_addphone",
+                placeholder: "请输入",
+                readonly: false,
+                disabled: false
+              },
+              {
+                label: "购货方开户行及账号",
+                type: "input",
+                bootstraped: "col-sm-4",
+                label_bootstraped: "col-sm-3",
+                value_bootstraped: "col-sm-9",
+                field: "f_buyer_bank",
+                placeholder: "请输入",
+                readonly: false,
+                disabled: false
+              },
+              {
+                label: "购货方电子邮箱",
+                type: "email",
+                bootstraped: "col-sm-4",
+                label_bootstraped: "col-sm-3",
+                value_bootstraped: "col-sm-9",
+                field: "f_buyer_email",
+                placeholder: "请输入",
+                readonly: false,
+                disabled: false
+              }
+            ]
+          }
+        ]
+      }
+      this.load()
+    },
+    methods: {
+      // 模态框级联操作预留
+      select_change_modal(index) {
+        if (this.showadd_fields.fields[index].value) {
+          this.showadd_fields[index] = {}
+          this.showadd_fields[index].value = this.showadd_fields.fields[index].value
+        } else if (this.showadd_fields[index] && this.showadd_fields[index].value) {
+          this.showadd_fields.fields[index].value = this.showadd_fields[index].value
+        }
+        this.refresh_modal = false
+        this.$nextTick(() => {
+          this.refresh_modal = true
+        })
+        // this.$dispatch('select_cascade_modal', index)
+        if (this.showadd_fields.fields[index].label == '购货方纳税人识别号') {
+          if (this.showadd_fields.fields[index].value.length != 15 && this.showadd_fields.fields[index].value.length != 18 && this.showadd_fields.fields[index].value.length != 20) {
+            this.showadd_fields.fields[index].error.flag = true
+            this.clear_showadd_fields_value(index)
+          } else {
+            this.showadd_fields.fields[index].error.flag = false
+          }
+        }
+      },
+      // 清理
+      clear_showadd_fields_value(index) {
+        this.showadd_fields.fields[index].value = ''
+        this.showadd_fields[index].value = ''
+      },
+      // 检测模态框按钮的disable
+      disabled_check_modal(required, value) {
+        if (required && value) {
+          this.disable_button_modal = false
+
+          let fields = this.showadd_fields.fields
+          let flag = false
+          for (let i = 0; i < fields.length; i++) {
+            if (fields[i].type !== 'checkbox' && fields[i].required && !fields[i].value) {
+              flag = true
+            }
+          }
+          this.disable_button_modal = flag
+        }
+      },
+      check_disable_modal() {
+        let fields = this.showadd_fields.fields
+        let flag = false
+        for (let i = 0; i < fields.length; i++) {
+          if (fields[i].type !== 'checkbox' && fields[i].required && !fields[i].value) {
+            flag = true
+          }
+        }
+        let count = 0
+        for (let i = 0; i < fields.length; i++) {
+          if (fields[i].type !== 'checkbox' && !fields[i].required) {
+            count++
+          }
+        }
+        if (count = 0) {
+          flag = false
+        }
+        this.disable_button_modal = flag
+      },
+      // 删除
+      deleted(i, j) {
+        this.$showMessage("您确定要删除这条记录吗？", ['confirm']).then((res) => {
+          if (res == 'confirm') {
+            this.onetomanydelete(i, j)
+          }
+        })
+      },
+      // 修改
+      revise(index, index2) {
+        this.showadd_fields = []
+        let templet = new Object()
+        templet = this.data.onetomany[index]
+        for (let j = 0; j < templet.fields.length; j++) {
+          if (templet.fields[j].type == 'input') {
+            templet[j] = {}
+            templet[j].value = this.model.rows[index][index2][templet.fields[j].field]
+            templet.fields[j].value = this.model.rows[index][index2][templet.fields[j].field]
+          } else {
+            templet.fields[j].value = this.model.rows[index][index2][templet.fields[j].field]
+            if (templet.fields[j].type == 'datepicker') {
+              templet.fields[j].value = new Date().Format("yyyy-MM-dd HH:mm:ss")
+            }
+          }
+        }
+        this.tempid = this.model.rows[index][index2].id
+        this.modeltitle = '修改'
+        this.showadd_fields = templet
+        this.showadd_index = index
+        this.showadd = true
+      },
+      async onetomanydelete(i, j) {
+        let http = new HttpResetClass()
+        let data = {
+          tables: this.data.onetomany[i].tables,
+          row: this.model.rows[i][j]
+        }
+        await  http.load('POST', 'rs/logic/applyDeleteValue', {data: data}, {
+          resolveMsg: null,
+          rejectMsg: 'onetomanydelete失败'
+        }).then(() => {
+          this.$dispatch('selfsearch')
+          this.model.rows[i].splice(j, 1)
+        })
+      },
+      //获取view层confirm事件
+      async confirm(tables, row, showadd_index, j) {
+        var _this = this
+        for (let i = 0; i < tables.length; i++) {
+          let datas = {
+            tables: tables,
+            row: row
+          }
+          datas.row['f_process_id'] = this.selectdata.f_process_id
+          datas.row['f_apply_num'] = this.selectdata.f_apply_num
+          datas.row['f_filiale'] = this.selectdata.f_filiale
+          datas.row['f_operator'] = this.$login.f.name
+          datas.row['f_parentname'] = this.$login.f.f_parentname
+          datas.row['f_operator_date'] = new Date().Format("yyyy-MM-dd HH:mm:ss")
+          let http = new HttpResetClass()
+          if (tables[i] == 't_charge_record') {
+            await http.load('POST', 'rs/logic/applycharge', datas, {
+              resolveMsg: null,
+              rejectMsg: '收费保存失败'
+            }).then((res) => {
+              for (let i = 0; i < this.data.fields.length; i++) {
+
+                if (this.data.fields[i].label == '累计缴费金额') {
+                  this.data.fields[i].value = res.data.f_cumulative_money
+                }
+
+                if (this.data.fields[i].label == '未结总金额') {
+                  this.data.fields[i].value = res.data.f_unaccounts_money
+                }
+              }
+            })
+          } else {
+            await http.load('POST', 'rs/logic/saveentity', datas, {
+              resolveMsg: null,
+              rejectMsg: 'onetomany保存失败'
+            }).then((res) => {
+              this.load()
+            })
+          }
+        }
+      },
+      // 模态框点击确定按钮
+      acknowledge(val) {
+        let temp = {}
+        console.log('点击按钮后的this.showadd_fields.fields=>' + JSON.stringify(this.showadd_fields.fields))
+        for (let i = 0; i < this.showadd_fields.fields.length; i++) {
+          if (this.showadd_fields.fields[i].value) {
+            temp[this.showadd_fields.fields[i].field] = this.showadd_fields.fields[i].value
+          } else {
+            if(this.showadd_fields[i]&&this.showadd_fields[i].value){
+              temp[this.showadd_fields.fields[i].field] = this.showadd_fields[i].value
+            }
+          }
+        }
+        console.log('点击按钮后搜集到的页面数据temp=>' + JSON.stringify(temp))
+        if (val == '新增') {
+          console.log('即将新增记录，新增数据=>' + JSON.stringify(temp))
+          console.log('this.model.rows[this.showadd_index]=>' + JSON.stringify(this.model.rows[this.showadd_index]))
+          this.model.rows[this.showadd_index].push(temp)
+          this.confirm(this.data.onetomany[this.showadd_index].tables, temp, this.showadd_index, this.model.rows[this.showadd_index].length - 1)
+          this.closemodal(val)
+        } else if (val == '修改') {
+          console.log(`修改信息=======>${JSON.stringify(temp)}`)
+          temp.id = this.tempid
+          this.confirm(this.data.onetomany[this.showadd_index].tables, temp, this.showadd_index, this.model.rows[this.showadd_index].length - 1)
+          this.closemodal(val)
+        }
+      },
+      // 关闭模态框
+      closemodal() {
+        console.log('进入关闭模态框方法，先清空数据this.showadd_fields,目前数据=>' + JSON.stringify(this.showadd_fields))
+        for (let i = 0; i < this.showadd_fields.fields.length; i++) {
+          if (this.showadd_fields[i] && this.showadd_fields[i].value) {
+            this.showadd_fields[i].value = ''
+          }
+          if (this.showadd_fields.fields[i] && this.showadd_fields.fields[i].value) {
+            this.showadd_fields.fields[i].value = ''
+          }
+        }
+
+        this.showadd_fields = null
+        this.showadd = false
+        this.disable_button_modal = true
+        this.modeltitle = null
+        this.tempid = null
+      },
+      async load() {
+        let index = 0
+        this.model = Object.assign({}, this.model, this.griddata)
+        let http = new HttpResetClass()
+        let data = {
+          tablename: this.data.onetomany[index].tables[0],
+          condition: `f_apply_num = '${this.selectdata.f_apply_num}'  and f_process_id='${this.selectdata.f_process_id}'`
+        }
+        let res = await http.load('POST', 'rs/sql/singleTable', {data: data}, {
+          resolveMsg: null,
+          rejectMsg: 'onetomany查询失败'
+        })
+        // 初始化 onetomany
+        let rows = []
+        console.log('查询返回结果res.data=>' + JSON.stringify(res.data))
+        this.data.onetomany[index].rows = res.data
+        console.log(JSON.stringify('this.data.onetomany[index].rows=>' + JSON.stringify(this.data.onetomany[index].rows)))
+
+        // 初始化onetomany中的fields
+        for (let j = 0; j < this.data.onetomany[index].fields.length; j++) {
+          // 如果配置类型为select,优先从参数列表获取options
+          if (this.data.onetomany[index].fields[j].type === 'select') {
+            let temp = Vue.$appdata.getParam(this.data.onetomany[index].fields[j].label)
+            if (temp && temp.length > 0) {
+              this.data.onetomany[index].fields[j].options = Vue.$appdata.getParam(this.data.onetomany[index].fields[j].label)
+            }
+          }
+        }
+        this.model.rows = []
+        this.surBodyData = []
+        if (this.data.onetomany && this.data.onetomany.length > 0) {
+          for (let i = 0; i < this.data.onetomany.length; i++) {
+            let temp = []
+            for (let j = 0; j < this.data.onetomany[i].fields.length; j++) {
+              temp.push(this.data.onetomany[i].fields[j].field)
+            }
+            this.surBodyData.push(temp)
+          }
+          for (let i = 0; i < this.data.onetomany.length; i++) {
+            if (this.data.onetomany[i].rows) {
+              this.model.rows.push(this.data.onetomany[i].rows)
+            }
+          }
+        }
+        this.templateshow = false
+        this.$nextTick(() => {
+          this.templateshow = true
+        })
+      }
+    },
+    events: {
+      'add'(index) {
+        let templet = new Object()
+        templet = this.data.onetomany[index]
+        for (let j = 0; j < templet.fields.length; j++) {
+          templet.fields[j].value = ''
+          if (templet.fields[j].type == 'datepicker') {
+            templet.fields[j].value = new Date().Format("yyyy-MM-dd HH:mm:ss")
+          }
+        }
+        this.modeltitle = '新增'
+        this.showadd_fields = templet
+        this.showadd_index = index
+        this.showadd = true
+      }
+    },
+    computed: {},
+    watch: {
+      'selectdata'(){
+        this.load()
+      },
+      deep:true
+    }
+  }
+
+  // Date格式化
+  Date.prototype.Format = function (fmt) {
+    var o = {
+      "M+": this.getMonth() + 1, //月份
+      "d+": this.getDate(), //日
+      "H+": this.getHours(), //小时
+      "m+": this.getMinutes(), //分
+      "s+": this.getSeconds(), //秒
+      "q+": Math.floor((this.getMonth() + 3) / 3), //季度
+      "S": this.getMilliseconds() //毫秒
+    };
+    if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
+    for (var k in o)
+      if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
+    return fmt;
+  }
+</script>
+<style scoped>
+  tr {
+    height: 34px;
+  }
+</style>