@bytenew/bn-bus-ui 1.1.461 → 1.1.463

package/packages/BnOrderDetail/filterLogByUser.vue

@@ -0,0 +1,108 @@
+<!--通过选择成员来筛选操作日志-->
+<template>
+  <BnDrop ref="bnDrop" pathUrl="/v2/project/column/select"
+      :postData="postData" :postFunc="postFunc" :labelInValue="false"
+      :optionProps="{value:'id',label:'title'}"
+      searchKey="condition" :options="userConst" multiple v-model="val"
+      :pageProps="{pageNum: 'pageNo',pageSize: 'pageSize'}">
+    <slot>
+      <el-button link class="filter-btn">
+        <span class="w-color-blue"><span class="bnUIcon bnUIcon-search"></span> 筛选</span>
+        <span class="w-color-gray" v-if="modelValue.length">(已选{{modelValue.length}}人)</span>
+        <span class="bnUIcon bnUIcon-clear filter-btn-icon w-color-red w-margin-left4" v-if="modelValue.length" @click.stop="clear()"></span>
+      </el-button>
+    </slot>
+    <template v-slot:dropdown-bottom>
+      <div class="w-text-right w-padding-lr10 w-padding-tb4">
+        <el-button link @click="val = [];" v-if="val.length">清空</el-button>
+        <el-button @click="cancel()">取消</el-button>
+        <el-button type="primary" @click="sure()">确定</el-button>
+      </div>
+    </template>
+  </BnDrop>
+
+</template>
+<script>
+import {userConst} from "../../utils/index.js";
+import {cloneDeep} from "lodash";
+
+export default {
+  name: "searchLogByUser",
+  props: {
+    modelValue:{
+      type:Array,
+      default(){
+        return []
+      }
+    },
+    userByTable:Boolean,
+    // 表信息
+    tableInfo: Object,
+    // 操作列表
+    operateList: {
+      type:Array,
+      default(){
+        return []
+      }
+    },
+    // 底部tabList
+    tabPaneList: {
+      type:Array,
+      default(){
+        return []
+      }
+    },
+    // 接口请求外部转发
+    postFunc: Function,
+  },
+  data(){
+    return{
+      userConst,
+      val:[],
+      postData:{
+        "appId": this.tableInfo.appId,
+        "projectId": this.tableInfo.tableId,
+        "selectParams": this.userByTable?'':"{\"userColId\":\"-1\"}",
+        "type": "user",
+        "ids": "{\"field\":\"\",\"type\":\"user\",\"table\":\"\"}",
+        "condition": "",
+      },
+    }
+  },
+  methods:{
+    /**
+    * 确定
+    * */
+    sure() {
+      this.$emit("update:modelValue", cloneDeep(this.val));
+      this.$refs.bnDrop.close();
+    },
+    /**
+    * 取消
+    * */
+    cancel() {
+      this.val = cloneDeep(this.modelValue)
+      this.$refs.bnDrop.close();
+    },
+    /**
+    * 清空
+    * */
+    clear() {
+      this.val = []
+      this.$emit("update:modelValue", cloneDeep(this.val));
+    },
+  }
+}
+</script>
+<style scoped lang="scss">
+.filter-btn {
+  .filter-btn-icon {
+    display: none;
+  }
+  &:hover {
+    .filter-btn-icon {
+      display: inline;
+    }
+  }
+}
+</style>

package/packages/BnOrderDetail/orderLogs.vue

@@ -0,0 +1,53 @@
+<template>
+  <div class="w-padding-tb10">
+    <BnEmptyTip v-if="!logList.length"></BnEmptyTip>
+    <el-timeline>
+      <el-timeline-item placement="top" v-for="(activity, index) in logList" :key="index"
+                        :color="index == 0?'#0bbd87':'#DADADA'" :timestamp="activity.gmtCreate">
+        <el-card>
+          <div class="w-text-over-two w-color-black6 w-font13" :title="activity.content">{{
+              activity.content
+            }}
+          </div>
+        </el-card>
+      </el-timeline-item>
+    </el-timeline>
+  </div>
+</template>
+<script>
+
+export default {
+  name: "orderLogs",
+  props: {
+    tableInfo: {},
+    id: {},
+    // 传入成员id筛选这个成员的操作记录
+    filterUsers: {},
+    // 接口请求外部转发
+    postFunc: Function,
+  },
+  data() {
+    return {
+      taskLog: [],
+    }
+  },
+  created() {
+    this.taskLog = [];
+    let postData = {
+      tableCode: this.tableInfo.tableCode,
+      id: this.id
+    }
+    // 获取工单操作记录
+    this.postFunc('/biztable/content/selectLogsByTaskId', postData).then(res => {
+      if (!res.code) {
+        this.taskLog = res.data;
+      }
+    })
+  },
+  computed:{
+    logList(){
+      return this.filterUsers.length>0?this.taskLog.filter(i=>this.filterUsers.includes(String(i.ownerId))):this.taskLog
+    }
+  },
+}
+</script>

package/packages/BnOrderDetail/showSubForm/index.vue

@@ -0,0 +1,41 @@
+<template>
+  <div class="showSubFormDetail">
+    <!--展示表格，或者时间线-->
+    <showTimeLine :columns="column.moduleDefinition" :tableData="tableData"
+                  v-if="column.columnCode == 'serve_progress' || column.columnCode == 'tracking_back'"></showTimeLine>
+    <showChildTable :columns="column.moduleDefinition" :tableData="tableData"
+                    :maxHeight="maxHeight" v-else></showChildTable>
+  </div>
+</template>
+<script>
+import showChildTable from "./showChildTable.vue";
+import showTimeLine from "./showTimeLine.vue";
+import {tidyShowSubDataFile} from "../../../utils/index.js";
+
+export default {
+  name: 'showSubFormDetail',
+  components: {showChildTable, showTimeLine},
+  props: {
+    column: Object,
+    row: Object,
+    maxHeight:{
+      default:'100%'
+    },
+  },
+  data() {
+    return {
+      show: false,
+      tableData: [],
+    }
+  },
+  created() {
+    this.tableData = tidyShowSubDataFile(this.column, this.row)
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.showSubFormDetail {
+  max-height: 100%;
+}
+</style>

package/packages/BnOrderDetail/showSubForm/showChildTable.vue

@@ -0,0 +1,61 @@
+<template>
+  <tableCellCopy ref="childTableCopy"></tableCellCopy>
+  <vxe-table border="full"
+             :row-config="{ keyField: 'id' }"
+             :header-cell-config="{height: 36}"
+             resizable :tooltip-config="{}"
+             @cell-mouseenter="onMouseEvent"
+             @cell-mouseleave="onMouseEvent"
+             :scroll-x="{ enabled: true, gt: 10 }"
+             :scroll-y="{ enabled: true, gt: 30 }"
+             :resizable-config="{ minWidth: 120 }"
+             ref="childTable" :data="tableData"
+             min-height="40" :max-height="maxHeight">
+    <vxe-column type="seq" width="60"></vxe-column>
+    <vxe-column :title="column.name" :field="column.columnCode" min-width="160" v-for="(column,index) in columns" :key="index">
+      <template #default="scope" v-if="column.behaviorType == 10">
+        <BnFileView v-if="scope.row.inside[column.columnCode]" :file-list="scope.row.inside[column.columnCode]"
+                   :width="32" :is-mini="true" :no-warp="true"></BnFileView>
+      </template>
+    </vxe-column>
+  </vxe-table>
+</template>
+
+<script>
+import tableCellCopy from "./tableCellCopy.vue";
+
+export default {
+  name: 'showChildTable',
+  components: {tableCellCopy},
+  props: {
+    columns: Array,
+    maxHeight: {
+      default: '100%'
+    },
+    tableData: Array,
+  },
+  methods: {
+    /**
+     * 鼠标移入移出单元格，展示隐藏复制按钮
+     * @param {Event} e 事件对象
+     */
+    onMouseEvent(scope) {
+      // 当鼠标悬浮到单元格时，再加复制按钮
+      let e = scope.$event;
+      // 鼠标离开
+      if (e.type === "mouseleave") {
+        this.$refs.childTableCopy?.onHide()
+      } else {
+        let data = {
+          column: {columnCode: this.columns[scope.columnIndex - 1]?.columnCode},
+          row: scope.row
+        }
+        // 有值再显示
+        if (data.row[data.column.columnCode]) {
+          this.$refs.childTableCopy?.onShow(scope.cell, data)
+        }
+      }
+    },
+  }
+};
+</script>

package/packages/BnOrderDetail/showSubForm/showTimeLine.vue

@@ -0,0 +1,131 @@
+<template>
+  <div class="showTimeLine">
+	<el-timeline style="max-width: 800px;">
+	  <el-timeline-item v-for="(item,index) in displayData"
+						:key="index" :timestamp="item.serve_status+'&nbsp;&nbsp;'+item.operator_time" placement="top"
+						:color="index == 0?'#1677FF':'#DADADA'">
+		<el-card body-class="showTimeLine-card">
+		  <el-row :gutter="20">
+			<template v-for="(column,i) in stringList" :key="i">
+			  <el-col :span="12" v-if="item[column.columnCode]" class="showTimeLine-box">
+				<div class="showTimeLine-box-title">{{column.name}}：</div>
+				<el-popover :content="item[column.columnCode]" placement="top-end" width="680" :disabled="!isTextOverflow(item[column.columnCode])">
+				  <template #reference>
+					<div class="showTimeLine-box-text w-text-over-three" ref="textRef">{{item[column.columnCode]}}</div>
+				  </template>
+				</el-popover>
+			  </el-col>
+			</template>
+		  </el-row>
+		  <template v-for="(column,i) in imgList" :key="i">
+			<el-row :gutter="20" v-if="item[column.columnCode]">
+			  <el-col :span="24" v-if="item[column.columnCode]" class="showTimeLine-box">
+				<div class="showTimeLine-box-title">{{column.name}}：</div>
+				
+				<div class="showTimeLine-box-file"><BnFileView :file-list="item.inside[column.columnCode]" :is-mini="true" :no-warp="true" width="50px" /></div>
+			  </el-col>
+			</el-row>
+		  </template>
+		  <template v-for="(column,i) in editorList" :key="i">
+			<el-row :gutter="20" v-if="item[column.columnCode]">
+			  <el-col :span="24" v-if="item[column.columnCode]" class="showTimeLine-box">
+				<div class="showTimeLine-box-title">{{column.name}}：</div>
+				<div v-html="item[column.columnCode]"></div>
+			  </el-col>
+			</el-row>
+		  </template>
+		  
+		</el-card>
+	  </el-timeline-item>
+	</el-timeline>
+	
+	<!-- 查看更多/收起按钮 -->
+	<div v-if="tableData.length > 3" class="w-text-center">
+	  <el-button type="primary" @click="toggleExpand" link>
+		{{ isExpanded ? '收起' : '查看更多' }}
+	  </el-button>
+	</div>
+  </div>
+</template>
+<script>
+  export default {
+	name: "showTimeLine",
+	props: {
+	  columns: Array,
+	  tableData: Array,
+	},
+	data() {
+	  return {
+		isExpanded: false
+	  }
+	},
+	computed: {
+	  displayData() {
+		if (this.isExpanded) {
+		  return this.tableData
+		}
+		return this.tableData.slice(0, 3)
+	  },
+	  editorList() {
+		let list = this.columns.filter(i=> [11].includes(i.behaviorType))
+		return list
+	  },
+	  stringList() {
+		let list = this.columns.filter(i=> [1,2,3,4,5,6,7,8,9,12,14,15].includes(i.behaviorType) && !['serve_status','operator_time'].includes(i.columnCode))
+		return list
+	  },
+	  imgList() {
+		let list = this.columns.filter(i=>i.behaviorType == 10)
+		return list
+	  },
+	},	
+	methods: {
+	  toggleExpand() {
+		this.isExpanded = !this.isExpanded
+	  },
+	  isTextOverflow(text) {
+		if (!text) return false
+		// 简单判断：如果文本长度超过50个字符，认为可能超出显示范围
+		return text.length > 50
+	  }
+	}
+  }
+</script>
+
+
+<style scoped lang="scss">
+  .showTimeLine {
+	position: relative;
+	width: 100%;
+	height: 100%;
+	
+	:deep(.showTimeLine-card) {
+	  padding:20px 12px;
+	}
+	&-box{
+	  display: flex;
+	  margin-bottom: 20px;
+	  &-title{
+		line-height: 20px;
+		font-size: 12px;
+		color: #888;
+		white-space: nowrap;
+	  }
+	  &-text{
+		line-height: 20px;
+		font-size: 12px;
+		color: #666;
+		white-space: pre-line;
+	  }
+	  &-file{
+		max-width: calc(100% - 120px);
+		overflow-x: hidden;
+	  }
+	}
+	&-toggle {
+	  text-align: center;
+	  margin-top: 20px;
+	  margin-bottom: 20px;
+	}
+  }
+</style>

package/packages/BnOrderDetail/showSubForm/tableCellCopy.vue

@@ -0,0 +1,84 @@
+<template>
+  <div class="worksheetCopy" :style="style" v-show="visiable || isMouseIn" @mouseover="onMouseEvent"
+	   @mouseleave="onMouseEvent" @click.stop="copyText">复制
+  </div>
+</template>
+
+<script>
+  export default {
+	name: "WorksheetCopy",
+	data() {
+	  return {
+		isMouseIn: false,
+		visiable: false,
+		params: {},
+		style: {},
+	  };
+	},
+	methods: {
+	  /**
+	   * 鼠标移入移出
+	   * @param {Event} e 事件对象
+	   */
+	  onMouseEvent(e) {
+		this.isMouseIn = e.type === "mouseleave" ? false : true;
+	  },
+	  /**
+	   * 初始化
+	   * @param {Object} params {column:组件信息,row:行数据}
+	   */
+	  onShow(target, params) {
+		try {
+		  const {right, top} = target.getBoundingClientRect();
+		  this.style = {
+			left: `${right - 34}px`,
+			top: `${top}px`,
+		  };
+		  this.params = params;
+		  this.visiable = true;
+		}catch (e){
+		  console.log('显示复制按钮失败')
+		}
+	  },
+	  onHide() {
+		this.visiable = false;
+	  },
+	  /**
+	   * 复制文本
+	   */
+	  copyText() {
+		const {column, row} = this.params;
+		let copyValue = row[column.columnCode] || "";
+		if(copyValue) {
+		  const textarea = document.createElement('textarea');
+		  textarea.value = copyValue;
+		  document.body.appendChild(textarea);
+		  textarea.select();
+		  document.execCommand('copy');
+		  document.body.removeChild(textarea);
+		  this.$message.success('复制成功');
+		} else {
+		  this.$message.warning('无内容可复制');
+		}
+	  },
+	},
+  };
+</script>
+<style lang='scss' scoped>
+  .worksheetCopy {
+	position: fixed;
+	width: 34px;
+	height: 22px;
+	line-height: 22px;
+	text-align: center;
+	background-color: rgba(51, 51, 51, 0.3);
+	color: #fff;
+	font-size: 12px;
+	z-index: 999999;
+	
+	&:hover {
+	  background-color: #65acff;
+	  cursor: pointer;
+	}
+  }
+</style>