@bytenew/bn-bus-ui 1.1.461 → 1.1.463

package/packages/BnSmartForm/numberForm/index.vue

@@ -0,0 +1,63 @@
+<template>
+  <div class="w-default-wrap">
+	<formItemTop :column="column"/>
+	<div class="w-default-wrap">
+	  <BnInpNum v-model="column.value" :disabled="disabled" :precision="column.extraInfo?.valueType"
+				@input="onInput" @focus="onFocus" @blur="onBlur"></BnInpNum>
+	</div>
+	<formItemFooter :column="column"/>
+  </div>
+</template>
+
+<script>
+  import formItemTop from "../formItemTop/formItemTop.vue";
+  import formItemFooter from "../formItemFooter/formItemFooter.vue";
+  import {debounce} from "lodash";
+  
+  export default {
+	name: "numberForm",
+	components:{formItemTop,formItemFooter},
+	props: {
+	  column: {
+		type: Object,
+		default: function () {
+		  return {}
+		}
+	  },
+	  disabled:Boolean
+	},
+	methods:{
+	  /**
+	   * 输入框输入事件
+	   * */
+	  onInput(e) {
+		this.column.error = '';
+		this.column.warning = '';
+		if(e == this.column.value){
+		  this.$emit('onInput', this.column)
+		  this.onChange()
+		}
+		
+	  },
+	  /**
+	   * 输入框Change事件
+	   * */
+	  onChange: debounce(function (e, type) {
+		// 当值不为空
+		this.$emit('onChange', this.column)
+	  }, 500),
+	  /**
+	   * 输入框onFocus事件
+	   * */
+	  onFocus(e) {
+		this.$emit('focus', this.column)
+	  },
+	  /**
+	   * 输入框失去焦点事件
+	   * */
+	  onBlur(e) {
+		this.$emit('blur', this.column)
+	  },
+	},
+  }
+</script>

package/packages/BnSmartForm/radioForm/index.vue

@@ -0,0 +1,72 @@
+<!--单选按钮-->
+<template>
+  <div class="w-default-wrap radioForm">
+	<formItemTop :column="column"/>
+	<div class="w-default-wrap clearFix">
+	  <div class="radioForm-item" v-for="(item,index) in column.moduleDefinition" :key="index">
+		<BnRadio v-model="column.value" :optionProps="{value:'code',label:'title'}" :disabled="disabled"
+				 :trueData="item" @change="changeVal"></BnRadio>
+	  </div>
+	  <div class="w-default-wrap radioForm-empty" v-if="column.moduleDefinition.length == 0">
+		无数据
+	  </div>
+	</div>
+	<formItemFooter :column="column"/>
+  </div>
+</template>
+
+<script>
+  import formItemTop from "../formItemTop/formItemTop.vue";
+  import formItemFooter from "../formItemFooter/formItemFooter.vue";
+  
+  export default {
+	name: "radioForm",
+	components: {formItemFooter, formItemTop},
+	props: {
+	  column: {
+		type: Object,
+		default: function () {
+		  return {}
+		}
+	  },
+	  disabled:Boolean
+	},
+	methods: {
+	  changeVal() {
+		this.column.error = '';
+		this.column.warning = '';
+		this.$emit('onChange', this.column);
+	  },
+	}
+  }
+</script>
+<style scoped lang="scss">
+  .radioForm {
+	&-empty {
+	  width: 330px;
+	  line-height: 32px;
+	  text-align: center;
+	  font-size: 12px;
+	  color: #999;
+	}
+	&-item {
+	  display: inline-block;
+	  line-height: 32px;
+	  height: 32px;
+	  min-width: 200px;
+	  margin-right: 16px;
+	  .radio-box-label{
+		width: 100%;
+		box-sizing: border-box;
+		height: 32px;
+	  }
+	}
+	.radioForm-4 {
+	  width: calc(25% - 16px);
+	  min-width: auto;
+	}
+	&-evaluate{
+	  min-width: 150px;
+	}
+  }
+</style>

package/packages/BnSmartForm/receiveForm/index.vue

@@ -0,0 +1,112 @@
+<!--收寄信息组件-->
+<template>
+  <div class="w-default-wrap">
+	<formItemTop v-if="column.name" :column="column"/>
+	<BnAddressParse @parse="autoParse" :post-func="postFunc"></BnAddressParse>
+	<div class="w-flex-between w-margin-bottom10 w-flex-column-gap8">
+	  <el-input v-model="column.value[valueKey.name]" :disabled="disabled"
+				placeholder="输入姓名"
+				@input="onInput" @focus="onFocus" @blur="onBlur" clearable show-word-limit>
+	  </el-input>
+	  <el-input v-model="column.value[valueKey.phone]" :disabled="disabled"
+				placeholder="输入手机号"
+				@input="onInput" @focus="onFocus" @blur="onBlur" clearable show-word-limit>
+	  </el-input>
+	</div>
+	<div class="w-default-wrap w-margin-bottom10">
+	  <BnAddress v-model="column.value[valueKey.address]" :postFunc="postFunc" @change="onChange"
+				 value-key="code" :level-num="column.levelNum || 4"
+				 :pathUrl="column.pathUrl || '/address/getAreaDataList'" :disabled="disabled"></BnAddress>
+	</div>
+	<div class="w-default-wrap">
+	  <el-input v-model="column.value[valueKey.detail]" type="textarea" :rows="3"
+				:disabled="disabled"
+				resize="none" placeholder="输入详细地址"
+				@input="onInput" @focus="onFocus" @blur="onBlur" clearable show-word-limit>
+	  </el-input>
+	</div>
+	<formItemFooter :column="column"/>
+  </div>
+</template>
+<script>
+  import {debounce} from "lodash";
+  import formItemTop from "../formItemTop/formItemTop.vue";
+  import formItemFooter from "../formItemFooter/formItemFooter.vue";
+  import BnAddressParse from "../../BnAddressParse/index.vue";
+  
+  export default {
+	name: "addressForm",
+	components: {BnAddressParse, formItemTop, formItemFooter},
+	props: {
+	  column: Object,
+	  disabled: Boolean,
+	  postFunc: Function,
+	  // 数据结构
+	  valueProps: Object,
+	},
+	computed: {
+	  // 收寄信息value对象中对应的字段
+		valueKey() {
+		if(this.valueProps){
+		  return this.valueProps;
+		}else if (this.column.moduleDefinition){
+		  return {
+			name: this.column.moduleDefinition[0].columnCode,
+			phone: this.column.moduleDefinition[1].columnCode,
+			address: this.column.moduleDefinition[2].columnCode,
+			detail: this.column.moduleDefinition[3].columnCode,
+		  }
+		}else{
+		  return {
+			name: 'name',
+			phone: 'phone',
+			address: 'address',
+			detail: 'detail',
+		  }
+		}
+	  }
+	},
+	methods: {
+	  /**
+	   * 输入框输入事件
+	   * */
+	  onInput(e) {
+		this.column.error = '';
+		this.column.warning = '';
+		this.$emit('onInput', this.column)
+		this.onChange(e)
+	  },
+	  /**
+	   * 输入框Change事件
+	   * @param {String} type 是否是其他事件类型
+	   * */
+	  onChange: debounce(function (e, type) {
+		this.column.error = '';
+		this.column.warning = '';
+		this.$emit('onChange', this.column)
+	  }, 600),
+	  /**
+	   * 输入框onFocus事件
+	   * */
+	  onFocus(e) {
+		this.$emit('focus', this.column)
+	  },
+	  /**
+	   * 输入框失去焦点事件
+	   * */
+	  onBlur() {
+		this.$emit('blur', this.column)
+	  },
+	  /**
+	   *自动识别
+	   * */
+	  autoParse(data) {
+		this.column.value[this.valueKey.name] = data.name || '';
+		this.column.value[this.valueKey.phone] = data.phone || '';
+		this.column.value[this.valueKey.address] = data.address;
+		this.column.value[this.valueKey.detail] = data.detail || '';
+		this.onChange();
+	  },
+	}
+  }
+</script>

package/packages/BnSmartForm/relationForm/index.vue

@@ -0,0 +1,82 @@
+<template>
+  <div class="w-default-wrap">
+    <formItemTop :column="column"/>
+    <div class="w-default-wrap">
+      <BnCascader @change="changeValue"
+                  v-model="column.value"
+                  :postFunc="postFunc"
+                  :path-url="column.pathUrl"
+                  :post-data="column.postData"
+                  remote-mode="tree"
+                  :optionProps="{value:'code',label:'title'}" :label-in-value="false"
+                  :options="filteredOptions" hide-check-to-last
+                  :multiple="column.behaviorType == 20" :disabled="disabled"
+                  clearable
+      />
+    </div>
+    <formItemFooter :column="column"/>
+  </div>
+</template>
+
+<script>
+//引入状态分配器
+import formItemTop from "../formItemTop/formItemTop.vue";
+import formItemFooter from "../formItemFooter/formItemFooter.vue";
+
+export default {
+  name: "relationForm",
+  components: {formItemFooter, formItemTop},
+  props: {
+    column: {
+      type: Object,
+      default: function () {
+        return {}
+      }
+    },
+    disabled: Boolean,
+    // 接口请求外部转发
+    postFunc: Function,
+  },
+  computed: {
+    /**
+     * 过滤后的选项列表，只保留columnStatus等于1的项
+     */
+    filteredOptions() {
+      if (!this.column.moduleDefinition || !this.column.moduleDefinition.optionList) {
+        return [];
+      }
+
+      // 递归过滤树形结构
+      const filterTree = (nodes) => {
+        if (!Array.isArray(nodes)) return [];
+
+        return nodes.filter(node => {
+          // 检查当前节点的columnStatus
+          if (node.columnStatus != 1) {
+            return false;
+          }
+
+          // 如果有子节点，递归过滤子节点
+          if (node.children && Array.isArray(node.children)) {
+            node.children = filterTree(node.children);
+          }
+
+          return true;
+        });
+      };
+
+      return filterTree(this.column.moduleDefinition.optionList);
+    }
+  },
+  methods: {
+    /**
+     * 组件值发生变化
+     * */
+    changeValue() {
+      this.column.error = '';
+      this.column.warning = '';
+      this.$emit('onChange', this.column);
+    },
+  },
+}
+</script>

package/packages/BnSmartForm/scoreForm/index.vue

@@ -0,0 +1,39 @@
+<template>
+  <div class="w-default-wrap">
+	<formItemTop :column="column"/>
+	<div class="w-default-wrap">
+	  <el-rate v-model="column.value" :disabled="disabled" @change="onChange"
+			   :max="column.extraInfo.valueMaxSize?parseInt(column.extraInfo.valueMaxSize):5"/>
+	</div>
+	<formItemFooter :column="column"/>
+  </div>
+</template>
+
+<script>
+  import formItemTop from "../formItemTop/formItemTop.vue";
+  import formItemFooter from "../formItemFooter/formItemFooter.vue";
+  import {debounce} from "lodash";
+  
+  export default {
+	name: "numberForm",
+	components:{formItemTop,formItemFooter},
+	props: {
+	  column: {
+		type: Object,
+		default: function () {
+		  return {}
+		}
+	  },
+	  disabled:Boolean
+	},
+	methods:{
+	  /**
+	   * 输入框Change事件
+	   * */
+	  onChange: debounce(function (e, type) {
+		this.$emit('onChange', this.column)
+	  }, 500),
+
+	},
+  }
+</script>

package/packages/BnSmartForm/selectForm/index.vue

@@ -0,0 +1,55 @@
+<template>
+  <div class="w-default-wrap">
+	<formItemTop :column="column"/>
+	<div class="w-default-wrap">
+	  <BnSelect v-model="column.value" :options="column.moduleDefinition" :multiple="column.behaviorType == 5"
+				:disabled="disabled || (!taskId && extraInfo.isAutoAssign == 1 && column.columnCode == 'executor')"
+				:optionProps="{value:'code',label:'title'}" :pageProps="{pageNum: 'pageNo',pageSize: 'pageSize',}"
+				:pathUrl="column.pathUrl" :postData="column.postData" :postFunc="postFunc"
+				:placeholder="!taskId && extraInfo.isAutoAssign && column.columnCode == 'executor'?'已开启自动分配':'请选择'"
+				clearable :collapseTags="false" filterable @change="changeValue">
+	  </BnSelect>
+	</div>
+	<formItemFooter :column="column"/>
+  </div>
+</template>
+
+<script>
+  //引入状态分配器
+  import formItemTop from "../formItemTop/formItemTop.vue";
+  import formItemFooter from "../formItemFooter/formItemFooter.vue";
+  
+  export default {
+	name: "editSelectCol",
+	components: {formItemFooter, formItemTop},
+	props: {
+	  column: {
+		type: Object,
+		default: function () {
+		  return {}
+		}
+	  },
+	  disabled: Boolean,
+	  // 接口请求外部转发
+	  postFunc: Function,
+	  // 表级别扩展信息
+	  extraInfo: {
+		type: Object,
+		default: function () {
+		  return {}
+		}
+	  },
+	  taskId: {}
+	},
+	methods: {
+	  /**
+	   * 组件值发生变化
+	   * */
+	  changeValue() {
+		this.column.error = '';
+		this.column.warning = '';
+		this.$emit('onChange', this.column);
+	  },
+	},
+  }
+</script>

package/packages/BnSmartForm/showValForm/index.vue

@@ -0,0 +1,42 @@
+<!--展示value组件-->
+<template>
+  <div class="w-default-wrap">
+	<formItemTop :column="column"/>
+	<div class="w-default-wrap showValForm-content" v-if="column.behaviorType !=13">
+	  {{getTitle()}}
+	</div>
+	<div class="w-default-wrap" v-if="column.behaviorType == 13">
+	  <showValFormTable	:column="column"></showValFormTable>
+	</div>
+	<formItemFooter :column="column"/>
+  </div>
+</template>
+<script>
+  import formItemTop from "../formItemTop/formItemTop.vue";
+  import formItemFooter from "../formItemFooter/formItemFooter.vue";
+  import {getColumnValText} from "../BnSmartFormUtil";
+  import showValFormTable from "./showValFormTable.vue";
+  export default {
+	name: "showValForm",
+	components:{formItemTop,formItemFooter,showValFormTable},
+	props:{
+	  column:{type:Object}
+	},
+	methods:{
+	  getTitle() {
+		let text = getColumnValText(this.column);
+		return text;
+	  }
+	}
+  }
+</script>
+<style scoped lang="scss">
+  .showValForm-content{
+	background: #f9f9f9;
+	border-radius: 2px;
+	overflow: hidden;
+	padding: 0 8px;
+	line-height: 32px;
+	min-height: 32px;
+  }
+</style>

package/packages/BnSmartForm/showValForm/showValFormTable.vue

@@ -0,0 +1,104 @@
+<!-- 
+ 功能名称:子表单组件数据展示
+使用位置：查看子表单完整数据
+参数列表：
+必传：component:[]
+必传：sourceValue:[] 
+ -->
+<template>
+  <div>
+    <el-dialog
+      :title="column.name"
+      custom-class="w-dialog-border"
+      :append-to-body="true"
+      :modal-append-to-body="true"
+      :visible.sync="visiable"
+      width="820px">
+      <div class="showValFormTable-modal">
+        <showValFormTable :column="correlationQuery"></showValFormTable>
+      </div>
+      <div slot="footer" class="w-dialog-border-footer">
+        <Button @click="visiable = false">关 闭</Button>
+      </div>
+    </el-dialog>
+
+    <vxe-table
+      border
+      size="small"
+      :scroll-x="{ enabled: true, gt: 6 }"
+      :scroll-y="{ enabled: true, gt: 6 }"
+      :data="column.value"
+      :max-height="360"
+      :row-config="{ isHover: true }">
+      <vxe-column
+        v-for="column in column.moduleDefinition"
+        :key="column.id"
+        :title="column.name"
+        :min-width="240">
+        <template #default="{ row }">
+          <div v-if="row[column.id] && row[column.id].value">
+            <template v-if="column.behaviorType !=13">{{ getTitle(column, row[column.id].value) }}</template>
+            <template v-if="column.behaviorType == 13 && row[column.id].value">
+              <span class="wicon icon-table w-cursor-pointer"
+					@click="showTable( column, column.moduleDefinition, row[column.id].value)"></span>
+              {{row[column.id].value.length }}
+            </template>
+          </div>
+        </template>
+      </vxe-column>
+      <template #empty>
+        <span>暂无数据</span>
+      </template>
+    </vxe-table>
+  </div>
+</template>
+
+<script>
+import { getColumnValText } from "./../BnSmartFormUtil";
+export default {
+  name: "showValFormTable",
+  props: {
+    column: { type: Object },
+  },
+  data() {
+    return {
+      visiable: false,
+      selectFlag: false,
+      title: "",
+      correlationQuery: {
+        moduleDefinition: [],
+        value: {},
+      }, //关联表单弹框数据
+    };
+  },
+  watch: {},
+  methods: {
+    /**
+	   * 关联弹框展示
+	   * row  类似column数据
+		 * columnList: 弹框组件列表
+		 * values: 弹框表单中数据
+	   * */
+    showTable(row, columnList, values) {
+      this.correlationQuery = row;
+      this.correlationQuery.moduleDefinition = columnList;
+      this.correlationQuery.value = values; 
+      this.visiable = true;
+    },
+    /**
+	   * getTitle 获取组件值
+	   * column 组件数据 
+		 * val 值 
+	   * */
+    getTitle(column, val) {
+      let text = getColumnValText(column, true, val);
+      return text;
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.showValFormTable-modal {
+  padding: 24px;
+}
+</style>

package/packages/BnSmartForm/smartFormsCommon.scss

@@ -0,0 +1,43 @@
+.BnSmartForm {
+  &-title {
+    height: 32px;
+    line-height: 32px;
+    font-size: 14px;
+    color: #666;
+
+    &-tip {
+      font-size: 12px;
+      color: #777;
+    }
+  }
+
+  &-explain {
+    margin-top: 5px;
+    color: #888;
+    font-size: 12px;
+  }
+
+  &-img {
+    margin-top: 8px;
+
+    &-item {
+      display: inline-block;
+      width: 46px;
+      height: 46px;
+      margin-right: 8px;
+      border-radius: 4px;
+      border: 1px solid #E6E6E6;
+
+      img {
+        width: 100%;
+        height: 100%;
+        border-radius: 4px;
+      }
+    }
+  }
+
+  &-tips {
+    line-height: 32px;
+    font-size: 12px;
+  }
+}