瀏覽代碼

feat: 数字名片表单ui调整

王晓东 1 月之前
父節點
當前提交
d917b343de

+ 9 - 2
project.private.config.json

@@ -8,12 +8,19 @@
   "condition": {
     "miniprogram": {
       "list": [
+        {
+          "name": "pages/editor-contact/index",
+          "pathName": "pages/editor-contact/index",
+          "query": "agentId=p_2e73c9d7efaYfDo2-agent_2731",
+          "scene": null,
+          "launchMode": "default"
+        },
         {
           "name": "pages/agent-gen/index",
           "pathName": "pages/agent-gen/index",
           "query": "avatarUrl=https%3A%2F%2Fxlb-xly.oss-cn-hangzhou.aliyuncs.com%2Fu260727532%2F20250923%2FZgKVD10MiT_831383c0bbaa4f128cca7ebf92dddc68.jpeg",
-          "scene": null,
-          "launchMode": "default"
+          "launchMode": "default",
+          "scene": null
         },
         {
           "name": "pages/agent-avatars/index",

+ 2 - 2
src/components/custom-share/ShareWxaCard/index.tsx

@@ -4,7 +4,7 @@
 
 import { Canvas } from "@tarojs/components";
 import style from "./index.module.less";
-import { getCanvasTempPath, saveFile } from "@/utils/index";
+import { getCanvasTempPath, saveMediaFile } from "@/utils/index";
 import { checkPermission, showAuthModal } from "@/utils/auth";
 import { APP_NAME_TEXT, DEFAULT_AVATAR } from '@/config'
 
@@ -51,7 +51,7 @@ export default forwardRef(({ agent }: Props, ref) => {
       showAuthModal("需要您相册权限");
       return;
     }
-    const res = await saveFile(tmpImage);
+    const res = await saveMediaFile(tmpImage);
     if(res){
       Taro.showToast({
         title: '保存成功'

+ 2 - 2
src/components/list/ListRow/index.tsx

@@ -16,9 +16,9 @@ export default ({underline=false, arrow=false, rightRenderer, onClick, children}
       className={`flex items-center ${underline ? 'border-bottom1-gray': ''}`}
       onClick={handleClick}
     >
-      <View className="text-14 py-18 font-medium leading-22 flex-1 shrink-0">{children}</View>
+      <View className="text-14 py-18 font-medium leading-22 flex-1 shrink-0 flex items-center">{children}</View>
       {rightRenderer && rightRenderer()}
       {arrow && <View className="flex-center"><IconArrowRight24/></View>}
     </View>
   )
-}
+}

+ 3 - 3
src/components/list/ListWrapper/index.tsx

@@ -3,12 +3,12 @@ interface IProps {
   children: JSX.Element[]|JSX.Element
 }
 export default ({children}: IProps) => {
-  
+
   return (
     <View
-      className='bg-white rounded-12 overflow-hidden flex flex-col px-16'
+      className='bg-white rounded-12 overflow-hidden flex flex-col px-16 w-full'
     >
       {children}
     </View>
   )
-}
+}

+ 5 - 3
src/components/wemeta-input/index.tsx

@@ -16,6 +16,7 @@ interface Props {
   extraStyle?: Record<string, string>;
   adjustPosition?: boolean
   maxlength?: number;
+  placeholderStyle?: string;
 }
 let isInbox = false;
 const index = ({
@@ -31,7 +32,8 @@ const index = ({
   suffix,
   onBlur,
   adjustPosition,
-  maxlength
+  maxlength,
+  placeholderStyle,
 }: Props) => {
   const [focus, setFocus] = useState(false);
   const inputRef = useRef<HTMLInputElement>(null); // 创建一个 ref
@@ -58,7 +60,7 @@ const index = ({
     }
     onInput && onInput(value);
   };
-  
+
   return (
     <View
       className={`${
@@ -77,7 +79,7 @@ const index = ({
           adjustPosition={adjustPosition}
           onInput={(e: any) => handleInput(e.target.value)}
           placeholder={placeholder}
-          placeholderStyle="rgba(0,0,0,.25)"
+          placeholderStyle={placeholderStyle ?? "color: rgba(17,17,17,.25)"}
           className={style.textInput}
           onFocus={handleFocus}
           onBlur={handleBlur}

+ 1 - 2
src/pages/agent-avatars/index.tsx

@@ -126,7 +126,6 @@ export default function Index() {
       url: current.avatarUrl,
       success: (res) => {
         if (res.statusCode === 200) {
-          res.tempFilePath
           saveMedia(res.tempFilePath)
         }
       },
@@ -155,7 +154,7 @@ export default function Index() {
             loop={true}
             muted={true}
             objectFit="cover"
-            src={avatar.avatarUrl}
+            src={`${avatar.avatarUrl}?x-oss-process=image/resize,w_450/quality,q_60`}
             className="w-full h-full"
           />
           <View className={style.blurBg}></View>

+ 1 - 1
src/pages/agent/components/AgentSetting/components/AgentContactCard/index.tsx

@@ -1,4 +1,4 @@
-import { View, Text, Input} from "@tarojs/components"
+import { View, Text, Input, Textarea} from "@tarojs/components"
 import style from './index.module.less'
 import IconPlusBlue from "@/components/icon/icon-plus-blue"
 import { useAgentStore, useAgentStoreActions } from "@/store/agentStore";

+ 2 - 0
src/pages/agent/components/AgentSetting/components/AgentSettingList/index.tsx

@@ -82,6 +82,7 @@ export default forwardRef(function Index(props, ref) {
         prefix={() => <View>人设</View>}
         placeholder="示例:你是一名汽车销售人员,拥有专业的汽车相关知识,善于耐心的解答客户提出的每一个问题,并会主动邀请客户上门试驾。"
         value={getDisplayValue('personality')}
+        cursorSpacing={20}
         autoHeight
         ref={personalityPolishRef}
         onInput={(value) => {
@@ -92,6 +93,7 @@ export default forwardRef(function Index(props, ref) {
       <WemetaTextareaAI
         aiType="greeting"
         defaultAiTips={defalutPolishGreeting}
+        cursorSpacing={20}
         prefix={() => <View>开场白</View>}
         placeholder="开场白是你的智能体和用户说的第一句话,简单做个自我介绍吧"
         value={getDisplayValue('greeting')}

+ 14 - 0
src/pages/editor-contact/index.module.less

@@ -0,0 +1,14 @@
+.value{
+
+}
+.label{
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 28px;
+  font-family: PingFangSC-Medium;
+  color: #000;
+  width:100%;
+}

+ 168 - 160
src/pages/editor-contact/index.tsx

@@ -1,184 +1,192 @@
 import NavBarNormal from "@/components/NavBarNormal/index";
-import { View } from "@tarojs/components";
+import { View, Input, Text } from "@tarojs/components";
 import PageCustom from "@/components/page-custom/index";
-
-import CardList from "@/components/list/card-list";
-import ListWrapper from "@/components/list/ListWrapper";
-import ListRow from "@/components/list/ListRow";
-import TagCertificated from "@/components/tag-certificated";
+import WemetaInput from '@/components/wemeta-input/index'
 import Taro, { useRouter } from "@tarojs/taro";
-import { useAgentStore } from "@/store/agentStore";
+import { useAgentStore, useAgentStoreActions } from "@/store/agentStore";
 import { TAgentDetail } from "@/types/agent";
 import { useState } from "react";
+import BottomBar from "@/components/BottomBar";
+import WemetaButton from "@/components/buttons/WemetaButton";
+import style from './index.module.less'
 
-const RenderEntCard = (
-  agent: TAgentDetail | null,
-  navToUrl: (url: string) => void
-) => {
-  const agentContactCard = useAgentStore((state)=> state.agentContactCard)
 
-  if (!agent?.isEnt) {
-    return <View className="px-16 w-full pt-12">
-        <ListWrapper>
-            <ListRow
-              underline
-              arrow
-              onClick={()=> {navToUrl('/pages/editor-pages/editor-ent-name/index')}}
-            >
-              <View className="flex items-center font-normal">
-                <View className="flex-1 font-normal">企业</View>
-                <View className="text-gray-5 truncate max-w-[188px]">
-                  {agent?.entName}
-                </View>
-              </View>
-            </ListRow>
-            <ListRow
-              arrow
-              onClick={()=> {navToUrl('/pages/editor-pages/editor-position/index')}}
-            >
-              <View className="flex items-center font-normal">
-                  <View className="flex-1 font-normal">职位</View>
-                  <View className="text-gray-5 mr-8">{agent?.position}</View>
-                </View>
-            </ListRow>
-        </ListWrapper>
-      </View>;
-  }
+// const RenderEntCard = (
+//   agent: TAgentDetail | null,
+//   navToUrl: (url: string) => void
+// ) => {
 
-  return (
-    <View className="px-16 w-full pt-12">
-      <ListWrapper>
-          <ListRow
-            underline
-          >
-            <View className="flex items-center font-normal">
-              <View className="flex-1 font-normal">企业</View>
-              <View className="text-gray-5 truncate max-w-[188px]">
-                {agent?.entName}
-              </View>
-            </View>
-          </ListRow>
-          <ListRow underline>
-            <View className="flex items-center font-normal">
-              <View className="flex-1 font-normal">企业认证</View>
-              <TagCertificated />
-            </View>
-          </ListRow>
-          <ListRow
-            arrow
-            onClick={()=> {navToUrl('/pages/editor-pages/editor-position/index')}}
-          >
-            <View className="flex items-center font-normal">
-              <View className="flex-1 font-normal">职位</View>
-              <View className="text-gray-5 mr-8">{agent?.position}</View>
-            </View>
-            {/* <PickerSingleColumn headerTitle="您的岗位" options={options} selected={selected} onPicked={handlePicked} showPicker={showPicker} setShowPicker={setShowPicker}>
-              <View className="flex items-center font-normal" onClick={() => setShowPicker(true)}>
-                <View className="flex-1 font-normal">职位</View>
-                <View className="text-gray-5 mr-8">{agent?.position}</View>
-              </View>
-            </PickerSingleColumn> */}
-          </ListRow>
-      </ListWrapper>
-    </View>
-  );
-};
+//   if (!agent?.isEnt) {
+//     return <View className="px-16 w-full pt-12">
+//       <ListWrapper>
+//         <Vie//           arrow
+//           onClick={() => { navToUrl('/pages/editor-pages/editor-ent-name/index') }}
+//         >
+//           <View className="flex items-center font-normal">
+//             <View className="flex-1 font-normal">企业</View>
+//             <View className="text-gray-5 truncate max-w-[188px]">
+//               {agent?.entName}
+//             </View>
+//           </View>
+//         </View>
+//         <View
+//           arrow
+//           onClick={() => { navToUrl('/pages/editor-pages/editor-position/index') }}
+//         >
+//           <View className="flex items-center font-normal">
+//             <View className="flex-1 font-normal">职位</View>
+//             <View className="text-gray-5 mr-8">{agent?.position}</View>
+//           </View>
+//         </View>
+//       </ListWrapper>
+//     </View>;
+//   }
+
+//   return (
+//     <View className="px-16 w-full pt-12">
+//       <ListWrapper>
+//         <Vie//         >
+//           <View className="flex items-center font-normal">
+//             <View className="flex-1 font-normal">企业</View>
+//             <View className="text-gray-5 truncate max-w-[188px]">
+//               {agent?.entName}
+//             </View>
+//           </View>
+//         </View>//           <View className="flex items-center font-normal">
+//             <View className="flex-1 font-normal">企业认证</View>
+//             <TagCertificated />
+//           </View>
+//         </View>
+//         <View
+//           arrow
+//           onClick={() => { navToUrl('/pages/editor-pages/editor-position/index') }}
+//         >
+//           <View className="flex items-center font-normal">
+//             <View className="flex-1 font-normal">职位</View>
+//             <View className="text-gray-5 mr-8">{agent?.position}</View>
+//           </View>
+//           {/* <PickerSingleColumn headerTitle="您的岗位" options={options} selected={selected} onPicked={handlePicked} showPicker={showPicker} setShowPicker={setShowPicker}>
+//               <View className="flex items-center font-normal" onClick={() => setShowPicker(true)}>
+//                 <View className="flex-1 font-normal">职位</View>
+//                 <View className="text-gray-5 mr-8">{agent?.position}</View>
+//               </View>
+//             </PickerSingleColumn> */}
+//         </View>
+//       </ListWrapper>
+//     </View>
+//   );
+// };
 
 export default function Index() {
   const router = useRouter();
-  const { agentId } = router.params;
-  const agent = useAgentStore((state) => state.agent);
+  const agentEdit = useAgentStore((state) => state.agentEdit)
+  const { updateEditAgent } = useAgentStoreActions()
+
+  const [disabled, setDisabled] = useState(false)
+  const handleSave = ()=>{
+
+  }
 
-  const navToUrl = (url: string) => {
-    Taro.navigateTo({ url });
+  const handleFieldChange = (field: string, value: string) => {
+    // 如果是手机号字段,只允许数字且限制11位
+    if (field === 'mobile') {
+      value = value.replace(/\D/g, '').slice(0, 11);
+    }
+    console.log(field, value)
+    updateEditAgent({ [field]: value });
   };
 
   return (
     <PageCustom>
       <NavBarNormal backText="数字名片"></NavBarNormal>
-      <View className="px-16 w-full pt-4">
-        <ListWrapper>
-          <ListRow
-            underline
-            arrow
-            rightRenderer={() => (
-              <View className="text-gray-5 truncate max-w-160">
-                {agent?.name}
-              </View>
-            )}
-            onClick={() =>
-              navToUrl(
-                `/pages/editor-pages/editor-name/index?agentId=${agentId}`
-              )
-            }
-          >
-            姓名
-          </ListRow>
-          <ListRow
-            rightRenderer={() => (
-              <View className="text-gray-5 truncate max-w-160">
-                {agent?.mobile}
-              </View>
-            )}
-            underline
-            arrow
-            onClick={() =>
-              navToUrl(
-                `/pages/editor-pages/editor-phone/index?agentId=${agentId}`
-              )
-            }
-          >
-            手机号码
-          </ListRow>
-          <ListRow
-            rightRenderer={() => (
-              <View className="text-gray-5 truncate max-w-160">
-                {agent?.email}
-              </View>
-            )}
-            underline
-            arrow
-            onClick={() =>
-              navToUrl(
-                `/pages/editor-pages/editor-email/index?agentId=${agentId}`
-              )
-            }
-          >
-            联系邮箱
-          </ListRow>
-          <ListRow
-            rightRenderer={() => (
-              <View className="text-gray-5 truncate max-w-160">
-                {agent?.address}
-              </View>
-            )}
-            underline
-            arrow
-            onClick={() =>
-              navToUrl(
-                `/pages/editor-pages/editor-address/index?agentId=${agentId}`
-              )
-            }
-          >
-            联系地址
-          </ListRow>
-          <ListRow
-            rightRenderer={() => {
-              return !!agent?.qrCodeUrl?.length ? (
-                <View className="text-gray-5 text-primary font-normal">已上传</View>
-              ) : (
-                <></>
-              );
-            }}
-            arrow
-            onClick={() => navToUrl("/pages/editor-pages/editor-qrcode/index")}
+      <View className="p-16 w-full pb-126">
+        <View className="flex flex-col gap-16 w-full">
+          <View>
+            <View className={style.label}>姓名 <Text className="text-red leading-22 text-14">*</Text> </View>
+            <View className={style.value}>
+              <WemetaInput
+                value={agentEdit?.name || ''}
+                onBlur={(e: any) => handleFieldChange('name', e.detail.value)}
+                onInput={(e: any) => handleFieldChange('name', e.detail.value)}
+                placeholderStyle="color: rgba(17,17,17,.25)"
+                placeholder="输入姓名"
+                maxlength={40}
+              />
+            </View>
+          </View>
+          <View>
+            <View className={style.label}>职位</View>
+            <View className={style.value}>
+              <WemetaInput
+                value={agentEdit?.position || ''}
+                onBlur={(e: any) => handleFieldChange('position', e.detail.value)}
+                onInput={(e: any) => handleFieldChange('position', e.detail.value)}
+                placeholderStyle="color: rgba(17,17,17,.25)"
+                placeholder="输入职位名称"
+              />
+            </View>
+          </View>
+
+          <View>
+            <View className={style.label}>企业</View>
+            <View className={style.value}>
+              <WemetaInput
+                value={agentEdit?.entName || ''}
+                onBlur={(e: any) => handleFieldChange('entName', e.detail.value)}
+                onInput={(e: any) => handleFieldChange('entName', e.detail.value)}
+                placeholderStyle="color: rgba(17,17,17,.25)"
+                placeholder="输入企业名称"
+              />
+            </View>
+          </View>
+          <View>
+            <View className={style.label}>手机号</View>
+            <View className={style.value}>
+              <WemetaInput
+                value={agentEdit?.mobile || ''}
+                onBlur={(e: any) => handleFieldChange('mobile', e.detail.value)}
+                onInput={(e: any) => handleFieldChange('mobile', e.detail.value)}
+                placeholderStyle="color: rgba(17,17,17,.25)"
+                placeholder="手机号"
+              />
+            </View>
+          </View>
+          <View>
+            <View className={style.label}>联系邮箱</View>
+            <View className={style.value}>
+              <WemetaInput
+                value={agentEdit?.email || ''}
+                onBlur={(e: any) => handleFieldChange('email', e.detail.value)}
+                onInput={(e: any) => handleFieldChange('email', e.detail.value)}
+                placeholderStyle="color: rgba(17,17,17,.25)"
+                placeholder="联系邮箱"
+              />
+            </View>
+          </View>
+          <View>
+
+            <View className={style.label}>地址</View>
+            <View className={style.value}>
+              <WemetaInput
+                value={agentEdit?.address || ''}
+                onBlur={(e: any) => handleFieldChange('address', e.detail.value)}
+                onInput={(e: any) => handleFieldChange('address', e.detail.value)}
+                placeholderStyle="color: rgba(17,17,17,.25)"
+                placeholder="地址"
+              />
+            </View>
+          </View>
+          <View
           >
-            我的二维码
-          </ListRow>
-        </ListWrapper>
+            <View className={style.label}>二维码</View>
+          </View>
+        </View>
       </View>
 
       {/* {RenderEntCard(agent, navToUrl)} */}
+      <BottomBar>
+        <WemetaButton disabled={disabled} className="flex-1" onClick={handleSave}>保存</WemetaButton>
+      </BottomBar>
     </PageCustom>
   );
 }