From 7101e6006b9416eb0960defd234b3683061be453 Mon Sep 17 00:00:00 2001
From: WindowBird <13870814+windows-bird@user.noreply.gitee.com>
Date: Mon, 17 Nov 2025 16:58:11 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=BB=BA=E9=A1=B9=E7=9B=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/project.js               |   26 +
 pages.json                   |    7 +
 pages/project/form/index.vue | 1071 ++++++++++++++++++++++++++++++++++
 pages/project/list/index.vue |   40 +-
 4 files changed, 1135 insertions(+), 9 deletions(-)
 create mode 100644 pages/project/form/index.vue

diff --git a/api/project.js b/api/project.js
index 1af6abd..66cb8d4 100644
--- a/api/project.js
+++ b/api/project.js
@@ -100,3 +100,29 @@ export const getProjectDetail = (id) => {
   });
 };
 
+/**
+ * 创建项目
+ * @param {Object} data 项目数据
+ * @returns {Promise} 创建结果
+ */
+export const createProject = (data) => {
+  return uni.$uv.http.post('bst/project', data, {
+    custom: {
+      auth: true
+    }
+  });
+};
+
+/**
+ * 更新项目
+ * @param {Object} data 项目数据（需包含 id）
+ * @returns {Promise} 更新结果
+ */
+export const updateProject = (data) => {
+  return uni.$uv.http.put('bst/project', data, {
+    custom: {
+      auth: true
+    }
+  });
+};
+
diff --git a/pages.json b/pages.json
index a06ec67..b9edee3 100644
--- a/pages.json
+++ b/pages.json
@@ -138,6 +138,13 @@
 				"navigationStyle": "custom"
 			}
 		},
+		{
+			"path": "pages/project/form/index",
+			"style": {
+				"navigationBarTitleText": "项目编辑",
+				"navigationStyle": "custom"
+			}
+		},
 		{
 			"path": "pages/project/list/index",
 			"style": {
diff --git a/pages/project/form/index.vue b/pages/project/form/index.vue
new file mode 100644
index 0000000..86cb32f
--- /dev/null
+++ b/pages/project/form/index.vue
@@ -0,0 +1,1071 @@
+<template>
+  <view class="project-form-page">
+    <view class="custom-navbar">
+      <view class="navbar-content">
+        <text class="nav-btn" @click="handleBack">取消</text>
+        <text class="nav-title">{{ pageTitle }}</text>
+        <text
+          class="nav-btn"
+          :class="{ disabled: !canSubmit || submitting }"
+          @click="handleSubmit"
+        >
+          {{ mode === 'edit' ? '保存' : '创建' }}
+        </text>
+      </view>
+    </view>
+
+    <view class="loading-box" v-if="pageLoading">
+      <text class="loading-text">加载中...</text>
+    </view>
+
+    <scroll-view class="form-scroll" scroll-y v-else>
+      <view class="form-container">
+        <view class="form-section">
+          <view class="section-title">基本信息</view>
+
+          <view class="form-item">
+            <text class="form-label required">项目名称</text>
+            <input
+              class="form-input"
+              v-model.trim="formData.name"
+              placeholder="请输入项目名称"
+              placeholder-style="color:#999;"
+            />
+          </view>
+
+          <view class="form-item">
+            <text class="form-label">项目编号</text>
+            <input
+              class="form-input"
+              v-model.trim="formData.no"
+              placeholder="可填写项目编号"
+              placeholder-style="color:#999;"
+            />
+          </view>
+
+          <view class="form-row">
+            <view class="form-item half">
+              <text class="form-label required">项目金额（元）</text>
+              <input
+                class="form-input"
+                v-model="formData.amount"
+                type="digit"
+                placeholder="请输入金额"
+                placeholder-style="color:#999;"
+              />
+            </view>
+            <view class="form-item half">
+              <text class="form-label">到账时间</text>
+              <view class="picker-input" @click="openDatePicker('expireTime')">
+                <text>{{ formData.expireTime || '请选择日期' }}</text>
+                <text class="picker-arrow">›</text>
+              </view>
+            </view>
+          </view>
+
+          <view class="form-item">
+            <text class="form-label required">客户</text>
+            <view class="picker-input" @click="openCustomerPicker">
+              <text>{{ formData.customerName || '请选择客户' }}</text>
+              <text class="picker-arrow">›</text>
+            </view>
+          </view>
+
+          <view class="form-item">
+            <text class="form-label">标签</text>
+            <input
+              class="form-input"
+              v-model.trim="formData.projectTags"
+              placeholder="请输入标签，多个以逗号分隔"
+              placeholder-style="color:#999;"
+            />
+          </view>
+
+          <view class="form-item">
+            <text class="form-label">备注</text>
+            <textarea
+              class="form-textarea"
+              v-model="formData.remark"
+              placeholder="请输入备注"
+              placeholder-style="color:#999;"
+            />
+          </view>
+        </view>
+
+        <view class="form-section">
+          <view class="section-title">费用规划</view>
+          <view
+            class="cost-block"
+            v-for="item in costFields"
+            :key="item.amountKey"
+          >
+            <view class="cost-row">
+              <text class="cost-title">{{ item.label }}</text>
+              <view class="cost-inputs">
+                <view class="cost-item">
+                  <text class="cost-label">金额（元）</text>
+                  <input
+                    class="form-input"
+                    type="digit"
+                    v-model="formData[item.amountKey]"
+                    placeholder="请输入金额"
+                    placeholder-style="color:#999;"
+                  />
+                </view>
+                <view class="cost-item">
+                  <text class="cost-label">收款时间</text>
+                  <view
+                    class="picker-input"
+                    @click="openDatePicker(item.dateKey)"
+                  >
+                    <text>{{ formData[item.dateKey] || '请选择日期' }}</text>
+                    <text class="picker-arrow">›</text>
+                  </view>
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+
+        <view class="form-section">
+          <view class="section-title">附件</view>
+          <AttachmentFileUploader
+            v-model="formData.attaches"
+            :max-count="10"
+            title="上传附件"
+          />
+          <text class="section-tip">
+            支持 png/jpg/jpeg/doc/docx/xls/xlsx/ppt/pdf/zip/rar 等格式，单个不超过 200MB
+          </text>
+        </view>
+
+        <view class="form-section">
+          <view class="section-title member-header">
+            <text>项目成员</text>
+            <uv-button size="mini" type="primary" @click="openMemberModal">
+              选择成员
+            </uv-button>
+          </view>
+          <view class="member-table">
+            <view class="member-row header">
+              <text class="col index">序号</text>
+              <text class="col name">成员</text>
+              <text class="col role">角色</text>
+              <text class="col action">操作</text>
+            </view>
+            <view
+              class="member-row"
+              v-for="(member, index) in formData.memberList"
+              :key="member.userId || index"
+            >
+              <text class="col index">{{ index + 1 }}</text>
+              <view class="col name member-name">
+                <text>{{ member.userName || '未命名' }}</text>
+              </view>
+              <view class="col role role-options">
+                <label
+                  class="role-option"
+                  :class="{ active: member.role === 'OWNER' }"
+                  @click="updateMemberRole(member.userId, 'OWNER')"
+                >
+                  <text class="radio"></text>
+                  <text>负责人</text>
+                </label>
+                <label
+                  class="role-option"
+                  :class="{ active: member.role !== 'OWNER' }"
+                  @click="updateMemberRole(member.userId, 'NORMAL')"
+                >
+                  <text class="radio"></text>
+                  <text>跟进人</text>
+                </label>
+              </view>
+              <text class="col action action-btn" @click="removeMember(member.userId)">
+                删除
+              </text>
+            </view>
+            <view class="empty-tip" v-if="!formData.memberList.length">
+              请点击「选择成员」添加项目成员
+            </view>
+          </view>
+        </view>
+      </view>
+    </scroll-view>
+
+    <view class="bottom-bar">
+      <uv-button
+        type="primary"
+        :disabled="!canSubmit || submitting"
+        :loading="submitting"
+        @click="handleSubmit"
+      >
+        {{ mode === 'edit' ? '保存修改' : '创建项目' }}
+      </uv-button>
+    </view>
+
+    <uv-picker
+      ref="customerPickerRef"
+      :columns="customerColumns"
+      keyName="label"
+      @confirm="handleCustomerConfirm"
+    ></uv-picker>
+
+    <uv-datetime-picker
+      ref="datePickerRef"
+      v-model="datePickerValue"
+      :mode="datePickerMode"
+      @confirm="onDateConfirm"
+    ></uv-datetime-picker>
+
+    <view class="member-modal" v-if="showMemberModal">
+      <view class="modal-mask" @click="closeMemberModal"></view>
+      <view class="modal-panel">
+        <view class="modal-header">
+          <text class="modal-title">选择成员</text>
+          <text class="modal-close" @click="closeMemberModal">✕</text>
+        </view>
+        <view class="search-box">
+          <input
+            v-model.trim="memberKeyword"
+            class="search-input"
+            placeholder="搜索姓名或部门"
+            placeholder-style="color:#999;"
+          />
+        </view>
+        <scroll-view class="member-list" scroll-y>
+          <view
+            class="member-item"
+            v-for="user in filteredMemberOptions"
+            :key="user.userId"
+            @click="toggleMember(user.userId)"
+          >
+            <view class="member-info">
+              <text class="member-name-text">{{ user.userName }}</text>
+              <text class="member-dept" v-if="user.deptName">{{ user.deptName }}</text>
+            </view>
+            <view
+              class="select-indicator"
+              :class="{ active: selectedMemberIds.includes(user.userId) }"
+            ></view>
+          </view>
+          <view class="empty-tip" v-if="!filteredMemberOptions.length">
+            <text>暂无匹配的成员</text>
+          </view>
+        </scroll-view>
+        <view class="modal-actions">
+          <uv-button @click="closeMemberModal">取消</uv-button>
+          <uv-button type="primary" @click="confirmMemberSelection">确定</uv-button>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref, computed } from 'vue';
+import { onLoad } from '@dcloudio/uni-app';
+import AttachmentFileUploader from '@/components/task/AttachmentFileUploader.vue';
+import {
+  getCustomerList,
+  getUserList,
+  getProjectDetail,
+  createProject,
+  updateProject
+} from '@/api';
+
+const costFields = [
+  { label: '前期费用', amountKey: 'developmentCost', dateKey: 'developmentTime' },
+  { label: '中期费用', amountKey: 'middleCost', dateKey: 'middleTime' },
+  { label: '后期费用', amountKey: 'afterCost', dateKey: 'afterTime' }
+];
+
+const mode = ref('add');
+const pageTitle = computed(() => (mode.value === 'edit' ? '编辑项目' : '新建项目'));
+const pageLoading = ref(true);
+const submitting = ref(false);
+const projectId = ref('');
+
+const formData = ref(createDefaultForm());
+
+const customerOptions = ref([]);
+const customerPickerRef = ref(null);
+const customerColumns = computed(() => [customerOptions.value]);
+
+const memberOptions = ref([]);
+const memberKeyword = ref('');
+const showMemberModal = ref(false);
+const selectedMemberIds = ref([]);
+
+const datePickerRef = ref(null);
+const datePickerValue = ref(Date.now());
+const datePickerMode = ref('date');
+const pendingDateField = ref('');
+
+const canSubmit = computed(() => {
+  return (
+    !!formData.value.name &&
+    !!formData.value.customerId &&
+    !!formData.value.amount &&
+    formData.value.memberList.length > 0 &&
+    !submitting.value
+  );
+});
+
+const filteredMemberOptions = computed(() => {
+  if (!memberKeyword.value) return memberOptions.value;
+  const keyword = memberKeyword.value.toLowerCase();
+  return memberOptions.value.filter((item) => {
+    const name = (item.userName || '').toLowerCase();
+    const dept = (item.deptName || '').toLowerCase();
+    return name.includes(keyword) || dept.includes(keyword);
+  });
+});
+
+onLoad(async (options) => {
+  if (options?.mode) {
+    mode.value = options.mode === 'edit' ? 'edit' : 'add';
+  }
+  if (options?.id) {
+    projectId.value = options.id;
+    mode.value = 'edit';
+  }
+
+  try {
+    await Promise.all([loadCustomerOptions(), loadMemberOptions()]);
+    if (mode.value === 'edit' && projectId.value) {
+      await loadProjectDetail(projectId.value);
+    }
+  } finally {
+    pageLoading.value = false;
+  }
+});
+
+const handleBack = () => {
+  uni.navigateBack();
+};
+
+const openCustomerPicker = async () => {
+  if (!customerOptions.value.length) {
+    await loadCustomerOptions();
+  }
+  if (!customerOptions.value.length) {
+    uni.showToast({
+      title: '暂无可选客户',
+      icon: 'none'
+    });
+    return;
+  }
+  if (customerPickerRef.value?.open) {
+    customerPickerRef.value.open();
+  }
+};
+
+const handleCustomerConfirm = ({ value }) => {
+  const selected = value?.[0];
+  if (selected) {
+    formData.value.customerId = String(selected.value);
+    formData.value.customerName = selected.label;
+  }
+};
+
+const openDatePicker = (field) => {
+  pendingDateField.value = field;
+  datePickerMode.value = 'date';
+  datePickerValue.value = formData.value[field]
+    ? new Date(formData.value[field].replace(/-/g, '/')).getTime()
+    : Date.now();
+  if (datePickerRef.value?.open) {
+    datePickerRef.value.open();
+  }
+};
+
+const onDateConfirm = (event) => {
+  if (!pendingDateField.value || !event?.value) return;
+  formData.value[pendingDateField.value] = formatDate(event.value);
+};
+
+const openMemberModal = () => {
+  selectedMemberIds.value = formData.value.memberList
+    .map((member) => member.userId)
+    .filter((id) => id);
+  memberKeyword.value = '';
+  showMemberModal.value = true;
+};
+
+const closeMemberModal = () => {
+  showMemberModal.value = false;
+};
+
+const toggleMember = (userId) => {
+  const id = String(userId);
+  const index = selectedMemberIds.value.indexOf(id);
+  if (index >= 0) {
+    selectedMemberIds.value.splice(index, 1);
+  } else {
+    selectedMemberIds.value.push(id);
+  }
+};
+
+const confirmMemberSelection = () => {
+  const existingMap = new Map(
+    formData.value.memberList.map((member) => [String(member.userId), member])
+  );
+  const selected = memberOptions.value.filter((user) =>
+    selectedMemberIds.value.includes(user.userId)
+  );
+  formData.value.memberList = selected.map((user) => {
+    const persisted = existingMap.get(user.userId);
+    return {
+      userId: user.userId,
+      userName: user.userName,
+      userAvatar: user.avatar || user.userAvatar || '',
+      role: persisted?.role || 'NORMAL'
+    };
+  });
+  showMemberModal.value = false;
+};
+
+const removeMember = (userId) => {
+  formData.value.memberList = formData.value.memberList.filter(
+    (member) => member.userId !== userId
+  );
+};
+
+const updateMemberRole = (userId, role) => {
+  formData.value.memberList = formData.value.memberList.map((member) => {
+    if (member.userId === userId) {
+      return { ...member, role };
+    }
+    return member;
+  });
+};
+
+const handleSubmit = async () => {
+  if (!canSubmit.value || submitting.value) {
+    if (!canSubmit.value) {
+      uni.showToast({
+        title: '请完善必填信息',
+        icon: 'none'
+      });
+    }
+    return;
+  }
+
+  submitting.value = true;
+  uni.showLoading({
+    title: mode.value === 'edit' ? '保存中...' : '创建中...'
+  });
+
+  const payload = buildPayload();
+  try {
+    if (mode.value === 'edit') {
+      payload.id = projectId.value || payload.id;
+      await updateProject(payload);
+    } else {
+      await createProject(payload);
+    }
+    uni.showToast({
+      title: mode.value === 'edit' ? '保存成功' : '创建成功',
+      icon: 'success'
+    });
+    uni.$emit('projectListRefresh');
+    setTimeout(() => {
+      uni.navigateBack();
+    }, 600);
+  } catch (error) {
+    console.error('保存项目失败:', error);
+  } finally {
+    submitting.value = false;
+    uni.hideLoading();
+  }
+};
+
+const loadCustomerOptions = async () => {
+  try {
+    const res = await getCustomerList({ pageNum: 1, pageSize: 200 });
+    customerOptions.value = (res.rows || []).map((item) => ({
+      label: item.name,
+      value: String(item.id),
+      raw: item
+    }));
+  } catch (error) {
+    console.error('加载客户列表失败:', error);
+    uni.showToast({
+      title: '加载客户失败',
+      icon: 'none'
+    });
+  }
+};
+
+const loadMemberOptions = async () => {
+  try {
+    const res = await getUserList({ pageSize: 200 });
+    memberOptions.value = (res.rows || res.data || res.list || []).map((item) => ({
+      userId: String(item.userId || item.id),
+      userName: item.userName || item.nickName || '',
+      deptName: item.deptName || item.dept?.deptName || '',
+      avatar: item.avatar || item.userAvatar || ''
+    }));
+  } catch (error) {
+    console.error('加载成员列表失败:', error);
+    uni.showToast({
+      title: '加载成员失败',
+      icon: 'none'
+    });
+  }
+};
+
+const loadProjectDetail = async (id) => {
+  try {
+    const detail = await getProjectDetail(id);
+    if (!detail) return;
+    const merged = {
+      ...createDefaultForm(),
+      ...detail
+    };
+    formData.value = {
+      ...formData.value,
+      id: merged.id || id,
+      no: merged.no || '',
+      name: merged.name || merged.projectName || '',
+      amount: merged.amount != null ? String(merged.amount) : '',
+      customerId: merged.customerId ? String(merged.customerId) : merged.customerId,
+      customerName: merged.customerName || '',
+      expireTime: normalizeDateString(merged.expireTime),
+      projectTags: merged.projectTags || '',
+      remark: merged.remark || '',
+      developmentCost: safeNumberToString(merged.developmentCost),
+      middleCost: safeNumberToString(merged.middleCost),
+      afterCost: safeNumberToString(merged.afterCost),
+      developmentTime: normalizeDateString(merged.developmentTime),
+      middleTime: normalizeDateString(merged.middleTime),
+      afterTime: normalizeDateString(merged.afterTime),
+      attaches: normalizeAttaches(merged.attaches),
+      memberList: normalizeMembers(merged.memberList)
+    };
+  } catch (error) {
+    console.error('获取项目详情失败:', error);
+    uni.showToast({
+      title: '加载项目失败',
+      icon: 'none'
+    });
+  }
+};
+
+function createDefaultForm() {
+  return {
+    id: null,
+    no: '',
+    name: '',
+    amount: '',
+    customerId: '',
+    customerName: '',
+    expireTime: '',
+    projectTags: '',
+    remark: '',
+    developmentCost: '',
+    middleCost: '',
+    afterCost: '',
+    developmentTime: '',
+    middleTime: '',
+    afterTime: '',
+    attaches: [],
+    memberList: []
+  };
+}
+
+const buildPayload = () => {
+  const payload = {
+    id: formData.value.id,
+    no: formData.value.no || null,
+    name: formData.value.name,
+    amount: parseNumber(formData.value.amount),
+    customerId: formData.value.customerId,
+    customerName: formData.value.customerName,
+    expireTime: formData.value.expireTime || null,
+    projectTags: formData.value.projectTags || '',
+    remark: formData.value.remark || '',
+    developmentCost: parseNumber(formData.value.developmentCost),
+    developmentTime: formData.value.developmentTime || null,
+    middleCost: parseNumber(formData.value.middleCost),
+    middleTime: formData.value.middleTime || null,
+    afterCost: parseNumber(formData.value.afterCost),
+    afterTime: formData.value.afterTime || null,
+    attaches: formData.value.attaches.map((file, index) => ({
+      name: file.name || getFileNameFromUrl(file.path),
+      url: file.path,
+      uid: file.uid || `${Date.now()}_${index}`,
+      status: 'success'
+    })),
+    memberList: formData.value.memberList.map((member) => ({
+      userId: member.userId,
+      userName: member.userName,
+      userAvatar: member.userAvatar || '',
+      role: member.role || 'NORMAL'
+    }))
+  };
+  return payload;
+};
+
+const parseNumber = (value) => {
+  if (value === null || value === undefined || value === '') return null;
+  const num = Number(value);
+  return Number.isNaN(num) ? null : num;
+};
+
+const safeNumberToString = (value) => {
+  if (value === null || value === undefined || value === '') return '';
+  return String(value);
+};
+
+const normalizeDateString = (value) => {
+  if (!value) return '';
+  return value.split(' ')[0];
+};
+
+const normalizeAttaches = (value) => {
+  if (!value) return [];
+  if (Array.isArray(value)) {
+    return value
+      .map((item, index) => ({
+        name: item.name || getFileNameFromUrl(item.url || item.path),
+        path: item.url || item.path,
+        size: item.size || 0,
+        uid: item.uid || `${Date.now()}_${index}`
+      }))
+      .filter((item) => item.path);
+  }
+  if (typeof value === 'string') {
+    return value
+      .split(',')
+      .map((url, index) => url.trim())
+      .filter((url) => url)
+      .map((url, index) => ({
+        name: getFileNameFromUrl(url),
+        path: url,
+        size: 0,
+        uid: `${Date.now()}_${index}`
+      }));
+  }
+  return [];
+};
+
+const normalizeMembers = (value) => {
+  if (!Array.isArray(value)) return [];
+  return value
+    .map((member) => ({
+      userId: String(member.userId || member.id || ''),
+      userName: member.userName || member.name || '',
+      userAvatar: member.userAvatar || member.avatar || '',
+      role: member.role || 'NORMAL'
+    }))
+    .filter((member) => member.userId);
+};
+
+const getFileNameFromUrl = (url = '') => {
+  if (!url) return '附件';
+  const parts = url.split('/');
+  return parts[parts.length - 1] || '附件';
+};
+
+const formatDate = (timestamp) => {
+  const date = new Date(timestamp);
+  const y = date.getFullYear();
+  const m = String(date.getMonth() + 1).padStart(2, '0');
+  const d = String(date.getDate()).padStart(2, '0');
+  return `${y}-${m}-${d}`;
+};
+</script>
+
+<style scoped lang="scss">
+.project-form-page {
+  min-height: 100vh;
+  background: #f5f5f5;
+  display: flex;
+  flex-direction: column;
+}
+
+.custom-navbar {
+  height: 56px;
+  padding: 0 16px;
+  display: flex;
+  align-items: flex-end;
+  background: #fff;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
+}
+
+.navbar-content {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-bottom: 10px;
+}
+
+.nav-btn {
+  font-size: 15px;
+  color: #1677ff;
+  min-width: 48px;
+  text-align: center;
+
+  &.disabled {
+    color: #ccc;
+  }
+}
+
+.nav-title {
+  font-size: 16px;
+  font-weight: 600;
+  color: #111;
+}
+
+.loading-box {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.loading-text {
+  color: #666;
+}
+
+.form-scroll {
+  flex: 1;
+}
+
+.form-container {
+  padding: 16px;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+.form-section {
+  background: #fff;
+  border-radius: 12px;
+  padding: 16px;
+}
+
+.section-title {
+  font-size: 15px;
+  font-weight: 600;
+  margin-bottom: 12px;
+  color: #111;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+}
+
+.form-item {
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 12px;
+  gap: 8px;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
+
+.form-row {
+  display: flex;
+  gap: 12px;
+}
+
+.form-item.half {
+  flex: 1;
+}
+
+.form-label {
+  font-size: 13px;
+  color: #666;
+}
+
+.form-label.required::after {
+  content: '*';
+  color: #ff4d4f;
+  margin-left: 4px;
+}
+
+.form-input,
+.form-textarea,
+.picker-input {
+  width: 100%;
+  background: #f7f8fa;
+  border-radius: 8px;
+  padding: 0 12px;
+  min-height: 40px;
+  display: flex;
+  align-items: center;
+  font-size: 14px;
+  color: #111;
+}
+
+.form-textarea {
+  min-height: 90px;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}
+
+.picker-input {
+  justify-content: space-between;
+}
+
+.picker-arrow {
+  color: #999;
+  font-size: 18px;
+}
+
+.cost-block {
+  border-radius: 12px;
+  background: #f9fafc;
+  padding: 12px;
+  margin-bottom: 12px;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
+
+.cost-row {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.cost-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: #333;
+}
+
+.cost-inputs {
+  display: flex;
+  gap: 12px;
+}
+
+.cost-item {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.cost-label {
+  font-size: 12px;
+  color: #666;
+}
+
+.section-tip {
+  display: block;
+  margin-top: 8px;
+  font-size: 12px;
+  color: #999;
+}
+
+.member-table {
+  border-radius: 12px;
+  border: 1px solid #f0f0f0;
+  overflow: hidden;
+}
+
+.member-row {
+  display: flex;
+  align-items: center;
+  padding: 12px;
+  background: #fff;
+
+  &.header {
+    background: #f5f6f7;
+    font-weight: 600;
+    color: #555;
+  }
+
+  &:not(.header) + .member-row {
+    border-top: 1px solid #f0f0f0;
+  }
+}
+
+.member-name {
+  font-weight: 500;
+  color: #333;
+}
+
+.col {
+  font-size: 13px;
+  color: #333;
+}
+
+.col.index {
+  width: 50px;
+}
+
+.col.name {
+  flex: 1;
+}
+
+.col.role {
+  width: 180px;
+}
+
+.col.action {
+  width: 60px;
+  text-align: right;
+}
+
+.action-btn {
+  color: #ff4d4f;
+}
+
+.empty-tip {
+  padding: 16px;
+  text-align: center;
+  color: #999;
+  font-size: 13px;
+}
+
+.role-options {
+  display: flex;
+  gap: 16px;
+}
+
+.role-option {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  color: #666;
+  font-size: 12px;
+
+  .radio {
+    width: 14px;
+    height: 14px;
+    border-radius: 50%;
+    border: 1px solid #bbb;
+  }
+
+  &.active {
+    color: #1677ff;
+
+    .radio {
+      border-color: #1677ff;
+      background: #1677ff;
+    }
+  }
+}
+
+.bottom-bar {
+  padding: 12px 16px;
+  background: #fff;
+  box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.03);
+}
+
+.member-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 999;
+}
+
+.modal-mask {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.4);
+}
+
+.modal-panel {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: #fff;
+  border-top-left-radius: 16px;
+  border-top-right-radius: 16px;
+  padding: 16px;
+  display: flex;
+  flex-direction: column;
+  max-height: 80%;
+}
+
+.modal-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 12px;
+}
+
+.modal-title {
+  font-size: 16px;
+  font-weight: 600;
+}
+
+.modal-close {
+  font-size: 20px;
+  color: #999;
+}
+
+.search-box {
+  margin-bottom: 12px;
+}
+
+.search-input {
+  width: 100%;
+  background: #f5f6f7;
+  border-radius: 10px;
+  padding: 10px 14px;
+  font-size: 14px;
+}
+
+.member-list {
+  flex: 1;
+}
+
+.member-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px 0;
+  border-bottom: 1px solid #f0f0f0;
+}
+
+.member-info {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.member-name-text {
+  font-size: 14px;
+  color: #333;
+}
+
+.member-dept {
+  font-size: 12px;
+  color: #999;
+}
+
+.select-indicator {
+  width: 18px;
+  height: 18px;
+  border-radius: 50%;
+  border: 1px solid #ccc;
+
+  &.active {
+    border-color: #1677ff;
+    background: #1677ff;
+  }
+}
+
+.modal-actions {
+  display: flex;
+  gap: 12px;
+  margin-top: 12px;
+}
+</style>
+
diff --git a/pages/project/list/index.vue b/pages/project/list/index.vue
index 8a454d6..13a6e73 100644
--- a/pages/project/list/index.vue
+++ b/pages/project/list/index.vue
@@ -98,6 +98,9 @@
         <uv-button size="small" @click="handleReset">
           <text>重置</text>
         </uv-button>
+        <uv-button type="success" size="small" @click="goToCreateProject">
+          <text>新增项目</text>
+        </uv-button>
       </view>
     </view>
     
@@ -198,7 +201,7 @@
 </template>
 
 <script setup>
-import { ref, computed, watch, onMounted, nextTick } from 'vue';
+import { ref, computed, watch, onMounted, nextTick, onUnmounted } from 'vue';
 import { onLoad, onReachBottom, onPullDownRefresh } from '@dcloudio/uni-app';
 import { getProjectList, getUserList } from '@/api';
 import { usePagination } from '@/composables';
@@ -472,8 +475,7 @@ const handleCardMenu = (project) => {
     itemList: ['修改', '删除', '+ 新增任务', '√ 开始开发'],
     success: (res) => {
       if (res.tapIndex === 0) {
-        // 修改
-        uni.showToast({ title: '修改功能开发中', icon: 'none' });
+        goToEditProject(project);
       } else if (res.tapIndex === 1) {
         // 删除
         uni.showToast({ title: '删除功能开发中', icon: 'none' });
@@ -488,6 +490,25 @@ const handleCardMenu = (project) => {
   });
 };
 
+const goToCreateProject = () => {
+  uni.navigateTo({
+    url: '/pages/project/form/index?mode=add'
+  });
+};
+
+const goToEditProject = (project) => {
+  if (!project?.id) {
+    uni.showToast({
+      title: '缺少项目ID',
+      icon: 'none'
+    });
+    return;
+  }
+  uni.navigateTo({
+    url: `/pages/project/form/index?mode=edit&id=${project.id}`
+  });
+};
+
 // 处理状态标签点击
 const handleStatusTabClick = (value) => {
   activeStatusTab.value = value;
@@ -579,12 +600,15 @@ watch(() => userStore.privateView, () => {
 });
 
 onMounted(() => {
-  // 加载字典数据
   if (!dictStore.isLoaded) {
     dictStore.loadDictData();
   }
-  // 加载成员列表
   loadMemberList();
+  uni.$on('projectListRefresh', handleSearch);
+});
+
+onUnmounted(() => {
+  uni.$off('projectListRefresh', handleSearch);
 });
 
 onLoad(() => {
@@ -725,7 +749,7 @@ onLoad(() => {
 /* 移动端适配 */
 @media (max-width: 768px) {
   .project-container {
-    //grid-template-columns: repeat(2, 1fr);
+    grid-template-columns: repeat(2, 1fr);
     gap: 12px;
     padding: 12px;
   }
@@ -733,9 +757,7 @@ onLoad(() => {
 
 @media (max-width: 480px) {
   .project-container {
-    //grid-template-columns: 1fr;
-
-
+    grid-template-columns: 1fr;
   }
 }