edit.vue 44 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877
  1. <template>
  2. <view>
  3. <view class="add_page">
  4. <u-navbar class="nav-bar" title="商品入库" :autoBack="true" :placeholder="true" v-hideNav>
  5. <view class="u-nav-slot" slot="right">
  6. <u-checkbox-group v-model="continuousWarehousing" placement="column">
  7. <u-checkbox label="连续入库" name="1"></u-checkbox>
  8. </u-checkbox-group>
  9. </view>
  10. </u-navbar>
  11. <view class="form_list">
  12. <u--form labelPosition="top" :model="formData" :rules="rules" ref="addForm" labelWidth="auto">
  13. <u-form-item borderBottom class="u-form-item-col">
  14. <u--textarea v-model="recognitionContent" placeholder='品牌:-
  15. 来源:-
  16. 实价:-
  17. 型号:-
  18. 编码:-
  19. 日期:-
  20. 备注:-
  21. 付款方式:-' confirmType="done" height="170" :maxlength="-1">
  22. </u--textarea>
  23. <view class="btn_group_recognition">
  24. <u-button text="清除" @click="clearRecognitionContent()"></u-button>
  25. <u-button text="粘贴识别" type="primary"
  26. @click="handlePasteRecognition(recognitionContent)"></u-button>
  27. </view>
  28. </u-form-item>
  29. <u-form-item :label="'商品图片(' + (formData.goodPicFileList.length || 0) + '张)'" required prop="goodPicFileList" borderBottom>
  30. <view class="imgs_scroll">
  31. <ImgsRowScroll v-if="formData.goodPicFileList.length > 0" :isShowDeleteIcon="true"
  32. @deleteImgInfo="getDeleteGoodPicInfo" imgMode="aspectFill" :totalWidth="400"
  33. :images="formData.goodPicFileList" :previewEnabled="true" :imageWidth="150"
  34. :imageHeight="150"></ImgsRowScroll>
  35. <u-upload @afterRead="afterReadGoodPic" name="3" multiple :maxCount="9"
  36. :previewFullImage="true"></u-upload>
  37. </view>
  38. </u-form-item>
  39. <u-form-item label="商品描述(详细的描述让用户更好的了解您的产品)" required prop="desc" borderBottom>
  40. <u--textarea v-model="formData.desc" clearable placeholder="95新 WHZ19219H CHANEL香奈儿链条单肩包
  41. 21开 牛皮 尺寸25 4 15
  42. 配件中溯卡" count autoHeight maxlength="250" :height="150" confirmType="done"></u--textarea>
  43. </u-form-item>
  44. <u-form-item label="来源" prop="origin" borderBottom>
  45. <u--textarea v-model="formData.origin" clearable placeholder="请输入来源" count autoHeight maxlength="250" height="100" confirmType="done"></u--textarea>
  46. </u-form-item>
  47. <u-form-item label="商品分类" required prop="type" borderBottom>
  48. <TabSelect :tabList="typeList" :isClear="typeIsClear" @tabChange="handleTabChangeType"
  49. labelKey="dictLabel" valueKey="dictValue" :colNum="4" mode="single" :echoInfo="echoInfoType">
  50. </TabSelect>
  51. </u-form-item>
  52. <u-form-item label="品牌" required prop="dictLabel" class="u-form-item-row" borderBottom
  53. @click="showBrandList">
  54. <Cell :val="formData.dictLabel"></Cell>
  55. <BrandList ref="brandListRef" @selectedBrand="handleSelectedBrand"></BrandList>
  56. </u-form-item>
  57. <u-form-item label="系列" class="u-form-item-row" borderBottom>
  58. <u--input v-model="formData.series" placeholder="请输入" clearable border="none"></u--input>
  59. </u-form-item>
  60. <u-form-item label="型号" required prop="model" class="u-form-item-row" borderBottom>
  61. <u--input v-model="formData.model" placeholder="请输入" clearable border="none"></u--input>
  62. </u-form-item>
  63. <u-form-item label="机芯类型" class="u-form-item-row" borderBottom>
  64. <u--input v-model="formData.dialType" placeholder="请输入" clearable border="none"></u--input>
  65. </u-form-item>
  66. <u-form-item label="表壳材质" class="u-form-item-row" borderBottom>
  67. <u--input v-model="formData.caseMaterial" placeholder="请输入" clearable border="none"></u--input>
  68. </u-form-item>
  69. <u-form-item label="表盘直径" class="u-form-item-row" borderBottom>
  70. <u--input v-model="formData.dialDiameter" placeholder="请输入" clearable border="none"></u--input>
  71. </u-form-item>
  72. <u-form-item label="材质" class="u-form-item-row" borderBottom>
  73. <u--input v-model="formData.material" placeholder="请输入" clearable border="none"></u--input>
  74. </u-form-item>
  75. <u-form-item label="尺寸" class="u-form-item-row" borderBottom>
  76. <u--input v-model="formData.size" placeholder="请输入" clearable border="none"></u--input>
  77. </u-form-item>
  78. <u-form-item label="尺码" class="u-form-item-row" borderBottom>
  79. <u--input v-model="formData.yardage" placeholder="请输入" clearable border="none"></u--input>
  80. </u-form-item>
  81. <u-form-item label="商品成色" required prop="productCondition" borderBottom>
  82. <TabSelect :tabList="productConditionList" :isClear="productConditionIsClear"
  83. @tabChange="handleTabChangeProductCondition" :colNum="2" mode="single" :echoInfo="echoInfoProductCondition">
  84. </TabSelect>
  85. </u-form-item>
  86. <u-form-item :label="'细节图(' + (formData.detailPicFileList.length || 0) + '张)'" borderBottom>
  87. <!-- <view class="detail_pic_container"> -->
  88. <!-- <view>
  89. <text class="tip">视频:</text>
  90. <ImgsRowScroll v-if="formData.detailVideoFileList.length > 0" :isShowDeleteIcon="true"
  91. @deleteVideoInfo="getDeleteDetailVideoInfo" imgMode="aspectFill" :totalWidth="400"
  92. :videos="formData.detailVideoFileList" :previewEnabled="true" :imageWidth="150"
  93. :imageHeight="150" accept="video"></ImgsRowScroll>
  94. <u-upload @afterRead="afterReadDeatilVideo" name="2" multiple :maxCount="10" accept="video"></u-upload>
  95. </view> -->
  96. <!-- <view> -->
  97. <!-- <text class="tip">图片:</text> -->
  98. <view class="imgs_scroll">
  99. <ImgsRowScroll v-if="formData.detailPicFileList.length > 0" :isShowDeleteIcon="true"
  100. @deleteImgInfo="getDeleteDetailPicInfo" imgMode="aspectFill" :totalWidth="400"
  101. :images="formData.detailPicFileList" :previewEnabled="true" :imageWidth="150"
  102. :imageHeight="150"></ImgsRowScroll>
  103. <u-upload @afterRead="afterReadDetailPic" name="1" multiple :maxCount="10"></u-upload>
  104. </view>
  105. <!-- </view> -->
  106. <!-- </view> -->
  107. </u-form-item>
  108. <u-form-item label="商品标题" borderBottom>
  109. <u--textarea v-model="formData.title" clearable :placeholder="titlePlaceholder" count autoHeight
  110. maxlength="50" height="100" confirmType="done"></u--textarea>
  111. </u-form-item>
  112. <u-form-item label="商品货号" class="u-form-item-row" borderBottom>
  113. <u--input v-model="formData.productNo" placeholder="请输入" clearable border="none"></u--input>
  114. </u-form-item>
  115. <u-form-item label="商品属性" required prop="productAttribute" borderBottom>
  116. <TabSelect :tabList="productAttributeList" :colNum="4" mode="single"
  117. :isClear="productAttributeIsClear" @tabChange="handleTabChangeProductAttribute"
  118. :echoInfo="echoInfoProductAttribute">
  119. </TabSelect>
  120. </u-form-item>
  121. <u-form-item label="库存数量" required prop="stock" class="u-form-item-row" borderBottom>
  122. <u--input v-model="formData.stock" placeholder="请输入" clearable border="none"
  123. type="number"></u--input>
  124. </u-form-item>
  125. <u-form-item label="官方指导价" required prop="price" class="u-form-item-row" borderBottom>
  126. <u--input v-model="formData.price" placeholder="请输入" clearable border="none"></u--input>
  127. </u-form-item>
  128. <u-form-item label="总成本价" class="u-form-item-row" borderBottom v-if="isWareHouser">
  129. <u--input v-model="formData.costPrice" placeholder="请输入" clearable border="none"></u--input>
  130. </u-form-item>
  131. <u-form-item label="同行价格" class="u-form-item-row" borderBottom v-if="isWareHouser">
  132. <u--input v-model="formData.peerPrice" placeholder="请输入" clearable border="none"></u--input>
  133. </u-form-item>
  134. <u-form-item label="实价" class="u-form-item-row" borderBottom>
  135. <u--input v-model="formData.actualPrice" placeholder="请输入" clearable border="none" type="number" @blur="handleBlurActualPrice"></u--input>
  136. </u-form-item>
  137. <u-form-item label="代理价格" class="u-form-item-row" borderBottom>
  138. <u--input v-model="formData.agentPrice" placeholder="请输入" clearable border="none"></u--input>
  139. </u-form-item>
  140. <u-form-item label="销售价格" class="u-form-item-row" borderBottom v-if="isWareHouser">
  141. <u--input v-model="formData.salePrice" placeholder="请输入" clearable border="none"></u--input>
  142. </u-form-item>
  143. <u-form-item label="商品位置" class="u-form-item-row" borderBottom>
  144. <u--input v-model="formData.productPosition" placeholder="请输入" clearable
  145. border="none"></u--input>
  146. </u-form-item>
  147. <u-form-item label="手表年份" class="u-form-item-row" borderBottom>
  148. <u--input v-model="formData.watchYear" placeholder="请输入" clearable border="none"></u--input>
  149. </u-form-item>
  150. <u-form-item label="鉴定人员" class="u-form-item-row" borderBottom @click="identifyingPersonClick">
  151. <Cell :val="formData.identifyingPerson" :isDelete="true"
  152. @handleClear="clear('identifyingPerson')"></Cell>
  153. <PersonPicker ref="identifyingPersonPickerRef" title="请选择鉴定人员"
  154. @selectPerson="handleSelectIdentifyingPerson"></PersonPicker>
  155. </u-form-item>
  156. <u-form-item label="是否入库" borderBottom required prop="stockStatus">
  157. <TabSelect :tabList="stockStatusList" :colNum="2" mode="single" :isClear="stockStatusIsClear" :echoInfo="echoInfoStockStatus"
  158. @tabChange="handleTabChangeStockStatus"></TabSelect>
  159. </u-form-item>
  160. <u-form-item label="回收类型" borderBottom>
  161. <TabSelect :tabList="recycleTypeList" :colNum="4" mode="single" :isClear="recycleTypeIsClear" :echoInfo="echoInfoRecycleType"
  162. @tabChange="handleTabChangeRecycleType">
  163. </TabSelect>
  164. </u-form-item>
  165. <u-form-item label="回收情况" borderBottom>
  166. <TabSelect :tabList="recycleSituationList" :colNum="5" mode="single" :isClear="recycleSituationIsClear" :echoInfo="echoInfoRecycleSituation"
  167. @tabChange="handleTabChangeRecycleSituation">
  168. </TabSelect>
  169. </u-form-item>
  170. <u-form-item label="标签" borderBottom>
  171. <TabSelect :tabList="labelList" :colNum="5" mode="single" :isClear="labelIsClear" :echoInfo="echoInfoLabel"
  172. @tabChange="handleTabChangeLabel">
  173. </TabSelect>
  174. </u-form-item>
  175. <u-form-item label="回收人员" class="u-form-item-row" borderBottom @click="recyclePersonClick">
  176. <!-- <u--input v-model="formData.recyclePerson" disabledColor="#fff" disabled clearable
  177. border="none"></u--input> -->
  178. <Cell :val="formData.recyclePerson" :isDelete="true" @handleClear="clear('recyclePerson')">
  179. </Cell>
  180. <PersonPicker ref="recyclePersonPickerRef" title="请选择回收人员"
  181. @selectPerson="handleSelectRecyclePerson"></PersonPicker>
  182. </u-form-item>
  183. <u-form-item :label="'回收留底图(' + (formData.recycleBottomFileList.length || 0) + '张)'" borderBottom>
  184. <view class="recycle_bottom_desc">
  185. <u--textarea v-model="formData.recycleBottomDesc" clearable count autoHeight maxlength="250"
  186. height="100" confirmType="done"></u--textarea>
  187. <view class="imgs_scroll">
  188. <ImgsRowScroll v-if="formData.recycleBottomFileList.length > 0" :isShowDeleteIcon="true"
  189. @deleteImgInfo="getDeleteRecycleBottomPicInfo" imgMode="aspectFill"
  190. :totalWidth="400" :images="formData.recycleBottomFileList" :previewEnabled="true"
  191. :imageWidth="150" :imageHeight="150"></ImgsRowScroll>
  192. <u-upload @afterRead="afterReadRecycleBottom" name="1" multiple :maxCount="1"
  193. accept="image"></u-upload>
  194. </view>
  195. </view>
  196. </u-form-item>
  197. <u-form-item label="回收时间" required prop="recycleTime" class="u-form-item-row" borderBottom
  198. @click="clickRecycleTimeRow">
  199. <Cell :val="formData.recycleTime"></Cell>
  200. <u-datetime-picker @confirm="confirmRecycleTime" @close="closeRecycleTimePicker"
  201. @cancel="closeRecycleTimePicker" :show="recycleTimeShow" v-model="formData.recycleTime"
  202. mode="date"></u-datetime-picker>
  203. </u-form-item>
  204. <u-form-item label="独立编码" class="u-form-item-row" borderBottom>
  205. <u--input v-model="formData.indentifyCode" placeholder="请输入" clearable border="none"></u--input>
  206. </u-form-item>
  207. <u-form-item label="适用人群" class="u-form-item-row" borderBottom>
  208. <u-radio-group v-model="formData.targetAudience" placement="row">
  209. <u-radio activeColor="#3c9cff" name="general" label="通用"></u-radio>
  210. <u-radio activeColor="#3c9cff" name="man" label="男"></u-radio>
  211. <u-radio activeColor="#3c9cff" name="woman" label="女"></u-radio>
  212. </u-radio-group>
  213. </u-form-item>
  214. <u-form-item label="商品保卡" class="u-form-item-row" borderBottom>
  215. <u-radio-group v-model="formData.productCard" placement="row">
  216. <u-radio activeColor="#3c9cff" name="has" label="有保卡"></u-radio>
  217. <u-radio activeColor="#3c9cff" name="no" label="无保卡"></u-radio>
  218. </u-radio-group>
  219. </u-form-item>
  220. <u-form-item label="保卡年份" class="u-form-item-row" borderBottom
  221. v-if="formData.productCard === 'has'">
  222. <u--input v-model="formData.cardYear" placeholder="不填写默认空白保卡" clearable
  223. border="none"></u--input>
  224. </u-form-item>
  225. <u-form-item :label="'保卡图片或独立编码照片留底(' + (formData.productCardPicFileList.length || 0) + '张)'" borderBottom>
  226. <view class="imgs_scroll">
  227. <ImgsRowScroll v-if="formData.productCardPicFileList.length > 0" :isShowDeleteIcon="true"
  228. @deleteImgInfo="getDeleteProductCardPicInfo" imgMode="aspectFill" :totalWidth="400"
  229. :images="formData.productCardPicFileList" :previewEnabled="true" :imageWidth="150"
  230. :imageHeight="150"></ImgsRowScroll>
  231. <u-upload @afterRead="afterReadProductCardPic" name="3" multiple :maxCount="9"
  232. :previewFullImage="true"></u-upload>
  233. </view>
  234. </u-form-item>
  235. <u-form-item label="商品标签" class="u-form-item-row" borderBottom>
  236. <u--input v-model="formData.productTag" placeholder="请输入" clearable border="none"></u--input>
  237. </u-form-item>
  238. <u-form-item label="商品附件" class="u-form-item-row" borderBottom>
  239. <u--input v-model="formData.productAttachment" placeholder="请输入" clearable
  240. border="none"></u--input>
  241. </u-form-item>
  242. <u-form-item :label="'备注(' + (formData.productDescPicFileList.length || 0) + '张)'" borderBottom>
  243. <view class="recycle_bottom_desc">
  244. <u--textarea v-model="formData.productDesc" clearable count autoHeight maxlength="250"
  245. height="100" confirmType="done"></u--textarea>
  246. <view class="imgs_scroll">
  247. <ImgsRowScroll v-if="formData.productDescPicFileList.length > 0"
  248. :isShowDeleteIcon="true" @deleteImgInfo="getDeleteProductDescPicInfo"
  249. imgMode="aspectFill" :totalWidth="400" :images="formData.productDescPicFileList"
  250. :previewEnabled="true" :imageWidth="150" :imageHeight="150"></ImgsRowScroll>
  251. <u-upload @afterRead="afterReadProductDescPic" name="1" multiple :maxCount="1"
  252. accept="image"></u-upload>
  253. </view>
  254. </view>
  255. </u-form-item>
  256. <u-form-item label="付款方式">
  257. <TabSelect :tabList="paymentTabList" :echoInfo="echoInfoPayType" :colNum="4" mode="single"
  258. :isClear="payTypeIsClear" @tabChange="handlePayTypeTabChange">
  259. </TabSelect>
  260. </u-form-item>
  261. </u--form>
  262. </view>
  263. </view>
  264. <view :class="['btn_group', {'col-2': formData.stockStatus == '1'}]">
  265. <u-button plain type="primary" @click="openInfoModal('onlyIn')">保存</u-button>
  266. <u-button type="primary" @click="openInfoModal('inAndUp')" v-if="formData.stockStatus == '1'">入库并上架</u-button>
  267. </view>
  268. <moreInfo ref="moreInfoRef" :moreOptions="moreOptions" @confirm="handleMoreInfoConfirm" :isCopy="true" :showCancelButton="true"></moreInfo>
  269. </view>
  270. </template>
  271. <script>
  272. import TabSelect from '@/components/custom-tab-select/index.vue'
  273. import Cell from '@/components/custom-cell/index.vue'
  274. import BrandList from '@/components/brand-list/index.vue'
  275. import ImgsRowScroll from '@/components/imgs-row-scroll/index.vue'
  276. import PersonPicker from '@/components/person-picker/index.vue'
  277. import { permissionCheck,getRoles } from '@/utils/util.js'
  278. import moreInfo from './moreInfo.vue'
  279. import { productConditionList,productAttributeList,stockStatusList,recycleTypeList,labelList,paymentTabList,recycleSituationList } from '../js/public.js'
  280. export default {
  281. components: {
  282. TabSelect,
  283. Cell,
  284. BrandList,
  285. ImgsRowScroll,
  286. PersonPicker,
  287. moreInfo
  288. },
  289. data() {
  290. return {
  291. checkboxValue: [''],
  292. recognitionContent: '',
  293. formData: {
  294. goodPicFileList: [],//商品图片
  295. desc: '',
  296. origin: '',
  297. type: '1',
  298. dictLabel: '艾美',
  299. dictValue: '88',
  300. series: '',
  301. model: '',
  302. dialType: '',
  303. caseMaterial: '',
  304. dialDiameter: '',
  305. material: '',
  306. size: '',
  307. yardage: '',
  308. price: 0,
  309. productCondition: '1',
  310. detailPicFileList: [],//细节图片
  311. // detailVideoFileList:[],
  312. title:'',
  313. productNo: '',
  314. productAttribute: '1',
  315. stock: 1,
  316. costPrice: '',
  317. peerPrice: '',
  318. actualPrice: '',
  319. agentPrice: '',
  320. salePrice: '',
  321. productPosition: '',
  322. watchYear: '',
  323. identifyingPerson: '',
  324. identifyingPersonId: '',
  325. stockStatus: '0',
  326. recycleType: '',
  327. recycleSituation: '0',
  328. recyclePerson: '',
  329. recyclePersonId: '',
  330. recycleBottomDesc: '',
  331. recycleBottomFileList: [],//回收留底图
  332. recycleTime: this.$dayjs().format('YYYY-MM-DD'),
  333. indentifyCode: '',
  334. targetAudience: '',
  335. productCard: '',
  336. cardYear: '',
  337. productCardPicFileList: [],//商品保卡图片或独立编码照片留底
  338. productTag: '',
  339. productAttachment: '',
  340. productDesc: '',
  341. productDescPicFileList: [],//商品备注图片
  342. payType: '',
  343. },
  344. continuousWarehousing: [],//是否连续入库 1:是 0:否
  345. rules: {
  346. goodPicFileList: [
  347. { required: true, message: '请上传商品图片' },
  348. ],
  349. desc: [
  350. { required: true, message: '请输入商品描述', trigger: ['blur', 'change'] },
  351. ],
  352. type: [
  353. { required: true, message: '请选择商品分类', trigger: ['blur', 'change'] },
  354. ],
  355. dictLabel: [
  356. { required: true, message: '请选择品牌', trigger: ['blur', 'change'] },
  357. ],
  358. model: [
  359. { required: true, message: '请输入型号', trigger: ['blur', 'change'] },
  360. ],
  361. productCondition: [
  362. { required: true, message: '请选择商品成色', trigger: ['blur', 'change'] },
  363. ],
  364. productAttribute: [
  365. { required: true, message: '请选择商品属性', trigger: ['blur', 'change'] },
  366. ],
  367. stock: [
  368. { required: true, message: '请输入库存数量' }
  369. ],
  370. price: [
  371. { required: true, message: '请输入官方指导价' }
  372. ],
  373. stockStatus: [
  374. { required: true, message: '请选择是否入库', trigger: [ 'change'] },
  375. ],
  376. recycleTime: [
  377. { required: true, message: '请选择回收时间', trigger: ['blur', 'change'] },
  378. ],
  379. },
  380. recycleTimeShow: false,
  381. titlePlaceholder: '如不填,自动截取商品描述前50字',
  382. typeList: [],
  383. typeIsClear: false,//商品分类是否清空
  384. productConditionIsClear: false,//商品成色是否清空
  385. productAttributeIsClear: false,//商品属性是否清空
  386. recycleTypeIsClear: false,//回收类型是否清空
  387. recycleSituationIsClear: false,//回收情况是否清空
  388. stockStatusIsClear: false,//是否入库是否清空
  389. labelIsClear: false,//商品标签是否清空
  390. payTypeIsClear: false,//付款方式是否清空
  391. echoInfoPayType: '',//付款方式识别回显
  392. echoInfoRecycleType:'',//入库回显的时候 回收类型回显
  393. echoInfoLabel:'',//入库回显的时候 商品标签回显
  394. echoInfoType:'',//入库回显的时候 类型回显
  395. echoInfoProductAttribute:'',//入库回显的时候 商品属性回显
  396. echoInfoProductCondition:'',//入库回显的时候 商品成色回显
  397. echoInfoStockStatus:'',//入库回显的时候 是否入库回显
  398. echoInfoRecycleSituation:'0',//入库回显的时候 回收情况回显
  399. isWareHouser: permissionCheck('WAREHOUSER',false),
  400. formType: '',//表单类型 add:新增 edit:编辑
  401. xhlSystemSetList: [],//系统设置-列表
  402. productConditionList:productConditionList,
  403. productAttributeList: productAttributeList,
  404. stockStatusList: stockStatusList,
  405. recycleTypeList: recycleTypeList,
  406. labelList: labelList,
  407. paymentTabList: paymentTabList,
  408. recycleSituationList: recycleSituationList,
  409. moreOptions: {},
  410. }
  411. },
  412. onLoad(options) {
  413. this.getTypeList();
  414. this.getXhlSystemSetList()
  415. this.$nextTick(async()=>{
  416. this.formType = options.formType
  417. if(options.formType == 'add'){
  418. this.clearForm()
  419. }else if(options.formType == 'edit'){
  420. const res = await uni.$u.api.wareHouseDetail({
  421. id: options.id,
  422. userId: this.$store.state.user.userInfo.userId,
  423. })
  424. this.formData = res.data
  425. this.formData.recycleTime = this.$dayjs(res.data.recycleTime).format('YYYY-MM-DD') || ''
  426. this.echoInfoType = res.data.type || '1'//商品分类回显
  427. this.formData.type = res.data.type || '1'//商品分类校验
  428. this.echoInfoProductAttribute = res.data.productAttribute || '1'//商品属性回显
  429. this.formData.productAttribute = res.data.productAttribute || '1'//商品属性校验
  430. this.echoInfoProductCondition = res.data.productCondition || '1'//商品成色回显
  431. this.formData.productCondition = res.data.productCondition || '1'//商品成色校验
  432. this.echoInfoStockStatus = res.data.stockStatus || '0'//是否入库回显
  433. this.formData.stockStatus = res.data.stockStatus || '0'//是否入库校验
  434. this.formData.stock = res.data.stock ? res.data.stock : 1//入库数量校验
  435. this.formData.price = res.data.price || 0//官方指导价校验
  436. this.echoInfoPayType = res.data.payType//付款方式回显
  437. this.echoInfoRecycleType = res.data.recycleType//回收类型回显
  438. this.echoInfoRecycleSituation = res.data.recycleSituation || '0'//回收情况回显
  439. this.echoInfoLabel = res.data.label//商品标签回显
  440. this.recognitionContent = `品牌:${res.data.dictLabel || '-'}
  441. 来源:${res.data.origin || '-'}
  442. 实价:${res.data.actualPrice || '-'}
  443. 型号:${res.data.model || '-'}
  444. 编码:${res.data.indentifyCode || '-'}
  445. 日期:${res.data.cardYear || '-'}
  446. 备注:${res.data.productDesc || '-'}
  447. 付款方式:${this.paymentTabList.find(item => item.value == res.data.payType)?.name || '-'}
  448. `
  449. }
  450. })
  451. },
  452. methods: {
  453. getXhlSystemSetList(){
  454. uni.$u.api.xhlSystemSetList({
  455. pageNum: 1,
  456. pageSize: 99,
  457. }).then(res => {
  458. this.xhlSystemSetList = res.rows || []
  459. })
  460. },
  461. handleBlurActualPrice() {
  462. if (this.formData.actualPrice) {
  463. const actualPrice = Number(this.formData.actualPrice)
  464. let obj = {}
  465. // 只要账号权限里面有销售权限,就按照销售的计算规则,没有就固定计算
  466. if(getRoles().includes('SALESMAN')){
  467. obj = this.xhlSystemSetList.find(item => item.agentType == 'SALESMAN') || {}
  468. }else{
  469. obj = {
  470. goodsRate: 0.003,
  471. goodsAmount: 500,
  472. }
  473. }
  474. this.formData.agentPrice = (actualPrice + actualPrice*obj.goodsRate + obj.goodsAmount).toFixed(2)
  475. }
  476. },
  477. getTypeList() {
  478. this.$getDicts("crm_form_category").then(res => {
  479. this.typeList = res
  480. })
  481. },
  482. openInfoModal(submitType) {
  483. this.$refs.addForm.validate().then(() => {
  484. this.submitType = submitType
  485. this.moreOptions = {
  486. dictLabel: this.formData.dictLabel || '',
  487. origin: this.formData.origin || '',
  488. actualPrice: this.formData.actualPrice || '',
  489. model: this.formData.model || '',
  490. indentifyCode: this.formData.indentifyCode || '',
  491. cardYear: this.formData.cardYear || '',
  492. productDesc: this.formData.productDesc || '',
  493. }
  494. this.$refs.moreInfoRef.showMoreInfo();
  495. })
  496. },
  497. handleMoreInfoConfirm() {
  498. if(!permissionCheck('WAREHOUSER')) return false
  499. this.submitForm(this.submitType)
  500. },
  501. // 提交表单
  502. submitForm(submitType) {
  503. this.$refs.addForm.validate().then((valid) => {
  504. if (valid) {
  505. if (this.formData.title == '') {
  506. this.formData.title = this.formData.desc.substring(0, 50);
  507. }
  508. this.formData.recycleTime = this.$dayjs(this.formData.recycleTime).format('YYYY-MM-DD')
  509. const data = {
  510. ...this.formData,
  511. submitType: submitType, //提交类型 onlyIn:仅入库/暂存入库 inAndUp:入库并上架
  512. continuousWarehousing: this.continuousWarehousing[0] || '0',//是否连续入库 1:是 0:否
  513. }
  514. this.$refs.moreInfoRef.closeModal();
  515. if(this.formType == 'add'){
  516. uni.$u.api.wareHouseAdd(data).then(res => {
  517. uni.$u.toast('操作成功');
  518. if (data.continuousWarehousing == '0') {
  519. setTimeout(() => {
  520. uni.navigateBack({
  521. delta: 1
  522. });
  523. }, 1000);
  524. } else {
  525. this.clearForm();
  526. }
  527. }).catch(err => {
  528. uni.$u.toast(err);
  529. })
  530. }else if(this.formType == 'edit'){
  531. uni.$u.api.wareHouseUpdate(data).then(res => {
  532. uni.$u.toast('操作成功');
  533. if (data.continuousWarehousing == '0') {
  534. setTimeout(() => {
  535. uni.navigateBack({
  536. delta: 1
  537. });
  538. }, 1000);
  539. } else {
  540. this.clearForm();
  541. }
  542. }).catch(err => {
  543. uni.$u.toast(err);
  544. })
  545. }
  546. } else {
  547. console.log('表单校验不通过');
  548. }
  549. });
  550. },
  551. clearForm() {
  552. this.formData = {
  553. goodPicFileList: [],//商品图片
  554. desc: '',
  555. origin: '',
  556. type: '1',
  557. dictLabel: '艾美',
  558. dictValue: '88',
  559. series: '',
  560. model: '',
  561. dialType: '',
  562. caseMaterial: '',
  563. dialDiameter: '',
  564. material: '',
  565. size: '',
  566. yardage: '',
  567. price: 0,
  568. productCondition: '1',
  569. detailPicFileList: [],//细节图片
  570. // detailVideoFileList:[],
  571. productNo: '',
  572. productAttribute: '1',
  573. stock: 1,
  574. costPrice: '',
  575. samePrice: '',
  576. agentPrice: '',
  577. salePrice: '',
  578. productPosition: '',
  579. watchYear: '',
  580. identifyingPerson: '',
  581. identifyingPersonId: '',
  582. stockStatus: '0',
  583. recycleType: '',
  584. recycleSituation: '0',
  585. label: '',
  586. recyclePerson: '',
  587. recyclePersonId: '',
  588. recycleBottomDesc: '',
  589. recycleBottomFileList: [],//回收留底图
  590. recycleTime: this.$dayjs().format('YYYY-MM-DD'),
  591. indentifyCode: '',
  592. targetAudience: '',
  593. productCard: '',
  594. cardYear: '',
  595. productCardPicFileList: [],//商品保卡图片或独立编码照片留底
  596. productTag: '',
  597. productAttachment: '',
  598. productDesc: '',
  599. productDescPicFileList: [],//商品备注图片
  600. payType: '',
  601. }
  602. this.recycleTypeIsClear = true;
  603. this.payTypeIsClear = true;
  604. this.labelIsClear = true;
  605. this.echoInfoType = '1';//类型默认第一项
  606. this.echoInfoProductCondition = '1';//商品成色默认第一项
  607. this.echoInfoProductAttribute = '1';//商品属性默认第一项
  608. this.echoInfoStockStatus = '0';//是否入库默认第一项
  609. this.continuousWarehousing = [];
  610. this.$nextTick(()=>{
  611. this.$refs.addForm.resetFields();
  612. })
  613. },
  614. // 选择品牌
  615. handleSelectedBrand(info) {
  616. this.formData.dictLabel = info.dictLabel;
  617. this.formData.dictValue = info.dictValue;
  618. this.$refs.addForm.validateField('dictLabel');
  619. },
  620. // 显示品牌列表
  621. showBrandList() {
  622. this.$refs.brandListRef.showBrandList();
  623. },
  624. // 清空输入框
  625. clear(key) {
  626. // 品牌
  627. if (key == 'dictLabel') {
  628. this.formData.dictLabel = '';
  629. this.formData.dictValue = '';
  630. return;
  631. }
  632. // 鉴定人
  633. if (key == 'identifyingPerson') {
  634. this.formData.identifyingPerson = '';
  635. this.formData.identifyingPersonId = '';
  636. return;
  637. }
  638. // 回收人
  639. if (key == 'recyclePerson') {
  640. this.formData.recyclePerson = '';
  641. this.formData.recyclePersonId = '';
  642. return;
  643. }
  644. this.formData[key] = '';
  645. },
  646. // 商品分类
  647. handleTabChangeType(e) {
  648. this.formData.type = e;
  649. this.$refs.addForm.validateField('type')
  650. },
  651. // 商品成色
  652. handleTabChangeProductCondition(e) {
  653. this.formData.productCondition = e;
  654. this.$refs.addForm.validateField('productCondition')
  655. },
  656. // 商品属性
  657. handleTabChangeProductAttribute(e) {
  658. this.formData.productAttribute = e;
  659. this.$refs.addForm.validateField('productAttribute')
  660. },
  661. // 是否入库
  662. handleTabChangeStockStatus(e) {
  663. this.formData.stockStatus = e;
  664. },
  665. // 回收类型
  666. handleTabChangeRecycleType(e) {
  667. this.formData.recycleType = e;
  668. },
  669. // 回收情况
  670. handleTabChangeRecycleSituation(e) {
  671. this.formData.recycleSituation = e;
  672. },
  673. // 商品标签
  674. handleTabChangeLabel(e) {
  675. this.formData.label = e;
  676. },
  677. // 付款方式
  678. handlePayTypeTabChange(e) {
  679. this.formData.payType = e;
  680. },
  681. // 打开回收时间选择器
  682. clickRecycleTimeRow() {
  683. this.recycleTimeShow = true;
  684. },
  685. // 确认回收时间
  686. confirmRecycleTime(val) {
  687. this.$nextTick(() => {
  688. this.formData.recycleTime = this.$dayjs(val.value).format('YYYY-MM-DD');
  689. this.recycleTimeShow = false;
  690. })
  691. },
  692. // 关闭回收时间选择器
  693. closeRecycleTimePicker(val) {
  694. this.recycleTimeShow = false;
  695. },
  696. // 打开鉴定人选择器
  697. identifyingPersonClick() {
  698. this.$refs.identifyingPersonPickerRef.open();
  699. },
  700. // 选择鉴定人
  701. handleSelectIdentifyingPerson(info) {
  702. this.formData.identifyingPerson = info.label;
  703. this.formData.identifyingPersonId = info.id;
  704. },
  705. // 打开回收人选择器
  706. recyclePersonClick() {
  707. this.$refs.recyclePersonPickerRef.open();
  708. },
  709. // 选择回收人
  710. handleSelectRecyclePerson(info) {
  711. this.formData.recyclePerson = info.label;
  712. this.formData.recyclePersonId = info.id;
  713. },
  714. // 新增商品图片
  715. async afterReadGoodPic(event) {
  716. event.file.forEach(item => {
  717. uni.$u.api.uploadFile(item.url).then((res) => {
  718. this.formData.goodPicFileList.push(res.data.url);
  719. uni.$u.toast("文件上传成功");
  720. }).catch(() => {
  721. uni.$u.toast("上传文件失败");
  722. })
  723. })
  724. },
  725. // 获取删除商品图片信息
  726. getDeleteGoodPicInfo(info) {
  727. this.formData.goodPicFileList = info.newImages
  728. },
  729. // 获取删除细节图片信息
  730. getDeleteDetailPicInfo(info) {
  731. this.formData.detailPicFileList = info.newImages
  732. },
  733. // 新增细节图片
  734. async afterReadDetailPic(event) {
  735. event.file.forEach(item => {
  736. uni.$u.api.uploadFile(item.url).then((res) => {
  737. this.formData.detailPicFileList.push(res.data.url);
  738. uni.$u.toast("文件上传成功");
  739. }).catch(() => {
  740. uni.$u.toast("上传文件失败");
  741. })
  742. })
  743. },
  744. // 获取删除回收留底图信息
  745. getDeleteRecycleBottomPicInfo(info) {
  746. this.formData.recycleBottomFileList = info.newImages
  747. },
  748. // 新增回收留底图
  749. async afterReadRecycleBottom(event) {
  750. event.file.forEach(item => {
  751. uni.$u.api.uploadFile(item.url).then((res) => {
  752. this.formData.recycleBottomFileList.push(res.data.url);
  753. uni.$u.toast("文件上传成功");
  754. }).catch(() => {
  755. uni.$u.toast("上传文件失败");
  756. })
  757. })
  758. },
  759. // 删除商品保卡图片或独立编码照片留底
  760. getDeleteProductCardPicInfo(info) {
  761. this.formData.productCardPicFileList = info.newImages
  762. },
  763. // 新增商品保卡图片或独立编码照片留底
  764. async afterReadProductCardPic(event) {
  765. event.file.forEach(item => {
  766. uni.$u.api.uploadFile(item.url).then((res) => {
  767. this.formData.productCardPicFileList.push(res.data.url);
  768. uni.$u.toast("文件上传成功");
  769. }).catch(() => {
  770. uni.$u.toast("上传文件失败");
  771. })
  772. })
  773. },
  774. // 获取删除商品备注图片信息
  775. getDeleteProductDescPicInfo(info) {
  776. this.formData.productDescPicFileList = info.newImages
  777. },
  778. // 新增商品备注图片
  779. async afterReadProductDescPic(event) {
  780. event.file.forEach(item => {
  781. uni.$u.api.uploadFile(item.url).then((res) => {
  782. this.formData.productDescPicFileList.push(res.data.url);
  783. uni.$u.toast("文件上传成功");
  784. }).catch(() => {
  785. uni.$u.toast("上传文件失败");
  786. })
  787. })
  788. },
  789. async handlePasteRecognition(text) {
  790. // 品牌:浪琴
  791. // 来源:【麒麟】私信-杰3-3
  792. // 实价:6500
  793. // 型号:L2.257.5.89.7
  794. // 编码:52356065
  795. // 日期:2021-11-09
  796. // 备注:全套
  797. // 付款方式:微信
  798. if (!text) {
  799. return;
  800. }
  801. try {
  802. if (!text) return {};
  803. const result = {};
  804. // 支持中文冒号和英文冒号
  805. const lines = text.split(/[\n\r]+/);
  806. lines.forEach(line => {
  807. const lineStr = line.trim();
  808. if (!lineStr) return;
  809. // 尝试中文冒号
  810. let separatorIndex = lineStr.indexOf(':');
  811. // 如果没有中文冒号,尝试英文冒号
  812. if (separatorIndex === -1) {
  813. separatorIndex = lineStr.indexOf(':');
  814. }
  815. if (separatorIndex > 0) {
  816. const key = lineStr.substring(0, separatorIndex).trim();
  817. const value = lineStr.substring(separatorIndex + 1).trim();
  818. result[key] = value;
  819. }
  820. });
  821. if (result['品牌']) {
  822. this.formData.dictLabel = result['品牌'];
  823. }
  824. if (result['来源']) {
  825. this.formData.origin = result['来源'];
  826. }
  827. if (result['实价']) {
  828. this.formData.actualPrice = result['实价'];
  829. }
  830. if (result['型号']) {
  831. this.formData.model = result['型号'];
  832. }
  833. if (result['编码']) {
  834. this.formData.indentifyCode = result['编码'];
  835. }
  836. if (result['日期']) {
  837. this.formData.cardYear = result['日期'];
  838. }
  839. if (result['备注']) {
  840. this.formData.productDesc = result['备注'];
  841. }
  842. if (result['付款方式']) {
  843. this.getPaymentType(result['付款方式'])
  844. this.formData.payType = result['付款方式'];
  845. }
  846. // return result;
  847. } catch (e) {
  848. uni.$u.toast("文本识别异常");
  849. }
  850. },
  851. // 清空识别内容
  852. clearRecognitionContent() {
  853. this.recognitionContent = '';
  854. },
  855. // 识别内容 回显付款方式
  856. getPaymentType(val) {
  857. let arr = []
  858. this.paymentTabList.filter(item => {
  859. if (item.name == val) arr.push(item.value)
  860. })
  861. if (arr.length > 0) {
  862. this.echoInfoPayType = arr[0]
  863. }
  864. }
  865. }
  866. }
  867. </script>
  868. <style lang="scss" scoped>
  869. @import '../styles/edit.scss';
  870. </style>