增刪改查顯算傳,七字箴言搭建To B系統(tǒng)底層框架

0 評(píng)論 9976 瀏覽 147 收藏 20 分鐘

編輯導(dǎo)讀:入職培訓(xùn)時(shí)技術(shù)leader說(shuō):“我不需要你們太聰明,做好基礎(chǔ)的增刪改查就可以了?!笨此坪芎?jiǎn)單的活,要做好并不容易?;A(chǔ)的坑在哪里呢?一起來(lái)看一下。

一、 增(新增、創(chuàng)建、導(dǎo)入)

1. 明確表字段類(lèi)型

新增的業(yè)務(wù)是由不同類(lèi)型的字段組合而成,每個(gè)字段具體的類(lèi)型應(yīng)該給出明確定義,這關(guān)系到數(shù)據(jù)庫(kù)字段存取的設(shè)計(jì)、后臺(tái)邏輯的編寫(xiě)以及前端頁(yè)面的數(shù)據(jù)輸入方式以及展示形式。

常用表字段:

  • 文本(中文文本、英文文本等,可統(tǒng)一定義為字符串)
  • 數(shù)字(整數(shù)、小數(shù)、正負(fù)數(shù)、阿拉伯?dāng)?shù)字、中文數(shù)字、羅馬數(shù)字等)
  • 時(shí)間、日期(yyyy-MM、yyyy-MM-DD、yyyy-MM-DD hh:mm:ss、hh:mm:ss、hh:00等)
  • 字典表(一般用于定義業(yè)務(wù)狀態(tài),如結(jié)算狀態(tài)字典可定義“待結(jié)算”、“已結(jié)算”)

表字段信息說(shuō)明:

  • 字段必填、非必填;強(qiáng)業(yè)務(wù)關(guān)聯(lián)的數(shù)據(jù)或者其他必要信息設(shè)為必填字段;
  • 字段唯一性;唯一的字段組合設(shè)置為表結(jié)構(gòu)的主鍵;
  • 字段長(zhǎng)度;表字段長(zhǎng)度的限制,主要是為了合理分配客戶(hù)端的內(nèi)存資源;
  • 字段的默認(rèn)值;對(duì)于固定確認(rèn)的數(shù)據(jù),可設(shè)置默認(rèn)值,減少操作員的數(shù)據(jù)錄入工作量;
  • 字段校驗(yàn);例如手機(jī)號(hào)、身份證號(hào)碼、銀行卡格式標(biāo)注校驗(yàn),可根據(jù)業(yè)務(wù)情況說(shuō)明校驗(yàn)規(guī)則;
  • 選項(xiàng)型,說(shuō)明單選、多選;
  • 專(zhuān)有名詞解釋說(shuō)明,業(yè)務(wù)場(chǎng)景描述,協(xié)助開(kāi)發(fā)人員理解文檔。

輸出結(jié)果如圖一、圖二:

圖一:產(chǎn)品經(jīng)理設(shè)定的表字段

圖二:DB建表的結(jié)果

小結(jié):

有的項(xiàng)目組可能會(huì)要求產(chǎn)品經(jīng)理進(jìn)行初級(jí)的表結(jié)構(gòu)設(shè)計(jì),即以上說(shuō)明的內(nèi)容,專(zhuān)業(yè)部分的內(nèi)容由DB進(jìn)行設(shè)計(jì)完善。這樣做有利于產(chǎn)品經(jīng)理明確字段的含義,理解表字段的存取路徑,設(shè)計(jì)邏輯,能更深程度的參與到項(xiàng)目開(kāi)發(fā)與溝通協(xié)調(diào)中。

2. 準(zhǔn)確使用信息輸入的方式

表字段的類(lèi)型不同,信息的輸入方式對(duì)應(yīng)會(huì)有差別(如圖三)。若前端頁(yè)面運(yùn)用錯(cuò)誤的輸入樣式,則會(huì)導(dǎo)致新增報(bào)錯(cuò),業(yè)務(wù)流程無(wú)法繼續(xù)。

例如應(yīng)該是下拉選擇的字典值,運(yùn)用了手動(dòng)填寫(xiě)的文本框,必然會(huì)出現(xiàn)人為填寫(xiě)錯(cuò)誤,與數(shù)據(jù)庫(kù)字典表無(wú)法匹配的bug。

圖三:文本、數(shù)字、時(shí)間和字典對(duì)應(yīng)不同的輸入樣式

3. 設(shè)置合理的圖片限制

新增業(yè)務(wù)中,上傳圖片是很常見(jiàn)的需求??紤]到圖片的上傳、加載速度,兼容問(wèn)題,需要對(duì)圖片的大小、格式進(jìn)行限制說(shuō)明。

常規(guī)的圖片格式包括:jpg、png、gif、bmp、gif,大小限制在500k~2M范圍內(nèi)。

如圖四:

圖四:微信公眾號(hào)頭像修改頁(yè)面

4. 設(shè)置及時(shí)完善的錯(cuò)誤信息提示

用戶(hù)輸入的過(guò)程中,需要對(duì)填寫(xiě)的信息有及時(shí)全面的反饋,例如必填字段漏填、有格式校驗(yàn)的數(shù)據(jù)填寫(xiě)錯(cuò)誤等,如圖五:

圖五:錯(cuò)誤信息提示

5. 提高長(zhǎng)表單的處理效率

  • 對(duì)于較長(zhǎng)的表單,流程分步操作,減輕用戶(hù)的認(rèn)知負(fù)荷和心理壓力;
  • 對(duì)于相關(guān)的信息進(jìn)行合理分組展示,高效填寫(xiě);
  • 采取高效填寫(xiě)的方式,避免出錯(cuò);例如銀行卡掃碼、拍照識(shí)別;小結(jié):新增是業(yè)務(wù)開(kāi)始的第一個(gè)環(huán)節(jié),數(shù)據(jù)進(jìn)入系統(tǒng)的源頭。若新增不順暢或者總是報(bào)錯(cuò),會(huì)導(dǎo)致業(yè)務(wù)流程頂部斷層無(wú)法繼續(xù)、用戶(hù)體驗(yàn)感極差,甚至有可能會(huì)導(dǎo)致項(xiàng)目驗(yàn)收失敗。

二、刪除(刪除、取消、禁用、停用)

數(shù)據(jù)有新增的路徑,就會(huì)存在刪除的需求。

通常說(shuō)的刪除,包含兩種:

  1. 物理刪除:真實(shí)刪除,從數(shù)據(jù)庫(kù)層面刪除了數(shù)據(jù),查詢(xún)找不到該條數(shù)據(jù),數(shù)據(jù)不可恢復(fù);一般對(duì)于重要的基礎(chǔ)數(shù)據(jù),不建議設(shè)置刪除功能,設(shè)計(jì)中要避免不可逆的操作;
  2. 邏輯刪除:假刪除,只是從頁(yè)面對(duì)數(shù)據(jù)進(jìn)行了刪除,數(shù)據(jù)庫(kù)將數(shù)據(jù)的狀態(tài)改寫(xiě)為“已刪除”,可通過(guò)刪除后撤回或者數(shù)據(jù)庫(kù)備份恢復(fù),產(chǎn)品設(shè)計(jì)中比較常用。

數(shù)據(jù)的前后業(yè)務(wù)關(guān)聯(lián)太強(qiáng),不適合設(shè)計(jì)刪除功能,那應(yīng)該如何對(duì)數(shù)據(jù)進(jìn)行合理的處理呢?

個(gè)人理解的刪除需求的存在,可能存在以下幾種情況:

  1. 過(guò)期無(wú)用信息:可以設(shè)計(jì)數(shù)據(jù)庫(kù)定時(shí)任務(wù),根據(jù)實(shí)際的業(yè)務(wù)情況和指定條件,定期清理垃圾數(shù)據(jù),適用于數(shù)據(jù)量較大的情況;
  2. 信息錄入錯(cuò)誤:邏輯刪除或者使用編輯功能修改數(shù)據(jù);
  3. 數(shù)據(jù)狀態(tài)改變,或需要中止業(yè)務(wù):使用字典狀態(tài)來(lái)限制。

最后一種情況,筆者做的TMS物流運(yùn)輸系統(tǒng)中,客戶(hù)曾提出過(guò)這樣的需求:車(chē)輛出現(xiàn)故障或者正常維修停運(yùn),而業(yè)務(wù)人員在創(chuàng)建訂單的時(shí)候,可能還是會(huì)選到這輛車(chē)。對(duì)于這種車(chē),我們要在系統(tǒng)中進(jìn)行刪除,以免誤選(典型的偽需求)。

經(jīng)過(guò)實(shí)際的業(yè)務(wù)分析,發(fā)現(xiàn)直接刪除車(chē)輛信息會(huì)有幾個(gè)問(wèn)題:

  1. 車(chē)輛維修保養(yǎng)結(jié)束后,需要操作員再次填寫(xiě)車(chē)輛信息,用戶(hù)體驗(yàn)差且浪費(fèi)人力資源;
  2. 車(chē)輛的維修保養(yǎng)比較常見(jiàn),若操作員未及時(shí)補(bǔ)錄恢復(fù)運(yùn)營(yíng)的車(chē)輛,會(huì)對(duì)運(yùn)輸業(yè)務(wù)產(chǎn)生影響;
  3. 車(chē)輛的運(yùn)輸里程涉及到財(cái)務(wù)的結(jié)算支付,若刪除會(huì)需要寫(xiě)大段的邏輯代碼來(lái)判斷車(chē)輛關(guān)聯(lián)的業(yè)務(wù)情況,以及財(cái)務(wù)結(jié)算狀態(tài),開(kāi)發(fā)工作量大。

最終處理結(jié)果:

設(shè)計(jì)車(chē)輛停用功能,保存車(chē)輛的基本信息,維修結(jié)束后恢復(fù)運(yùn)營(yíng)狀態(tài);停用期間數(shù)據(jù)封裝,不影響還未結(jié)算完的財(cái)務(wù)數(shù)據(jù)。

類(lèi)似的數(shù)據(jù)需要暫停業(yè)務(wù),后期可能需要恢復(fù)的,可以采取【刪除后撤銷(xiāo)】、【停用】、【禁用】等假刪除形式進(jìn)行處理。

小結(jié):

根據(jù)業(yè)務(wù)狀況確認(rèn)信息是否允許刪除;允許刪除的數(shù)據(jù),需要進(jìn)行二次確認(rèn)提示,降低誤刪的可能性。

三、改(修改、編輯、批量修改)

新增的數(shù)據(jù)維護(hù)錯(cuò)誤或者業(yè)務(wù)發(fā)生變動(dòng),可能會(huì)需要修改。

1. 修改的形式

點(diǎn)擊列表按鈕,進(jìn)入二級(jí)頁(yè)面/彈窗修改。

在列表單元格內(nèi)直接編輯修改。

列表內(nèi)嵌子表格編輯修改,不常用,適用于需要小面積修改的信息。

大范圍的數(shù)據(jù)變動(dòng),導(dǎo)入表格批量修改。

數(shù)據(jù)出錯(cuò),頁(yè)面無(wú)法修改,進(jìn)入數(shù)據(jù)庫(kù)直接修改數(shù)據(jù)(很少見(jiàn),且不建議)。

2. 修改注意事項(xiàng)

  • 頁(yè)面明確區(qū)分允許可編輯和不可編輯的內(nèi)容;
  • 構(gòu)成數(shù)據(jù)唯一性的字段不允許修改;
  • 完成認(rèn)證閉環(huán)的數(shù)據(jù)不允許修改;例如強(qiáng)制實(shí)名認(rèn)證的信息完成后不允許修改;
  • 修改保存后,二次彈窗確認(rèn);
  • 長(zhǎng)表單分步驟錄入的信息,選擇單獨(dú)模塊編輯修改;
  • 長(zhǎng)表單信息修改設(shè)定本地緩存機(jī)制,避免網(wǎng)絡(luò)中斷等原因需重新編輯上傳數(shù)據(jù);
  • 強(qiáng)業(yè)務(wù)關(guān)聯(lián)的數(shù)據(jù),需要確認(rèn)修改后是否對(duì)其他模塊列表數(shù)據(jù)關(guān)聯(lián)變更;
  • 敏感數(shù)據(jù)提供修改日志;
  • 不同用戶(hù)的修改權(quán)限設(shè)定。

3. 批量修改

  • 批量修改應(yīng)定義數(shù)據(jù)唯一性的標(biāo)記;例如批量修改員工信息,可能存在姓名相同的情況如果只判斷導(dǎo)入的修改模板,只要姓名相同而其他數(shù)據(jù)不同,則修改數(shù)據(jù),會(huì)導(dǎo)致修改失敗或者其他后果;
  • 批量修改導(dǎo)入了重復(fù)數(shù)據(jù),應(yīng)明確是直接覆蓋源數(shù)據(jù)后導(dǎo)入,或提示修改模板后重新導(dǎo)入,或直接跳過(guò)重復(fù)數(shù)據(jù)。

四、查(查詢(xún)、搜索)

合理的查詢(xún)條件和樣式的設(shè)計(jì),有助于用戶(hù)快速準(zhǔn)確的找到需要的信息。

常用的查詢(xún)方式有:

1. 同步查詢(xún)、組合條件查詢(xún)

設(shè)置默認(rèn)查詢(xún)條件,常用有默認(rèn)查詢(xún)?nèi)掌?、默認(rèn)狀態(tài)查詢(xún),有助于用戶(hù)快速獲取需要的信息。

2. 精準(zhǔn)查詢(xún) or 模糊匹配;

精準(zhǔn)查詢(xún)適用于字段簡(jiǎn)短準(zhǔn)確的數(shù)據(jù),用戶(hù)記憶成本高于模糊匹配,而后者是查詢(xún)中比常用的形式。

例如根據(jù)身份證號(hào)碼查詢(xún)用戶(hù)信息,只需要輸入1991,則查詢(xún)出列表中所有包含1991的身份證數(shù)據(jù),可能查詢(xún)出來(lái)的結(jié)果為:4280861996054212或者4758261991024483。

按狀態(tài)值快速過(guò)濾,業(yè)務(wù)流程類(lèi)比較常用。

自定義設(shè)置查詢(xún)條件;展示高頻查詢(xún)條件,低頻查詢(xún)條件按鈕收起隱藏,且允許自定義設(shè)置查詢(xún)字段。

提供查詢(xún)歷史記錄,有必要的情況下可根據(jù)歷史查詢(xún)?cè)~條的熱度進(jìn)行排序。

3. 定時(shí)器任務(wù)查詢(xún)

比較專(zhuān)業(yè)的范疇,請(qǐng)教了一下開(kāi)發(fā)同學(xué), 我們一般說(shuō)定時(shí)器是指,按照某個(gè)特定的時(shí)間間隔執(zhí)行某一段命令(無(wú)法深入說(shuō)明了,抱歉);

筆者項(xiàng)目中目前只運(yùn)用過(guò)定時(shí)器請(qǐng)求銀行流水,查詢(xún)余額,有機(jī)會(huì)可以寫(xiě)一下。

4. 查全局 or 查局部 ?

考慮到數(shù)據(jù)的安全性問(wèn)題,可能有些產(chǎn)品設(shè)計(jì)上會(huì)限制查詢(xún)的界限,限制查詢(xún)出的結(jié)果只展示部分?jǐn)?shù)據(jù)。

例如設(shè)置某些用戶(hù)只能查詢(xún)特定條件下的數(shù)據(jù),獲取過(guò)濾后的數(shù)據(jù)量。

五、顯(顯示、回傳、列表樣式)

后臺(tái)系統(tǒng)的數(shù)據(jù)和業(yè)務(wù)流程,90%以表格的形式展示出來(lái),顯示樣式是否合理,直接關(guān)系到用戶(hù)對(duì)產(chǎn)品的第一印象和日常使用體驗(yàn)。

網(wǎng)上已經(jīng)有很多優(yōu)秀的文章專(zhuān)門(mén)講解后臺(tái)表格設(shè)計(jì)的樣式及使用場(chǎng)景,這里只簡(jiǎn)要說(shuō)明一下。

列表按照功能區(qū)域,可劃分為篩選區(qū)、操作區(qū)、表頭、正文、分頁(yè)。

【篩選區(qū)】主要用于設(shè)置數(shù)據(jù)的篩選條件,進(jìn)行搜索;已經(jīng)詳細(xì)說(shuō)明過(guò)查詢(xún),不再贅述?!静僮鲄^(qū)】主要用于對(duì)數(shù)據(jù)進(jìn)行功能性的操作,常見(jiàn)的有增刪改查、業(yè)務(wù)功能等。

  • 操作按鈕較多,建議按照業(yè)務(wù)的流程排布,避免用戶(hù)需要不停調(diào)轉(zhuǎn)視線尋找按鈕;
  • 相同的功能劃分合理,收起在一個(gè)菜單按鈕中,避免功能太多,用戶(hù)要在界面尋找按鈕的情況。
  • 例如【設(shè)置服務(wù)費(fèi)率】和【查看服務(wù)費(fèi)率】屬于同一個(gè)功能區(qū)域,可以設(shè)計(jì)成下拉展開(kāi)的形式;
  • B端系統(tǒng)的設(shè)計(jì),要有堆積木的概念,功能與功能之間,最好是獨(dú)立的,不互相牽扯;一個(gè)按鈕代表一個(gè)功能操作。

【表頭】概括表格要展示的字段信息以及排序、自定義展示字段。

有必要的情況下,可以添加浮窗文本對(duì)字段進(jìn)行解釋?zhuān)瑓f(xié)助用戶(hù)理解字段含義。

數(shù)據(jù)列比較長(zhǎng)的情況下,凍結(jié)表頭,方便內(nèi)容對(duì)應(yīng)字段。

信息層級(jí)區(qū)分,同類(lèi)型的數(shù)據(jù)表頭合并單元格。

【正文】展示具體的數(shù)據(jù)內(nèi)容;正文內(nèi)容的注意要點(diǎn)有:

數(shù)字,一般展示小數(shù)點(diǎn)后兩位,右對(duì)齊展示,減輕用戶(hù)計(jì)算的壓力,可以根據(jù)數(shù)字串的長(zhǎng)度很直觀的辨別數(shù)字的大小;特別是貨幣類(lèi)數(shù)字的展示。

對(duì)齊,可比較的字符串右對(duì)齊,固定長(zhǎng)度的字符串居中對(duì)齊,其他文本類(lèi)型字符串可選擇對(duì)齊。

時(shí)間格式,補(bǔ)充數(shù)字“0”讓文本對(duì)齊。

空白,沒(méi)有數(shù)據(jù)的單元格用“—”符號(hào)占位,保持視覺(jué)的統(tǒng)一性。

分割,常見(jiàn)表格式分割、橫向分割(專(zhuān)注行數(shù)據(jù))、縱向分割(專(zhuān)注列數(shù)據(jù))、無(wú)線條分割(數(shù)據(jù)量少,干擾信息少,信息頁(yè)面簡(jiǎn)潔)、斑馬線展示(方便用戶(hù)定位當(dāng)前查看的數(shù)據(jù)行);大家可以對(duì)比不同分割樣式在視覺(jué)上的引導(dǎo)作用。

信息層級(jí),常見(jiàn)的有任務(wù)分級(jí)或權(quán)限分配類(lèi)采用樹(shù)狀結(jié)構(gòu)進(jìn)行信息層級(jí)的劃分。

列表中的數(shù)據(jù)是對(duì)增刪改等操作之后的回傳結(jié)果,如果前端接口對(duì)錯(cuò)或者字典取錯(cuò),很容易導(dǎo)致頁(yè)面或者單元格數(shù)據(jù)為空,更有可能會(huì)出現(xiàn)奇形怪狀的數(shù)據(jù)。

在項(xiàng)目驗(yàn)收的時(shí)候,一定多多留意列表的回顯字段,常用F12協(xié)助測(cè)試及開(kāi)發(fā)人員排查bug原因。

小結(jié):

個(gè)人認(rèn)為excel玩的溜的,表格設(shè)計(jì)基本妥了。特別是可視化數(shù)據(jù)展示,excel的各種精美模板可是唾手可得的優(yōu)秀學(xué)習(xí)素材。

【分頁(yè)】分頁(yè)的樣式很多,功能總結(jié)為:

  • 列表的總數(shù)量;
  • 每個(gè)頁(yè)面展示的數(shù)量條數(shù);
  • 當(dāng)前所處頁(yè)面;
  • 進(jìn)入上一頁(yè)下一頁(yè)首頁(yè)末頁(yè);
  • 直接跳轉(zhuǎn)到指定頁(yè)面。

結(jié)語(yǔ):

標(biāo)題定的增刪改查顯算傳,實(shí)際上算法和傳輸,都屬于比較專(zhuān)業(yè)的范疇,希望以后有機(jī)會(huì)能深入接觸,補(bǔ)上這個(gè)坑。畢竟現(xiàn)在也是產(chǎn)業(yè)互聯(lián)網(wǎng)化、數(shù)字化的時(shí)代,學(xué)些數(shù)據(jù)算法、傳輸技術(shù)總沒(méi)錯(cuò)。

 

本文由 @RaRa 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來(lái)自 Unsplash,基于CC0協(xié)議

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 目前還沒(méi)評(píng)論,等你發(fā)揮!