apply-clients 3.0.4 → 3.0.5-ys

package/src/components/product/VueUtils/ApplyUpload.vue

@@ -0,0 +1,310 @@
+<template>
+  <div class="col-sm-12" style="background-color: #FFFFFF">
+    <div class="col-sm-12" style="padding:50px 100px;height: 25%">
+      <div class="form-group col-sm-5" v-if="issearch">
+        <v-select
+          class="select select_list"
+          :value.sync="useType"
+          width="90%"
+          v-model="useType"
+          :options='typeOfUse'
+          :valueSingle="true"></v-select>
+      </div>
+      <div class="form-group col-sm-2" style="text-align: center" v-if="issearch">
+        <button type="button" class="btn btn-primary item_btn" @click="load">搜索</button>
+      </div>
+      <div class="form-group col-sm-2" style="text-align: center" v-if="isupload">
+        <button type="button" class="btn btn-primary item_btn" @click="showUpload = !showUpload">本地上传</button>
+      </div>
+      <div class="form-group col-sm-2" style="text-align: center" v-if="takeimg">
+        <button type="button" class="btn btn-primary item_btn" @click="upload()">拍照</button>
+      </div>
+    </div>
+    <hr style="width: 90%;margin: 0px auto;border: #999999 1px solid;"/>
+    <div class="col-sm-12" style="overflow: scroll;height: 75%">
+      <div :class="bootstraped ? bootstraped + ' showData' : 'col-sm-6 showData'" v-for="row in fileInfoData">
+        <div class="col-sm-12 item">
+          <div class="left col-sm-5">
+            <a href="#" class="thumbnail" style="width: 100%;height: 100%">
+              <img v-if="row.f_filetype === 'jpg'||row.f_filetype === 'png'||row.f_filetype === 'gif'||row.f_filetype === 'bmp'" :src="row.f_downloadURL" alt="..."/>
+              <img v-if="row.f_filetype === 'pdf'" src="../../image/pdf.jpg" alt="" />
+              <img v-if="row.f_filetype === 'xls'||row.f_filetype === 'xlsx'" src="../../image/excel.jpg" alt=""  />
+              <img v-if="row.f_filetype === 'doc'||row.f_filetype === 'docx'" src="../../image/doc.jpg" alt=""  />
+            </a>
+          </div>
+          <div class="right col-sm-7">
+            <p :title="row.f_filename" class="clears"><strong>文件名：</strong>{{row.f_filename}}</p>
+            <p :title="row.f_username" class="clears"><strong>操作员：</strong><span>{{row.f_username}}</span></p>
+            <p :title="row.fusetype" class="clears"><strong>使用类型：</strong><span>{{row.fusetype}}</span></p>
+            <p :title="row.f_uploaddate" class="clears"><strong>上传时间：</strong><span>{{row.f_uploaddate}}</span></p>
+            <p :title="row.fremarks" class="clears"><strong>文件说明：</strong>{{row.fremarks}}</p>
+            <p class="clears">
+              <a v-if="row.f_filetype === 'jpg' || row.f_filetype==='png' || row.f_filetype==='gif' || row.f_filetype==='bmp'" :href="row.f_downloadURL" style="background:#6aa6e2" class="btn btn-primary" target="_blank" role="button">预览</a>
+              <a v-else  @click="downloadfile(row.f_downloadURL)" style="background:#6aa6e2" class="btn btn-primary" role="button" :href="row.f_downloadURL" download>下载</a>
+              <a v-if="isdelete" @click="delet($index, row)" href="#" class="btn btn-default" role="button" role="button">删除</a>
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <apply-high-meter
+    v-if="showhighmeter"
+    :show.sync="showhighmeter"
+    :isusetype="isusetype"
+    :isremark="isremark"
+    @photo-finish="newPhoto"
+    v-ref:ltgao
+  ></apply-high-meter>
+  <modal  :show.sync="showUpload" v-ref:modal backdrop="false">
+    <header slot="modal-header" class="modal-header">
+      <button type="button" class="close" @click="close"><span class="glyphicon glyphicon-remove"></span></button>
+      <h4 class="modal-title" style="text-align: center">文件上传</h4>
+    </header>
+    <article slot="modal-body" class="modal-body form-horizontal">
+      <div class="form-group" style="text-align: center">
+        <file-upload class="my-file-uploader" :name="'myFile' + blodid"
+                     action="rs/file/uploadFile" tagname="文件上传" :headers="headers" multiple v-ref:file></file-upload>
+      </div>
+      <div class="form-group" v-if="isusetype">
+        <label class="col-sm-2 control-label">文件类型：</label>
+        <div class="col-sm-10">
+          <input-select
+            class="select select_list"
+            :value.sync="headers.fusetype"
+            v-model="headers.fusetype"
+            :options="$appdata.getParam('使用类型')"
+            :valueSingle="true"></input-select>
+        </div>
+      </div>
+      <div class="form-group" v-if="isremark">
+        <label class="col-sm-2 control-label">文件说明：</label>
+        <div class="col-sm-10">
+          <input class="form-control input_view" style=""
+                 v-model="headers.fremarks"
+                 :value="headers.fremarks"/>
+        </div>
+      </div>
+    </article>
+    <footer slot="modal-footer" class="modal-footer">
+    </footer>
+  </modal>
+</template>
+
+<script>
+import {HttpResetClass} from 'vue-client'
+import {isEmpty} from "../../Util";
+export default {
+  title: '附件',
+  props: ['blodid', 'businessid', 'isremark', 'isusetype', 'takeimg', 'defname', 'isupload', 'isdelete', 'bootstraped', 'issearch'],
+  data () {
+    return {
+      fileInfoData: [], // 数据库存储的文件记录对象数组
+      headers: {'username': this.$login.f.name, 'blodid': '','businessid':'', 'fremarks': '','defname':'','fusetype':''}, // 调用rs/file/uploadFile 的参数
+      showUpload: false, // 上传模态框控制
+      showhighmeter: false, // 高拍仪组件控制
+      useType: null
+    }
+  },
+  ready () {
+    this.headers.blodid = this.blodid
+    this.headers.businessid = this.businessid
+    this.headers.defname = this.defname
+    if (this.blodid || this.businessid) {
+      this.load()
+    }
+  },
+  methods: {
+    delet(index, row) {
+      this.$resetdelete('rs/entity/t_files', {id: row.id}, {resolveMsg: '删除成功', rejectMsg: '删除失败'}).then((res) => {
+        this.$dispatch("delResid",row.id)
+        this.load()
+      })
+    },
+    // 下载
+    downloadfile(filepath){
+      var link = document.createElement('a');
+      link.href = filepath;
+      link.target='_blank'
+      link.dispatchEvent(new MouseEvent('click'));
+    },
+    // 关闭文件上传对话框
+    close () {
+      this.showUpload = false
+      this.showhighmeter = false
+      // 将选的文件清空
+      this.$refs.file.$el.querySelector('input').value = ''
+      this.headers.fusetype = ''
+      this.headers.fremarks = ''
+      this.load()
+    },
+    // 查询
+    async load() {
+      let condition = ''
+      if(this.businessid){
+        condition = `f_businessid= '${this.headers.businessid}' `
+      }else{
+        condition = `f_blobid= '${this.headers.blodid}' `
+      }
+      if (!isEmpty(this.useType)) {
+        condition += `and fusetype like '${this.useType}'`
+      }
+      let http = new HttpResetClass()
+      let data = {
+        tablename: 't_files',
+        condition: condition + ` order by f_uploaddate desc `
+      }
+      let getFile = await http.load('POST', 'rs/sql/applySingleTable', {data: data}, {
+        warnMsg: null,
+        resolveMsg: null
+      })
+
+      for (var i = 0; i < getFile.data.length; i++) {
+        // 如果使用类型包含导入字样,则是execl文件导入的,不做显示
+        if(getFile.data[i].fusetype&&(getFile.data[i].fusetype.includes('execl导入'))){
+          getFile.data.splice(i,1)
+          i--
+          continue
+        }
+        let temp = getFile.data[i].f_downloadpath
+        let URL = temp.substring(temp.lastIndexOf(":\\") + 2)
+        getFile.data[i].f_downloadURL = "http://" + location.host + "/" + URL
+      }
+      this.fileInfoData = []
+      this.fileInfoData = getFile.data
+    },
+    // 打开高拍仪
+    upload () {
+      if(this.showhighmeter){
+        this.$refs.ltgao.closeVideo()
+      }
+      this.showhighmeter = !this.showhighmeter
+    },
+    // 高拍仪回调
+    newPhoto(Imgbase64, fusetype, fremarks) {
+      this.headers.fusetype = fusetype
+      this.headers.fremarks = fremarks
+
+      let form = new FormData()
+      let xhr = new XMLHttpRequest()
+      let formDataBoundary = "----WebkitFormBoundary" + "GaoPaiYi";
+      form.append('Content-Type', 'multipart/form-data;boundary=' + formDataBoundary)
+      form.append('file', this.convertBase64ToBlob(Imgbase64), "GaoPaiYi.jpg")
+      xhr.open("POST", "rs/file/uploadFile")
+
+      if (this.headers) {
+        for (var header in this.headers) {
+          xhr.setRequestHeader(header, encodeURIComponent(this.headers[header]))
+        }
+      }
+      xhr.send(form)
+      setTimeout(() => {
+        this.close()
+      }, 5000)
+    },
+    convertBase64ToBlob(base64String) {
+      // 将base64解码
+      var bytes = atob(base64String);
+      //var bytes = base64;
+      var bytesCode = new ArrayBuffer(bytes.length);
+      // 转换为类型化数组
+      var byteArray = new Uint8Array(bytesCode);
+
+      // 将base64转换为ascii码
+      for (var i = 0; i < bytes.length; i++) {
+        byteArray[i] = bytes.charCodeAt(i);
+      }
+      // 生成Blob对象（文件对象）
+      return new Blob([bytesCode], {type: 'image/jpeg'});
+    },
+  },
+  computed: {
+    typeOfUse () {
+      return [{label: '全部', value: ''}, ...this.$appdata.getParam('使用类型')]
+    }
+  },
+  watch: {
+    'blodid' () {
+      this.headers.blodid = this.blodid
+      this.headers.businessid = this.businessid
+      this.headers.defname = this.defname
+      if (this.blodid || this.businessid) {
+        this.load()
+      }
+    },
+    'businessid' () {
+      this.headers.blodid = this.blodid
+      this.headers.businessid = this.businessid
+      this.headers.defname = this.defname
+      if (this.blodid || this.businessid) {
+        this.load()
+      }
+    },
+    'defname' () {
+      this.headers.blodid = this.blodid
+      this.headers.businessid = this.businessid
+      this.headers.defname = this.defname
+      if (this.blodid || this.businessid) {
+        this.load()
+      }
+    }
+  },
+  events: {
+    beforeFileUpload: function (file) {
+      if (this.headers.fusetype === '安装合同') {
+        let res = this.fileInfoData.some(item => {
+          return item.fusetype === this.headers.fusetype
+        })
+        if (res) {
+          this.$showAlert(`${this.headers.fusetype}文件已上传！！！`, 'warning', 3000)
+          throw `${this.headers.fusetype}文件已上传！！！`
+        }
+      }
+    },
+    onFileUpload: function (file, res) {
+      this.$dispatch("resid",res.id)
+      this.headers.fremarks=''
+      this.close()
+    }
+  }
+}
+</script>
+
+<style scoped>
+.clears{
+  overflow:hidden;
+  text-overflow:ellipsis;
+  white-space:nowrap;
+}
+.showData {
+  padding: 15px 10px 0px 10px;
+  box-sizing: border-box;
+  height: 230px;
+  font-family: "微软雅黑";
+}
+.showData .item{
+  padding-bottom: 10px;
+  border-bottom: solid 1px #c1c1c1;
+}
+.left {
+  padding-right: 10px;
+}
+.left img{
+  height: 100%;
+  width: 100%;
+}
+.right{
+  height: 100%;
+  /*display: -webkit-flex;*/
+  /*display: flex;*/
+  /*flex-direction: column;*/
+  /*justify-content: space-around;*/
+}
+.item_btn{
+  width: 80%;
+  background-color: #6aa6e2;
+  border-radius: 4px;
+  color: #FFFFFF;
+  font-family: PingFang;
+}
+</style>

package/src/components/product/VueUtils/Tree.vue

@@ -0,0 +1,330 @@
+<template>
+  <div id="treemx" class="tree fonte" v-if="refreshed" style="overflow-x: scroll;max-height: 80vh" >
+    <ul v-for='(rootindex,item) in menulist' :key="item.id">
+      <!-- 没有子集 -->
+      <li v-if='!item._child'>
+        <div class="treeItem" @click="selected(item)">
+          <a href="#">{{item.catename}}</a>
+          <div class="liright">
+            <span :class="item.enabled_text == '启用'?'bgYes':'bgNo'">{{item.enabled_text}}</span>
+          </div>
+        </div>
+      </li>
+      <!-- 有子集 -->
+      <li v-if='item._child'>
+        <div class="onechild treeItem" >
+          <a href="#" @click.native='toggleChildren(rootindex)'>{{item.expanded?'▼ ':'►'}}{{item.catename}}</a>
+          <div class="liright">
+            <span :class="item.enabled_text == '启用'?'bgYes':'bgNo'">{{item.enabled_text}}</span>
+          </div>
+        </div>
+        <ul v-show='item.expanded' class="childs" style="overflow-x: auto;">
+          <li v-for='(parentindex,child) in item._child' :key="child.id" >
+            <!-- 没有子集 -->
+            <div class="twochild treeItem marginL60" v-if="!child._child" @click="selected(child,rootindex)"><a href="#">{{child.catename}}</a>
+              <div class="liright">
+                <span :class="child.enabled_text == '启用'?'bgYes':'bgNo'">{{child.enabled_text}}</span>
+              </div>
+            </div>
+            <!-- 有子集 -->
+            <div class="twochild marginL60" v-if="child._child">
+              <div class="treeItem" >
+                <a href="#" @click.native='toggleChildren(rootindex,parentindex)'>{{child.expanded?'▼ ':'►'}}{{child.catename}}</a>
+                <div class="liright">
+                  <span :class="child.enabled_text == '启用'?'bgYes':'bgNo'">{{child.enabled_text}}</span>
+                </div>
+              </div>
+
+              <ul v-show='child.expanded'>
+                <!-- 遍历第三层 -->
+                <li class="threechild" v-for="(childIndex,child1) in child._child" :key="child1.id" style="overflow-x: auto;">
+                  <div class="treeItem marginL60">
+                      <a href="#" @click.native="add(rootindex,parentindex,childIndex)">{{child1.catename}}   <span v-if="child1.count">数量：{{child1.count}}</span></a>
+                  </div>
+                </li>
+              </ul>
+            </div>
+          </li>
+        </ul>
+      </li>
+
+    </ul>
+  </div>
+
+  <modal :show.sync="addshow2" v-ref:modal backdrop="false">
+    <header slot="modal-header" class="modal-header">
+      <button type="button" class="close" @click="closeadd"><span>&times;</span></button>
+      <h4 class="modal-title">数量</h4>
+    </header>
+    <article slot="modal-body" class="modal-body">
+      <input class="form-control" style="background-color: #f7fbff;"
+             type="number"
+             v-model="inputvalue"
+             :value="inputvalue"
+      />
+    </article>
+    <footer slot="modal-footer" class="modal-footer">
+      <!--<button type="button" class="btn btn-default" @click='addclose'>取消</button>-->
+      <button type="button" class="btn btn-success" @click='addconfirm2'>确认</button>
+    </footer>
+  </modal>
+</template>
+
+<script>
+  export default {
+    title: 'new',
+    props: {
+      menulist: {
+        type: Array,
+        default: []
+      },
+      scrolltop:{
+        default:0
+      }
+    },
+    data() {
+      return {
+        rootindex:null,
+        parentindex:null,
+        childIndex:null,
+        inputvalue:null,
+        addshow2:false,
+        refreshed:true, //强制刷新
+        menulist: [{
+          catename: '水果',
+          expanded: false,
+          _child: [{
+            catename: '苹果',
+          }, {
+            catename: '荔枝'
+          }, {
+            catename: '葡萄'
+          }, {
+            catename: '火龙果',
+            expanded: false,
+            _child: [
+              {
+                id: 0,
+                catename: '白心',
+              }, {
+                id: 1,
+                catename: '红心',
+              },
+            ]
+          }]
+        }]
+      }
+    },
+    ready(){
+      this.updatecrollTop(this.scrolltop)
+    },
+    methods: {
+      updatecrollTop(hight){
+        console.log("scrollTop",hight)
+        let doc = document.getElementById("treemx")
+        doc.scrollTop = 0
+        doc.scrollTop = hight
+        // document.getElementById("treemx").scrollTop = hight
+        // document.documentElement.scrollTop = hight
+        // window.pageYOffset = hight
+        // document.body.scrollTop = hight
+      },
+      closeadd(){
+        this.rootindex = null
+        this.parentindex = null
+        this.childIndex = null
+        this.inputvalue = null
+        this.addshow2 = false
+      },
+      addconfirm2(){
+        this.menulist[this.rootindex]._child[this.parentindex]._child[this.childIndex].count = this.inputvalue
+        this.$dispatch('menulistSelected', this.menulist[this.rootindex]._child[this.parentindex]._child[this.childIndex],this.rootindex,this.parentindex)
+        this.closeadd()
+      },
+      add(rootindex,parentindex,childIndex){
+        this.rootindex = rootindex
+        this.parentindex = parentindex
+        this.childIndex = childIndex
+        this.addshow2 = true
+      },
+      selectedFormat(rootindex,parentindex,childIndex){
+        if(this.menulist[rootindex]._child[parentindex]._child[childIndex].showButton == undefined){
+          this.menulist[rootindex]._child[parentindex]._child[childIndex].showButton = false
+        }
+        this.menulist[rootindex]._child[parentindex]._child[childIndex].showButton = !this.menulist[rootindex]._child[parentindex]._child[childIndex].showButton
+        // this.refreshed = false
+        // this.$nextTick(()=>{
+        //   this.refreshed = true
+        // })
+      },
+      selectedCount(rootindex,parentindex,childIndex){
+        this.menulist[rootindex]._child[parentindex]._child[childIndex].expanded = true
+      },
+      inputCount(item,parentindex,childIndex){
+        console.log('count',item.count)
+        this.$dispatch('menulistSelected', item,val1,val2)
+      },
+      selected(item,val1,val2) {
+        console.log('item', item)
+        this.$dispatch('menulistSelected', item,val1,val2)
+      },
+      toggleChildren(rootindex,parentindex) {
+        if(parentindex!=undefined){
+          this.menulist[rootindex]._child[parentindex].expanded = !this.menulist[rootindex]._child[parentindex].expanded
+          // this.refreshed = false
+          // this.$nextTick(()=>{
+          //   this.refreshed = true
+          // })
+        }else if(rootindex!=undefined) {
+          this.menulist[rootindex].expanded = !this.menulist[rootindex].expanded
+        }
+        this.$dispatch('updateTree')
+
+      },
+    }
+  }
+</script>
+
+
+<style scoped>
+
+  ul {
+    display: block;
+    list-style-type: disc;
+    margin-block-start: 1em;
+    margin-block-end: 1em;
+    margin-inline-start: 0px;
+    margin-inline-end: 0px;
+    padding-inline-start: 40px;
+  }
+
+  .addressBox {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 5.1rem;
+    z-index: 9;
+    background: #f5f5f5;
+    display: block !important;
+  }
+
+  span:focus {
+    background-color: silver;
+  }
+
+  a {
+    font-size: 20px;
+    text-decoration: none;
+    color: black;
+  }
+
+  a:hover {
+    font-size: 20px;
+    text-decoration: none;
+    color: deepskyblue;
+    /*background-color: silver;*/
+  }
+
+  .addressBox ul {
+    width: 33%;
+    height: 5.1rem;
+    background: #E6E6E6;
+    overflow-y: scroll;
+    overflow-x: auto;
+  }
+
+  .addressBox li {
+    height: 0.62rem;
+    font: normal 0.26rem/0.62rem "微软雅黑";
+    color: #666;
+    text-align: center;
+  }
+
+  .cityBox {
+    position: absolute;
+    top: 0;
+    left: 33%;
+    width: 100%;
+    height: 5.1rem;
+    display: none;
+    overflow-y: scroll;
+    z-index: 19;
+    background: #E6E6E6;
+    -webkit-overflow-scrolling: touch;
+    overflow-x: auto;
+  }
+
+  .cityBox ul {
+    width: 100%;
+    height: 5.1rem;
+  }
+
+  .cityBox li {
+    padding-left: 0.17rem;
+    text-align: left;
+    border-bottom: 0.01rem solid #e6e6e6;
+  }
+
+  .areaBox {
+    position: absolute;
+    top: 0;
+    left: 33%;
+    width: 33%;
+    height: 5.1rem;
+    display: none;
+    overflow-y: scroll;
+    z-index: 9999;
+    -webkit-overflow-scrolling: touch;
+  }
+
+  /*模态框*/
+  .model {
+    position: absolute;
+    top: 0%;
+    left: 0%;
+    background: rgba(0, 0, 0, 0.3);
+    width: 100%;
+    height: 100%;
+    position: fixed;
+    z-index: 9999;
+  }
+
+  .model-content {
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    border-radius: .15rem;
+    margin: auto;
+    background-color: #ffffff;
+    text-align: center;
+  }
+
+  input {
+    font-size: 0.32rem;
+    width: 100%;
+    text-align: center;
+    margin-top: .3rem;
+    border: 1px solid #ccc;
+  }
+
+  /*点击省份，出现城市*/
+  .addressBox .active {
+    background: #f5f5f5;
+  }
+
+  .addressBox .active .cityBox {
+    display: block;
+  }
+
+  /*点击城市，出现区域*/
+  .cityBox .active {
+    background: #f5f5f5;
+  }
+
+  .cityBox .active .areaBox {
+    display: block;
+  }
+
+</style>