From ea093990f2382c30f7c08cc287a2093c93514883 Mon Sep 17 00:00:00 2001
From: lideqin <694785430@qq.com>
Date: Fri, 1 Dec 2023 14:16:18 +0800
Subject: [PATCH] =?UTF-8?q?[add]=20=E5=A2=9E=E5=8A=A0=E9=80=89=E4=BA=BA?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/less/common.less                   |   2 +
 src/assets/less/list.less                     | 133 +++++++
 src/common/lang/en-us.js                      |  15 +-
 src/common/lang/zh-cn.js                      |   2 +
 src/components/CustomHeader.vue               |  56 +++
 src/components/SelectUser.vue                 | 331 ++++++++++++++++++
 src/components/SelectUserField.vue            | 233 ++++++++++++
 src/mixins/ListMixin.js                       | 156 +++++++++
 .../EnterpriseStandardInitChange.vue          |  33 +-
 9 files changed, 957 insertions(+), 4 deletions(-)
 create mode 100644 src/assets/less/list.less
 create mode 100644 src/components/CustomHeader.vue
 create mode 100644 src/components/SelectUser.vue
 create mode 100644 src/components/SelectUserField.vue
 create mode 100644 src/mixins/ListMixin.js

diff --git a/src/assets/less/common.less b/src/assets/less/common.less
index a5c2b20..8aa8b1a 100644
--- a/src/assets/less/common.less
+++ b/src/assets/less/common.less
@@ -1,6 +1,8 @@
 @primary-color: #E63636;
 @font-color: #1D2129;
 @label-font-color: #767676;
+@global-bg: #F4F4F4;
+@pad-base: 0.32rem;
 
 .page-box {
   height: 100%;
diff --git a/src/assets/less/list.less b/src/assets/less/list.less
new file mode 100644
index 0000000..e3a41fa
--- /dev/null
+++ b/src/assets/less/list.less
@@ -0,0 +1,133 @@
+.list-container {
+  height: 100%;
+  background: @global-bg;
+  display: flex;
+  flex-direction: column;
+  .list-box {
+    flex: 1;
+    overflow: auto;
+    padding: @pad-base;
+    .van-swipe-cell{
+      border-radius: 0.1rem;
+    }
+    .van-swipe-cell + .van-swipe-cell{
+      margin-top: 0.24rem;
+    }
+  }
+}
+
+
+//每一个面板对应的样式
+.item-box {
+  background: #FFFFFF;
+  padding: @pad-base;
+  position: relative;
+  border-radius: 0.1rem;
+
+  & + .item-box{
+    margin-top: 0.24rem;
+  }
+
+  // 左滑后 样式的变化
+  &.item-box-has-swipe{
+    border-radius: 0.1rem 0 0 0.1rem;
+    .item-state{
+      border-radius: 0 0 0 0.1rem;
+    }
+  }
+  // 标题的文字
+  .item-title {
+    font-size: 0.28rem;
+    text-align: left;
+    display: flex;
+    align-items: center;
+    span {
+      display: inline-block;
+      text-align: left;
+    }
+
+    .title {
+      width: 3.05rem;
+    }
+
+    .score {
+      font-size: 0.2rem;
+      line-height: 0.2rem;
+      border-radius: .16rem .16rem .16rem .02rem;
+      background-color: #F2F2F2;
+      padding: 0.07rem 0.15rem;
+      max-width: 2rem;
+      .green{
+        color: #25C4A0;
+      }
+      .red{
+        color: #FF4C4C;
+      }
+    }
+  }
+
+  //  内容部分
+  .item-content {
+    padding: 0.2rem 0;
+    & > span {
+      display: flex;
+      align-items: baseline;
+      color: @font-color;
+      font-size: 0.22rem;
+      text-align: left;
+    }
+    & > span + span {
+      margin-top: 0.1rem;
+    }
+    .label {
+      display: inline-block;
+      width: 1.2rem;
+      text-align: left;
+    }
+    .text{
+      white-space: pre-wrap;
+      word-break: break-all;
+      flex: 1;
+      width: 0;
+    }
+  }
+
+  //操作部分
+  .item-ope {
+    font-size: 0.24rem;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    & > span {
+      display: flex;
+      align-items: center;
+      img{
+        width: 0.36rem;
+        height: 0.36rem;
+      }
+      span {
+        margin-left: 0.1rem;
+      }
+    }
+  }
+
+  .item-state{
+    width: 1rem;
+    height: 0.48rem;
+    line-height: 0.48rem;
+    background: @primary-color;
+    border-radius: 0 0.1rem;
+    font-size: 0.2rem;
+    color: #FFFFFF;
+    text-align: center;
+    position: absolute;
+    right: 0;
+    top: 0;
+  }
+
+  .item-state-have-evaluation {
+    background: rgba(48, 116, 246, 0.1);
+    color: @primary-color;
+  }
+
+}
diff --git a/src/common/lang/en-us.js b/src/common/lang/en-us.js
index 71cf556..153bb08 100644
--- a/src/common/lang/en-us.js
+++ b/src/common/lang/en-us.js
@@ -16,5 +16,18 @@ module.exports = {
   expirationDate: '截止日期',
   processExplain: '流程说明',
   pleaseSelect: '请选择',
-  pleaseEnter: '请输入'
+  pleaseEnter: '请输入',
+  basicInfo: '基础信息',
+  personalInfo: '人员信息',
+  turnTo: '转办',
+  agree: '同意',
+  reject: '驳回',
+  processApprovalInfo: '流程审批信息',
+  remark: '备注',
+  clickSelect: '点击选择',
+  selectUser: '选择人员',
+  standardEntryOrChange: {
+    source: '来源',
+    operationType: '操作类型'
+  }
 }
diff --git a/src/common/lang/zh-cn.js b/src/common/lang/zh-cn.js
index fceb110..a914caa 100644
--- a/src/common/lang/zh-cn.js
+++ b/src/common/lang/zh-cn.js
@@ -24,6 +24,8 @@ module.exports = {
   reject: '驳回',
   processApprovalInfo: '流程审批信息',
   remark: '备注',
+  clickSelect: '点击选择',
+  selectUser: '选择人员',
   standardEntryOrChange: {
     source: '来源',
     operationType: '操作类型'
diff --git a/src/components/CustomHeader.vue b/src/components/CustomHeader.vue
new file mode 100644
index 0000000..669d6ef
--- /dev/null
+++ b/src/components/CustomHeader.vue
@@ -0,0 +1,56 @@
+<template>
+  <div class="">
+    <van-nav-bar
+      :title="title"
+      :left-arrow="leftArrow"
+      placeholder
+      @click-left="handleBack"
+    />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'CustomHeader',
+  props: {
+    title: {
+      type: String,
+      default: '主页'
+    },
+    leftArrow: {
+      type: Boolean,
+      default: false
+    },
+    handleLeft: {
+      type: Function,
+      required: false
+    }
+  },
+  methods: {
+    handleBack () {
+      if (this.handleLeft) {
+        this.handleLeft()
+      } else {
+        this.$router.go(-1)
+      }
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+::v-deep .van-nav-bar{
+  height: 0.88rem;
+  line-height: 0.88rem;
+  &__content {
+    height: 100%;
+  }
+  .van-icon-arrow-left{
+    font-size: 0.3rem;
+  }
+  .van-nav-bar__title{
+    font-size: 0.3rem;
+  }
+}
+
+</style>
diff --git a/src/components/SelectUser.vue b/src/components/SelectUser.vue
new file mode 100644
index 0000000..fa68c63
--- /dev/null
+++ b/src/components/SelectUser.vue
@@ -0,0 +1,331 @@
+<!-- 选择评价人员 -->
+<template>
+  <div class="list-container">
+    <van-search
+      v-model="filters.realname"
+      show-action
+      :clearable="true"
+      input-align="center"
+      label="姓名"
+      placeholder="请输入姓名"
+      @search="onSearch"
+    >
+      <template #action>
+        <div @click="onSearch">搜索</div>
+      </template>
+    </van-search>
+    <van-list
+      v-model="loading"
+      :finished="listFinished"
+      :finished-text="listData.length > 0 ? '没有更多了' : '暂无数据'"
+      @load="onLoadMore"
+      :immediate-check="false"
+    >
+      <van-checkbox-group v-if="type === 'checkbox'" v-model="checkedArr" ref="checkboxGroup">
+        <van-swipe-cell
+          v-for="(item, index) in listData"
+          :key="index"
+          :name="index"
+          stop-propagation
+          :before-close="handleBeforeClose"
+        >
+          <div class="item-box">
+            <van-checkbox :name="item.id" @click="checkboxClick(item)" shape="square" :disabled="readonly"></van-checkbox>
+            <div>
+              <div class="item-title">
+                <span class="title">{{ item.realname }}</span>
+                <span class="score">工号({{ item.username || '暂无数据' }})</span>
+              </div>
+              <div class="item-content">
+              <span>
+                <span class="label">角色: </span>
+                <span class="text">{{ item.roleTxt || '暂无数据' }}</span>
+              </span>
+                <span>
+                <span class="label">岗位: </span>
+                <span class="text">{{ item.post || '暂无数据' }}</span>
+              </span>
+              </div>
+            </div>
+          </div>
+        </van-swipe-cell>
+      </van-checkbox-group>
+      <van-radio-group v-else v-model="checkedArr" ref="checkboxGroup">
+        <van-swipe-cell
+          v-for="(item, index) in listData"
+          :key="index"
+          :name="index"
+          stop-propagation
+          :before-close="handleBeforeClose"
+        >
+          <div class="item-box">
+            <van-radio :name="item.id" @click="checkboxClick(item)" :disabled="readonly"></van-radio>
+            <div>
+              <div class="item-title">
+                <span class="title">{{ item.realname }}</span>
+                <span class="score">工号({{ item.username || '暂无数据' }})</span>
+              </div>
+              <div class="item-content">
+              <span>
+                <span class="label">角色: </span>
+                <span class="text">{{ item.roleTxt || '暂无数据' }}</span>
+              </span>
+                <span>
+                <span class="label">岗位: </span>
+                <span class="text">{{ item.post || '暂无数据' }}</span>
+              </span>
+              </div>
+            </div>
+          </div>
+        </van-swipe-cell>
+      </van-radio-group>
+    </van-list>
+
+    <!--    底部的按钮  -->
+    <div class="bottom-button-container">
+      <div class="bottom-btn bottom-justify-div">
+        <van-button size="small" color="#C6C7CA" native-type="button" plain :disabled="disabled" @click="resetFunc">重置
+        </van-button>
+        <van-button v-if="type === 'checkbox'" size="small" color="#E63636" native-type="button" :disabled="disabled" @click="checkAll">全选</van-button>
+        <van-button size="small" color="#E63636" native-type="button" :disabled="disabled" @click="confirmFunc()">确定
+        </van-button>
+        <van-button size="small" color="#C6C7CA" native-type="button" plain :disabled="disabled" @click="$emit('cancel')">取消
+        </van-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import ListMixin from '../mixins/ListMixin'
+
+export default {
+  name: 'SelectUser',
+  mixins: [ListMixin],
+  props: {
+    selectedData: {
+      type: String,
+      required: false,
+      default: () => {
+        return ''
+      }
+    },
+    // 一些其他的查询参数
+    filterData: {
+      type: Object,
+      required: false,
+      default: () => {
+        return {}
+      }
+    },
+    readonly: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    type: {
+      type: String,
+      required: false,
+      default: 'radio'
+    }
+  },
+  // watch: {
+  //   selectedData: {
+  //     immediate: true,
+  //     deep: true,
+  //     handler (val) {
+  //       console.log(val)
+  //       this.handleCheckedArr()
+  //     }
+  //   }
+  // },
+  data () {
+    return {
+      loading: false, // 加载数据的标识，
+      listFinished: false, // 完成加载的标识
+      refreshing: false, // 下拉刷新的标志
+      listData: [], // 列表页的数据
+      listCount: 0, // 所有数据的数量
+      /* 分页的配置 */
+      ipagination: {
+        pageNo: 1,
+        pageSize: 10
+      },
+      url: {
+        list: '/sys/user/page'
+      },
+      checkedArr: [],
+      selectedDataArr: []
+    }
+  },
+  computed: {
+    disabled () {
+      return this.listData.length === 0 || this.readonly
+    }
+  },
+  methods: {
+    checkboxClick (item) {
+      console.log(item)
+      if (this.type === 'checkbox') {
+        if (this.checkedArr.includes(item.id)) {
+          console.log('------------增加了数据------------')
+          // 说明是增加了数据,为了顺序和列表顺序保持一致，用循环设置
+          const arr = []
+          for (const i of this.listData) {
+            if (this.checkedArr.includes(i.id)) {
+              arr.push(i)
+            }
+          }
+          this.selectedDataArr = arr
+        } else {
+          console.log('------------删除了数据------------')
+          // 说明是删除了数据
+          this.selectedDataArr = this.selectedDataArr.filter(i => i.id !== item.id)
+        }
+      } else {
+        this.selectedDataArr = [item]
+      }
+      console.log(this.selectedDataArr)
+    },
+    handleCheckedArr () {
+      // 清空选中的数据
+      if (this.type === 'checkbox') {
+        if (this.selectedData) {
+          this.checkedArr = this.selectedData.split(',')
+        } else {
+          this.checkedArr = []
+        }
+      } else {
+        if (this.selectedData) {
+          this.checkedArr = this.selectedData
+        } else {
+          this.checkedArr = ''
+        }
+      }
+    },
+    // 初始化数据
+    initData () {
+      this.ipagination.pageNo = 1
+      this.listData = []
+      this.listFinished = false
+      this.refreshing = false
+      this.loading = true
+      this.handleCheckedArr()
+    },
+    // 重置按钮点击的方法
+    resetFunc () {
+      this.checkedArr = []
+    },
+    checkAll () {
+      this.$refs.checkboxGroup.toggleAll(true)
+      this.selectedDataArr = [...this.listData]
+    },
+    // 确定 按钮触发的方法
+    confirmFunc () {
+      console.log(this.checkedArr)
+      //   先判断是否选择数据，没有提示
+      if ((this.type === 'checkbox' && this.checkedArr.length === 0) || (this.type === 'radio' && (!this.checkedArr || this.checkedArr.length === 0))) {
+        this.$message('请至少选择一条数据')
+        return
+      }
+      if (this.type === 'checkbox') {
+        this.$emit('selected-change', this.checkedArr.join(','))
+      } else {
+        this.$emit('selected-change', this.checkedArr)
+      }
+      this.$emit('selected-change-name', this.selectedDataArr.map(item => item.realname + '(' + item.username + ')').join(','))
+    },
+    onSearch () {
+      this.getListData()
+    }
+  }
+
+}
+</script>
+
+<style scoped lang="less">
+@import '~@assets/less/list.less';
+@import '~@assets/less/common.less';
+
+.list-container{
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  height: 0;
+}
+
+.van-list {
+  padding: @pad-base;
+  flex: 1;
+  overflow: auto;
+}
+
+// 中间内容
+.item-box {
+  background: #FFFFFF;
+  padding: @pad-base;
+  display: flex;
+  align-items: center;
+
+  .van-checkbox{
+    display: block;
+    margin: 0 20px 0 0;
+  }
+
+  .van-radio {
+    display: block;
+    margin: 0 20px 0 0;
+  }
+
+  /deep/ .van-checkbox__icon--checked {
+    .van-icon {
+      background: @primary-color;
+      border-color: @primary-color;
+    }
+  }
+
+  /deep/ .van-radio__icon--checked {
+    .van-icon {
+      background: @primary-color;
+      border-color: @primary-color;
+    }
+  }
+
+  & + .item-box {
+    margin-top: 0.24rem;
+  }
+
+  // 左滑后 样式的变化
+  &.item-box-has-swipe {
+    border-radius: 0.1rem 0 0 0.1rem;
+
+    .item-state {
+      border-radius: 0 0 0 0.1rem;
+    }
+  }
+}
+
+// 底部按钮
+.bottom-button-container {
+  height: 1.28rem;
+  line-height: 1.28rem;
+  padding: 0 0.2rem;
+  background: #FFFFFF;
+}
+.bottom-justify-div {
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+  gap: 0.2rem;
+
+  .van-button {
+    height: 0.8rem;
+    flex: 1;
+  }
+  /deep/ .van-button--plain {
+    color: #898989 !important;
+  }
+}
+
+</style>
diff --git a/src/components/SelectUserField.vue b/src/components/SelectUserField.vue
new file mode 100644
index 0000000..919870f
--- /dev/null
+++ b/src/components/SelectUserField.vue
@@ -0,0 +1,233 @@
+<template>
+  <div>
+    <van-field
+      v-model="selectedDataNames"
+      :label="label"
+      :placeholder="$t('clickSelect') + label"
+      readonly
+      rows="1"
+      autosize
+      type="textarea"
+      @click="handleSelect"
+    >
+
+    </van-field>
+    <van-popup class="history-list-popup" v-model="isShow" position="right" :style="{ width: '100%', height: '100%' }" >
+      <!--    增加一个标题-->
+      <custom-header :title="$t('selectUser')" :leftArrow="true" :handle-left="handleLeft"></custom-header>
+
+      <select-user
+        ref="evaluatePersonSelectedList"
+        :selected-data="value"
+        :filter-data="filterData"
+        @selected-change="selectedChange"
+        @selected-change-name="selectedChangeName"
+        @cancel="hide()"
+        v-bind="$attrs"
+        :readonly="readonly"
+      ></select-user>
+    </van-popup>
+  </div>
+</template>
+
+<script>
+import SelectUser from './SelectUser'
+import CustomHeader from './CustomHeader'
+export default {
+  name: 'SelectUserField',
+  components: { SelectUser, CustomHeader },
+  props: {
+    // 选中的多个id 以逗号“,”拼接
+    value: {
+      type: String,
+      required: true,
+      default: () => {
+        return ''
+      }
+    },
+    // 一些其他的查询参数
+    filterData: {
+      type: Object,
+      required: false,
+      default: () => {
+        return {}
+      }
+    },
+    readonly: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    checkedNames: {
+      type: String,
+      required: false,
+      default: () => {
+        return ''
+      }
+    },
+    label: {
+      type: String,
+      required: false,
+      default: '人员'
+    },
+    fieldName: {
+      type: String,
+      required: false,
+      default: ''
+    }
+  },
+  watch: {
+    checkedNames: {
+      immediate: true,
+      // deep: true,
+      handler (val) {
+        this.selectedDataNames = val
+      }
+    }
+  },
+  data () {
+    return {
+      isShow: false,
+      selectedDataNames: ''
+    }
+  },
+  methods: {
+    handleSelect () {
+      if (this.readonly) {
+        return
+      }
+      this.isShow = true
+      this.$nextTick(() => {
+        this.$refs.evaluatePersonSelectedList.initData()
+        this.$refs.evaluatePersonSelectedList.getListData()
+      })
+    },
+    handleLeft () {
+      this.hide()
+    },
+    hide () {
+      this.isShow = false
+    },
+    // 选择人员组件 选择后返回的方法
+    selectedChange (value) {
+      this.$emit('select', value)
+      this.hide()
+    },
+    selectedChangeName (value) {
+      this.selectedDataNames = value
+      this.$emit('selectNameChange', value, this.fieldName)
+    }
+  },
+  model: {
+    prop: 'value',
+    event: 'select'
+  }
+}
+</script>
+
+<style scoped lang="less">
+@import '~@assets/less/common.less';
+
+.history-list-popup{
+  background: @global-bg;
+  display: flex;
+  flex-direction: column;
+}
+.van-list{
+  padding: @pad-base;
+  flex: 1;
+  overflow: auto;
+}
+.item-box .item-title.full-width .title{
+  width: 100%;
+}
+// 底部按钮
+.bottom-justify-div{
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+  .van-button{
+    padding: 0 @pad-base;
+  }
+}
+// 中间内容
+.item-box{
+  background: #FFFFFF;
+  padding: @pad-base;
+  & + .item-box{
+    margin-top: 0.24rem;
+  }
+
+  // 左滑后 样式的变化
+  &.item-box-has-swipe{
+    border-radius: 0.1rem 0 0 0.1rem;
+    .item-state{
+      border-radius: 0 0 0 0.1rem;
+    }
+  }
+
+  .van-checkbox{
+    width: 100%;
+    display: flex;
+    align-items: center;
+    /deep/.van-checkbox__label{
+      flex: 1;
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      margin-left: 0;
+    }
+  }
+  .left-img{
+    display: flex;
+    flex-direction: row;
+    flex-basis: 1.5rem;
+    .van-image{
+      width: 1.2rem;
+      height: 1.2rem;
+      margin: 0 0.24rem;
+    }
+  }
+
+  .right-content{
+    width: 0;
+    flex: 1;
+    .title{
+      width: 3.05rem;
+      font-weight: bold;
+    }
+    .item-title{
+      font-size: 0.28rem;
+      text-align: left;
+      display: flex;
+      align-items: center;
+      span {
+        display: inline-block;
+        text-align: left;
+      }
+
+    }
+    .item-content{
+      padding: 0.2rem 0 0;
+      span {
+        display: flex;
+        align-items: baseline;
+        color: @font-color;
+        font-size: 0.22rem;
+        text-align: left;
+        white-space: pre-wrap;
+        word-break: break-all;
+      }
+    }
+  }
+}
+
+.history-btn{
+  padding: 0 @pad-base;
+
+}
+//.van-cell{
+//  padding: 0.27rem 0!important;
+//}
+
+</style>
diff --git a/src/mixins/ListMixin.js b/src/mixins/ListMixin.js
new file mode 100644
index 0000000..b1e3948
--- /dev/null
+++ b/src/mixins/ListMixin.js
@@ -0,0 +1,156 @@
+import { Toast, Dialog } from 'vant'
+import { getAction, deleteAction } from '../api/manage'
+
+const ListMixin = {
+  data () {
+    return {
+      loading: false, // 加载数据的标识，
+      listFinished: false, // 完成加载的标识
+      refreshing: false, // 下拉刷新的标志
+
+      listData: [], // 列表页的数据
+      listCount: 0, // 所有数据的数量
+      /* 分页的配置 */
+      ipagination: {
+        pageNo: 1,
+        pageSize: 10
+      },
+      /* 排序参数 */
+      isorter: {
+        column: 'createTime',
+        order: 'desc'
+      },
+      /* 筛选参数 */
+      filters: {},
+      showDialog: false // 是否显示删除二次确认弹框，解决 在二次确认的时候可以关闭列表中的滑块
+    }
+  },
+  methods: {
+    // 刷新数据的方法
+    onRefresh () {
+      // 可以调用获得数据的方法，并且把数据的页码重置
+      this.initData()
+      const callback = () => {
+        Toast('刷新成功')
+      }
+      this.getListData(callback)
+    },
+    // 加载更多数据的方法
+    onLoadMore () {
+      ++this.ipagination.pageNo
+      this.getListData()
+    },
+
+    // 获得所有的信息
+    getListData (callback) {
+      if (!this.url.list) {
+        Toast('请设置url.list属性!')
+        return
+      }
+      const params = Object.assign({}, this.ipagination, this.isorter, this.filters)
+
+      this.loading = true
+      getAction(this.url.list, params).then(res => {
+        if (res.success) {
+          const dataSource = res.result.records || res.result
+          // 判断是否有处理返回数据的方法，有则先进行处理
+          this.handleList && this.handleList(dataSource)
+          // 判断是否是首页，首页则重新赋值，其他的是合并
+          this.listData = this.ipagination.pageNo === 1 ? dataSource : this.listData.concat(dataSource)
+          this.ipagination.pageNo = res.result.current || 1
+          this.listCount = res.result.total
+          if (this.listData.length >= this.listCount || dataSource.length === 0) {
+            this.listFinished = true
+          }
+          callback && callback()
+        } else {
+          this.listFinished = true
+        }
+      }, () => {
+        this.listFinished = true
+      }).finally(() => {
+        this.loading = false
+      })
+    },
+    // 初始化数据
+    initData () {
+      this.ipagination.pageNo = 1
+      this.listData = []
+      this.listFinished = false
+      this.refreshing = false
+      this.loading = true
+    },
+    // 滑块打开事件
+    handleSwipeOpen ({ name }) {
+      this.listData[name].showSwipe = true
+      this.$set(this.listData, name, this.listData[name])
+    },
+    // 滑块关闭事件
+    handleSwipeClose ({ position, name }) {
+      console.log(position, name)
+      this.listData[name].showSwipe = false
+      this.$set(this.listData, name, this.listData[name])
+      if (position === 'right') {
+        //  代表的是点击删除按钮
+      }
+    },
+    /*
+    * description: 删除滑块关闭前触发的方法
+    * params: name - 标识符 String
+    * params: position -关闭时的点击位置 (left right cell outside)
+    * params: instance -SwipeCell 实例，用于调用实例方法
+    *
+    * */
+    handleBeforeClose ({ name, position, instance }) {
+      const that = this
+      // console.log("position---------", position)
+      switch (position) {
+        case 'left':
+        case 'cell':
+        case 'outside':
+          if (!that.showDialog) {
+            instance.close()
+          }
+          break
+        case 'right':
+          that.showDialog = true
+          Dialog.confirm({
+            message: '确定要删除此条数据吗？'
+          }).then(() => {
+            // on confirm
+            //  调用删除的接口
+            console.log('调用删除的接口-------', name)
+            const id = that.listData[name].id
+            if (!this.url.delete) {
+              Toast('请设置url.delete!')
+              instance.close()
+              return
+            }
+            deleteAction(that.url.delete, { id }).then((res) => {
+              if (res.success) {
+                Toast('删除成功')
+                that.ipagination.pageNo = 1
+                that.listFinished = false
+                that.getListData()
+              } else {
+                Toast(res.message)
+              }
+              instance.close()
+              that.showDialog = false
+            }, () => {
+              // 接口404等异常处理
+              instance.close()
+              that.showDialog = false
+            })
+          }).catch(() => {
+            // on cancel
+            instance.close()
+            that.showDialog = false
+          })
+          break
+      }
+    }
+  }
+}
+
+export default ListMixin
diff --git a/src/views/workCenter/enterpriseStandardInitChange/EnterpriseStandardInitChange.vue b/src/views/workCenter/enterpriseStandardInitChange/EnterpriseStandardInitChange.vue
index 102a816..c42d055 100644
--- a/src/views/workCenter/enterpriseStandardInitChange/EnterpriseStandardInitChange.vue
+++ b/src/views/workCenter/enterpriseStandardInitChange/EnterpriseStandardInitChange.vue
@@ -26,6 +26,15 @@
             type="date"
             readonly
           />
+          <select-user-field
+            class="form-item"
+            v-model="processInfoForm.appraiserObjArr"
+            :checked-names="processInfoForm.appraiserObjArr_dictText"
+            fieldName="appraiserObjArr"
+            @selectNameChange="selectUserNameChange"
+            :readonly="false"
+            type="radio"
+          />
         </van-form>
       </div>
       <!--   业务基本信息   -->
@@ -37,6 +46,11 @@
         <div class="process-part-title">{{ $t('processApprovalInformation') }}</div>
       </div>
     </template>
+    <template v-slot:operation>
+      <van-button icon="revoke" class="operation-common-btn">{{ $t('turnTo') }}</van-button>
+      <van-button icon="revoke" class="operation-common-btn" type="primary" @click="handleAgree">{{ $t('agree') }}</van-button>
+      <van-button icon="revoke" class="operation-common-btn light-color-button">{{ $t('reject') }}</van-button>
+    </template>
   </process-common-layout>
 </template>
 
@@ -44,22 +58,35 @@
 import ProcessCommonLayout from '@/components/ProcessCommonLayout'
 import { ProcessKey } from '@/enums/commonEnums'
 import CalendarField from '@/components/CalendarField'
+import SelectUserField from '@/components/SelectUserField'
 
 export default {
   name: 'EnterpriseStandardInitChange',
   components: {
     ProcessCommonLayout,
-    CalendarField
+    CalendarField,
+    SelectUserField
   },
   data () {
     return {
       ProcessKey,
       readonly: false,
-      processInfoForm: {} // 流程信息表单
+      processInfoForm: {
+        appraiserObjArr: ''
+      } // 流程信息表单
     }
   },
   methods: {
-
+    selectUserNameChange (value, fieldName) {
+      this.processInfoForm[fieldName + '_dictText'] = value
+    },
+    onFailed () {},
+    onSubmit () {
+      console.log(this.processInfoForm)
+    },
+    handleAgree () {
+      this.onSubmit()
+    }
   }
 }
 </script>