|
|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<view class="container">
|
|
|
- <view class="bg-white" style="padding: 10rpx 20rpx;">
|
|
|
+ <view class="bg-white" style="padding: 16rpx 20rpx;">
|
|
|
<scroll-view scroll-x :scroll-into-view="state.intoView" class="org-nav">
|
|
|
<view
|
|
|
class="org-nav-item"
|
|
|
@@ -56,14 +56,15 @@
|
|
|
<fs-popup v-model="orgState.showAddOrg" direction="right">
|
|
|
<view class="container">
|
|
|
<view class="main">
|
|
|
- <fs-form>
|
|
|
- <fs-form-item label="名称">
|
|
|
- <fs-field required placeholder="请输入组织名称" v-model="orgState.orgForm.name" border maxlength="10"></fs-field>
|
|
|
+ <fs-form ref="orgRef" :model="orgState.orgForm">
|
|
|
+ <fs-form-item label="名称" required>
|
|
|
+ <fs-field placeholder="请输入组织名称" v-model="orgState.orgForm.name" maxlength="10"></fs-field>
|
|
|
</fs-form-item>
|
|
|
</fs-form>
|
|
|
</view>
|
|
|
<view class="org-ft">
|
|
|
- <fs-button block round @click="handleAddOrg">{{orgState.orgForm.id ? '修改组织' : '添加组织'}}</fs-button>
|
|
|
+ <!-- <fs-button block round @click="handleAddOrg">{{orgState.orgForm.id ? '修改组织' : '添加组织'}}</fs-button> -->
|
|
|
+ <fs-button block round @click="handleAddOrg">保存</fs-button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</fs-popup>
|
|
|
@@ -71,20 +72,23 @@
|
|
|
<fs-popup v-model="staffState.showAddStaff" direction="right">
|
|
|
<view class="container">
|
|
|
<view class="main">
|
|
|
- <fs-form>
|
|
|
+ <fs-form
|
|
|
+ ref="staffRef"
|
|
|
+ :model="staffState.staff"
|
|
|
+ >
|
|
|
<fs-form-item label="姓名" required>
|
|
|
- <fs-field placeholder="请输入员工姓名" v-model="staffState.staff.name" border maxlength="10"></fs-field>
|
|
|
+ <fs-field placeholder="请输入员工姓名" v-model="staffState.staff.name" maxlength="10"></fs-field>
|
|
|
</fs-form-item>
|
|
|
<fs-form-item label="手机号" required>
|
|
|
- <fs-field placeholder="请输入员工手机号" v-model="staffState.staff.phone" border></fs-field>
|
|
|
+ <fs-field type="number" placeholder="请输入员工手机号" v-model="staffState.staff.phone"></fs-field>
|
|
|
</fs-form-item>
|
|
|
<fs-form-item label="职位">
|
|
|
- <fs-field placeholder="请输入员工职位" v-model="staffState.staff.position" border></fs-field>
|
|
|
+ <fs-field placeholder="请输入员工职位" v-model="staffState.staff.position"></fs-field>
|
|
|
</fs-form-item>
|
|
|
<fs-form-item label="照片">
|
|
|
<fs-upload
|
|
|
action=""
|
|
|
- size="200rpx"
|
|
|
+ size="180rpx"
|
|
|
v-model="staffState.staff.icon"
|
|
|
:count="1">
|
|
|
</fs-upload>
|
|
|
@@ -92,7 +96,8 @@
|
|
|
</fs-form>
|
|
|
</view>
|
|
|
<view class="org-ft">
|
|
|
- <fs-button block round @click="handleAddStaff">{{staffState.staff.id ? '修改员工' : '添加员工'}}</fs-button>
|
|
|
+ <!-- <fs-button block round @click="handleAddStaff">{{staffState.staff.id ? '修改员工' : '添加员工'}}</fs-button> -->
|
|
|
+ <fs-button block round @click="handleAddStaff">保存</fs-button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</fs-popup>
|
|
|
@@ -100,8 +105,12 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { reactive } from 'vue'
|
|
|
+import { ref, reactive } from 'vue'
|
|
|
import { getOrgList, addOrg, delOrg, editOrg, addStaff, delStaff, editStaff } from '@/services/company'
|
|
|
+import useForm from '@/hooks/useForm'
|
|
|
+import useValidator from '@/hooks/useValidator'
|
|
|
+
|
|
|
+const validator = useValidator()
|
|
|
|
|
|
const swipeOptions = [
|
|
|
{
|
|
|
@@ -170,6 +179,17 @@ fetchOrgList()
|
|
|
|
|
|
|
|
|
// 添加组织相关逻辑
|
|
|
+const orgRef = ref(null)
|
|
|
+const formRules = {
|
|
|
+ name: {
|
|
|
+ required: true,
|
|
|
+ message: '请输入组织名称',
|
|
|
+ transform(value) {
|
|
|
+ return value.trim()
|
|
|
+ }
|
|
|
+ },
|
|
|
+}
|
|
|
+const orgForm = useForm(formRules, 'orgRef')
|
|
|
const orgState = reactive({
|
|
|
showAddOrg: false,
|
|
|
orgForm: {
|
|
|
@@ -177,48 +197,44 @@ const orgState = reactive({
|
|
|
},
|
|
|
})
|
|
|
const handleAddOrg = () => {
|
|
|
- if(!orgState.orgForm.name) {
|
|
|
- return uni.showToast({
|
|
|
- title: '请输入组织名称',
|
|
|
- icon: 'none'
|
|
|
- })
|
|
|
- }
|
|
|
- if (orgState.orgForm.id) {
|
|
|
- editOrg(orgState.orgForm).then(res => {
|
|
|
- getOrgList().then(res => {
|
|
|
- state.orgList = res.data.results || []
|
|
|
-
|
|
|
- uni.showToast({
|
|
|
- title: '修改成功',
|
|
|
- icon: 'none'
|
|
|
+ orgForm.validate(orgState.orgForm).then(res => {
|
|
|
+ if (orgState.orgForm.id) {
|
|
|
+ editOrg(orgState.orgForm).then(res => {
|
|
|
+ getOrgList().then(res => {
|
|
|
+ state.orgList = res.data.results || []
|
|
|
+
|
|
|
+ uni.showToast({
|
|
|
+ title: '修改成功',
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ state.curOrgList.splice(orgState.orgForm.index, 1, orgState.orgForm)
|
|
|
+ orgState.orgForm = {
|
|
|
+ name: ''
|
|
|
+ }
|
|
|
+ orgState.showAddOrg = false
|
|
|
})
|
|
|
- state.curOrgList.splice(orgState.orgForm.index, 1, orgState.orgForm)
|
|
|
- orgState.orgForm = {
|
|
|
- name: ''
|
|
|
- }
|
|
|
- orgState.showAddOrg = false
|
|
|
})
|
|
|
- })
|
|
|
- } else{
|
|
|
- addOrg({
|
|
|
- ...orgState.orgForm,
|
|
|
- parentId: orgState.curOrgId
|
|
|
- }).then(res => {
|
|
|
- getOrgList().then(data => {
|
|
|
- orgState.orgList = data.data.results || []
|
|
|
-
|
|
|
- uni.showToast({
|
|
|
- title: '添加成功',
|
|
|
- icon: 'none'
|
|
|
+ } else{
|
|
|
+ addOrg({
|
|
|
+ ...orgState.orgForm,
|
|
|
+ parentId: orgState.curOrgId
|
|
|
+ }).then(res => {
|
|
|
+ getOrgList().then(data => {
|
|
|
+ orgState.orgList = data.data.results || []
|
|
|
+
|
|
|
+ uni.showToast({
|
|
|
+ title: '添加成功',
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ orgState.curOrgList.push(res.data)
|
|
|
+ orgState.orgForm = {
|
|
|
+ name: ''
|
|
|
+ }
|
|
|
+ orgState.showAddOrg = false
|
|
|
})
|
|
|
- orgState.curOrgList.push(res.data)
|
|
|
- orgState.orgForm = {
|
|
|
- name: ''
|
|
|
- }
|
|
|
- orgState.showAddOrg = false
|
|
|
})
|
|
|
- })
|
|
|
- }
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
const handleOrgOption = ({option, data}) => {
|
|
|
if (option.type === 'del') {
|
|
|
@@ -243,6 +259,20 @@ const handleOrgOption = ({option, data}) => {
|
|
|
|
|
|
|
|
|
// 添加员工相关逻辑
|
|
|
+const staffRef = ref(null)
|
|
|
+const staffFormRules = {
|
|
|
+ name: {
|
|
|
+ required: true,
|
|
|
+ message: '请输入员工姓名',
|
|
|
+ transform(value) {
|
|
|
+ return value.trim()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ phone: {
|
|
|
+ validator: validator.mobile,
|
|
|
+ },
|
|
|
+}
|
|
|
+const staffForm = useForm(staffFormRules, 'staffRef')
|
|
|
const staff = {
|
|
|
name: '',
|
|
|
phone: '',
|
|
|
@@ -279,38 +309,40 @@ const handleStaffOption = ({option, data}) => {
|
|
|
}
|
|
|
}
|
|
|
const handleAddStaff = () => {
|
|
|
- if (staffState.staff.id) {
|
|
|
- editStaff({
|
|
|
- ...staffState.staff,
|
|
|
- icon: staffState.staff.icon[0] || '',
|
|
|
- }).then(res => {
|
|
|
- uni.showToast({
|
|
|
- title: '修改成功',
|
|
|
- icon: 'none'
|
|
|
+ staffForm.validate(staffState.staff).then(() => {
|
|
|
+ if (staffState.staff.id) {
|
|
|
+ editStaff({
|
|
|
+ ...staffState.staff,
|
|
|
+ icon: staffState.staff.icon[0] || '',
|
|
|
+ }).then(res => {
|
|
|
+ uni.showToast({
|
|
|
+ title: '修改成功',
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ staffState.curStaffList.splice(staffState.staff.index, 1, staffState.staff)
|
|
|
+ staffState.staff = {
|
|
|
+ ...staff
|
|
|
+ }
|
|
|
+ staffState.showAddStaff = false
|
|
|
})
|
|
|
- staffState.curStaffList.splice(staffState.staff.index, 1, staffState.staff)
|
|
|
- staffState.staff = {
|
|
|
- ...staff
|
|
|
- }
|
|
|
- staffState.showAddStaff = false
|
|
|
- })
|
|
|
- } else{
|
|
|
- addStaff({
|
|
|
- ...staffState.staff,
|
|
|
- icon: staffState.staff.icon[0] || '',
|
|
|
- orgId: staffState.curOrgId,
|
|
|
- }).then(res => {
|
|
|
- uni.showToast({
|
|
|
- title: '添加成功',
|
|
|
- icon: 'none'
|
|
|
+ } else{
|
|
|
+ addStaff({
|
|
|
+ ...staffState.staff,
|
|
|
+ icon: staffState.staff.icon[0] || '',
|
|
|
+ orgId: staffState.curOrgId,
|
|
|
+ }).then(res => {
|
|
|
+ uni.showToast({
|
|
|
+ title: '添加成功',
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ staffState.curStaffList.push(res.data)
|
|
|
+ staffState.staff = {
|
|
|
+ ...staff
|
|
|
+ }
|
|
|
+ staffState.showAddStaff = false
|
|
|
})
|
|
|
- staffState.curStaffList.push(res.data)
|
|
|
- staffState.staff = {
|
|
|
- ...staff
|
|
|
- }
|
|
|
- staffState.showAddStaff = false
|
|
|
- })
|
|
|
- }
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
</script>
|
|
|
|