add.vue 38 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440
  1. <template>
  2. <view class="container qualifications" :style="{ paddingBottom: isIphoneX ? '68rpx' : '0' }">
  3. <view class="remarks-content-club" @click="handleClickClunInfo">
  4. <view class="content-club-le">
  5. <view class="club-le-text">
  6. <text class="label">机构名称:</text> <text class="text">{{ clubInfo.name }}</text>
  7. </view>
  8. <view class="club-le-text">
  9. <text class="label">联系人:</text> <text class="text">{{ clubInfo.linkMan }}</text>
  10. <text class="label phone">手机号:</text> <text class="text">{{ clubInfo.contractMobile }}</text>
  11. </view>
  12. <view class="club-le-text">
  13. <text class="label">地址:</text>
  14. <text class="text" v-if="clubInfo.provincialAddress"
  15. >{{ clubInfo.provincialAddress }}{{ clubInfo.address }}</text
  16. >
  17. </view>
  18. </view>
  19. <view class="content-club-ri"> <text class="iconfont icon-xiayibu"></text> </view>
  20. </view>
  21. <view class="remarks-content">
  22. <view class="list-view-title">
  23. <view class="list-view-h1"><text>*</text>沟通情况:</view>
  24. </view>
  25. <view class="remarks-category">
  26. <radio-group @change="radioChange">
  27. <label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in items" :key="item.value">
  28. <radio
  29. :value="item.value"
  30. style="transform:scale(0.7)"
  31. color="#FF5B00"
  32. :checked="index === current"
  33. />
  34. <label :for="item.value" class="label">
  35. <text>{{ item.name }}</text>
  36. </label>
  37. </label>
  38. </radio-group>
  39. <checkbox-group v-if="current === 0" @change="checkboxChange" style="margin-top: 10rpx;">
  40. <label class="label" v-for="item in checkboItems" :key="item.value">
  41. <checkbox :value="item.value" :checked="item.checked" style="transform:scale(0.7)" color="#FF5B00" />
  42. {{item.name}}
  43. </label>
  44. </checkbox-group>
  45. </view>
  46. <view class="list-view-title">
  47. <view class="list-view-h1"><text>*</text>咨询人:</view>
  48. </view>
  49. <view class="remarks-input">
  50. <input
  51. class="input"
  52. type="text"
  53. v-model="remarksParams.questionMan"
  54. value=""
  55. placeholder="请输入和你聊天的客户姓名"
  56. maxlength="15"
  57. />
  58. </view>
  59. <view class="list-view-title"> <view class="list-view-h1">客户来源:</view> </view>
  60. <view class="list-view-radio">
  61. <picker @change="bindPickerChange(4, $event)" :value="index" :range="sourceActions" range-key="name">
  62. <input
  63. class="input"
  64. type="text"
  65. disabled="false"
  66. v-model="sourceStateText"
  67. value=""
  68. placeholder="请选择"
  69. />
  70. <text class="iconfont icon-xiangyou"></text>
  71. </picker>
  72. </view>
  73. <view class="list-view-title"> <view class="list-view-h1">客户性别:</view> </view>
  74. <view class="list-view-radio">
  75. <picker @change="bindPickerChange(5, $event)" :value="index" :range="genderActions" range-key="name">
  76. <input
  77. class="input"
  78. type="text"
  79. disabled="false"
  80. v-model="genderText"
  81. value=""
  82. placeholder="请选择"
  83. />
  84. <text class="iconfont icon-xiangyou"></text>
  85. </picker>
  86. </view>
  87. <view class="list-view-title"> <view class="list-view-h1">客户年龄:</view> </view>
  88. <view class="list-view-radio">
  89. <picker @change="bindPickerChange(6, $event)" :value="index" :range="ageActions" range-key="name">
  90. <input class="input" type="text" disabled="false" v-model="customerAge" value="" placeholder="请选择" />
  91. <text class="iconfont icon-xiangyou"></text>
  92. </picker>
  93. </view>
  94. <view class="list-view-title"> <view class="list-view-h1">加群情况:</view> </view>
  95. <view class="list-view-radio">
  96. <picker @change="bindPickerChange(7, $event)" :value="index" :range="additiveActions" range-key="name">
  97. <input
  98. class="input"
  99. type="text"
  100. disabled="false"
  101. v-model="additiveText"
  102. value=""
  103. placeholder="请选择"
  104. />
  105. <text class="iconfont icon-xiangyou"></text>
  106. </picker>
  107. </view>
  108. <view class="list-view-title" v-if="current === 0">
  109. <view class="list-view-h1"><text>*</text>咨询类别:</view>
  110. </view>
  111. <view class="remarks-category" v-if="current === 0">
  112. <view
  113. class="checkbox-list"
  114. :class="category.isChecked ? 'checked' : ''"
  115. v-for="(category, index) in categorys"
  116. :key="index"
  117. @click="choiceCategorys(category, index)"
  118. >
  119. <text class="iconfont" :class="category.isChecked ? 'icon-yixuanze' : 'icon-weixuanze'"></text>
  120. {{ category.className }}
  121. </view>
  122. </view>
  123. <!-- <view class="list-view-title"> <view class="list-view-h1">机构类型:</view> </view>
  124. <view class="remarks-input">
  125. <input
  126. class="input"
  127. type="text"
  128. v-model="remarksParams.clubType"
  129. value=""
  130. placeholder="如美甲店,医院"
  131. maxlength="15"
  132. />
  133. </view> -->
  134. <view class="list-view-title"> <view class="list-view-h1">咨询商品:</view> </view>
  135. <view class="tui-remarks-content">
  136. <view class="tui-remarks-goods-input" v-if="handleGoods.length === 0" @click="handleShowGoodPopup">
  137. <view class="input-add"> <text class="iconfont icon-jiahao"></text> </view>
  138. <view class="input-text"> 点击添加客户咨询的商品 </view>
  139. </view>
  140. <view class="tui-remarks-showgoods" v-else>
  141. <view class="tui-remarks-goods" v-for="(pros, index) in handleGoods" :key="index">
  142. <view class="goods-image"> <image :src="pros.image" mode=""></image> </view>
  143. <view class="goods-main">
  144. <view class="name"> {{ pros.name }} </view>
  145. <view class="shop"> 供应商:{{ pros.shopName }} </view>
  146. </view>
  147. </view>
  148. <view class="tui-remarks-btn">
  149. <view class="btn delete" @click="handleClean">删除</view>
  150. <view class="btn update" @click="handleShowGoodPopup">更换</view>
  151. </view>
  152. </view>
  153. </view>
  154. <view class="list-view-title">
  155. <view class="list-view-h1">标签记录:</view>
  156. <view class="list-view-p">
  157. 请总结客户的个人画像和咨询内容,尽量使用简短的描述性词语,杜绝口语化的词语 (优先选择以下展示的标签)
  158. </view>
  159. </view>
  160. <view class="list-view-list-main">
  161. <view class="list-label-list">
  162. <text class="list-label"
  163. :class="item.isChecked ? 'active' : ''"
  164. v-for="(item, index) in labelsList"
  165. :key="index"
  166. @click="handleCheckedLabel(item,index)"
  167. >
  168. {{ item.label }}
  169. </text>
  170. </view>
  171. </view>
  172. <view class="list-view-title">
  173. <view class="list-view-h1">机构静态标签:</view>
  174. <view class="list-view-p"> (若你对客户的静态特点有更多维度进行描述,请手动填) </view>
  175. </view>
  176. <view class="list-view-list-main">
  177. <view class="list-view-list" v-for="(item, index) in staticLabelsList" :key="index">
  178. <view class="list-view-input">
  179. <input
  180. class="input"
  181. type="text"
  182. v-model="item.label"
  183. placeholder="请输入标签,不超过10个汉字"
  184. maxlength="10"
  185. @focus="hideStaticLabelsAction(item, $event)"
  186. @blur="hideStaticLabelsAction(item, $event)"
  187. @input="handleStaticLabelsAction(index, $event)"
  188. />
  189. <view class="list-view-assAction" v-if="item.isAssociation">
  190. <scroll-view class="tui-popup-scroll train" scroll-y="true">
  191. <view
  192. class="ass-list"
  193. v-for="(ass, assIndex) in staticLabelsActionList"
  194. :key="assIndex"
  195. @click="handleSelectStaticLabels(ass.label, item)"
  196. >{{ ass.label }}</view
  197. >
  198. </scroll-view>
  199. </view>
  200. </view>
  201. <view class="list-view-btn">
  202. <text
  203. class="iconfont icon-zengjia"
  204. v-if="staticLabelsList.length < 9 && index === staticLabelsList.length - 1"
  205. @click="handleAddStaticLabels(item, index)"
  206. ></text>
  207. <text
  208. class="iconfont icon-shanchu4"
  209. v-if="staticLabelsList.length > 1 && index != staticLabelsList.length - 1"
  210. @click="handleDelStaticLabels(item, index)"
  211. ></text>
  212. </view>
  213. </view>
  214. </view>
  215. <view class="list-view-title">
  216. <view class="list-view-h1">机构动态标签:</view>
  217. <view class="list-view-p"> (若你对客户的购买诉求有更多维度进行描述,请手动填) </view>
  218. </view>
  219. <view class="list-view-list-main">
  220. <view class="list-view-list" v-for="(item, index) in trendsLabelsList" :key="index">
  221. <view class="list-view-input">
  222. <input
  223. class="input"
  224. type="text"
  225. v-model="item.label"
  226. placeholder="请输入标签,不超过10个汉字"
  227. maxlength="10"
  228. @focus="hideTrendsLabelsAction(item, $event)"
  229. @blur="hideTrendsLabelsAction(item, $event)"
  230. @input="handleTrendsLabelsAction(index, $event)"
  231. />
  232. <view class="list-view-assAction" v-if="item.isAssociation">
  233. <scroll-view class="tui-popup-scroll train" scroll-y="true">
  234. <view
  235. class="ass-list"
  236. v-for="(ass, assIndex) in trendsLabelsActionList"
  237. :key="assIndex"
  238. @click="handleSelectTrendsLabels(ass.label, item)"
  239. >{{ ass.label }}</view
  240. >
  241. </scroll-view>
  242. </view>
  243. </view>
  244. <view class="list-view-btn">
  245. <text
  246. class="iconfont icon-zengjia"
  247. v-if="trendsLabelsList.length < 9 && index === trendsLabelsList.length - 1"
  248. @click="handleAddTrendsLabels(item, index)"
  249. ></text>
  250. <text
  251. class="iconfont icon-shanchu4"
  252. v-if="trendsLabelsList.length > 1 && index != trendsLabelsList.length - 1"
  253. @click="handleDelTrendsLabels(item, index)"
  254. ></text>
  255. </view>
  256. </view>
  257. </view>
  258. <view class="list-view-title">
  259. <view class="list-view-h1">关联报备:</view>
  260. <view class="list-view-p">(若客户咨询的事项不确定采美能不能做,请创建并关联报备向上级反馈)</view>
  261. </view>
  262. <view class="list-view-radio" @click="handleShowReportPopup">
  263. <input
  264. class="input"
  265. type="text"
  266. disabled="false"
  267. v-model="reportText"
  268. value=""
  269. placeholder="请选择报备"
  270. />
  271. <text class="iconfont icon-xiangyou"></text>
  272. </view>
  273. <view class="list-view-title" v-if="current === 0">
  274. <view class="list-view-h1"><text>*</text>价格敏感度:</view>
  275. </view>
  276. <view class="list-view-radio" v-if="current === 0">
  277. <picker @change="bindPickerChange(1, $event)" :value="index" :range="priceActions" range-key="name">
  278. <input
  279. class="input"
  280. type="text"
  281. disabled="false"
  282. v-model="priceFlagText"
  283. value=""
  284. placeholder="请选择"
  285. />
  286. <text class="iconfont icon-xiangyou"></text>
  287. </picker>
  288. </view>
  289. <view class="list-view-title" v-if="current === 0">
  290. <view class="list-view-h1"><text>*</text>意向程度:</view>
  291. </view>
  292. <view class="list-view-radio" v-if="current === 0">
  293. <picker @change="bindPickerChange(2, $event)" :value="index" :range="intenActions" range-key="name">
  294. <input
  295. class="input"
  296. type="text"
  297. disabled="false"
  298. v-model="intenFlagText"
  299. value=""
  300. placeholder="请选择"
  301. />
  302. <text class="iconfont icon-xiangyou"></text>
  303. </picker>
  304. </view>
  305. <view class="list-view-title" v-if="current === 0">
  306. <view class="list-view-h1"><text>*</text>跟进状态:</view>
  307. </view>
  308. <view class="list-view-radio" v-if="current === 0">
  309. <picker @change="bindPickerChange(3, $event)" :value="index" :range="stateActions" range-key="name">
  310. <input
  311. class="input"
  312. type="text"
  313. disabled="false"
  314. v-model="followStateText"
  315. value=""
  316. placeholder="请选择"
  317. />
  318. <text class="iconfont icon-xiangyou"></text>
  319. </picker>
  320. </view>
  321. <view class="list-view-title"> <view class="list-view-h1">额外说明:</view> </view>
  322. <view class="remarks-textarea">
  323. <textarea
  324. class="textarea"
  325. v-model="remarksParams.extra"
  326. value=""
  327. placeholder="请输入其他需要说明的内容"
  328. maxlength="200"
  329. @input="conInput"
  330. />
  331. <text class="limit-text">{{ min }}/{{ max }}</text>
  332. </view>
  333. <view class="list-view-title">
  334. <view class="list-view-h1">上传图片</view>
  335. <view class="list-view-p">(可上传与客户的聊天截图或其他重要图片资料,最多10张)</view>
  336. </view>
  337. <view class="list-view-upload clearfix">
  338. <view class="photo-item" v-for="(image, imageIndex) in remarksParams.imageList" :key="imageIndex">
  339. <image
  340. :src="image"
  341. mode="aspectFill"
  342. @click.stop="previewImg(remarksParams.imageList, imageIndex)"
  343. ></image>
  344. <text
  345. class="iconfont icon-iconfontguanbi"
  346. @click.stop="deletePhotoFn(remarksParams.imageList, imageIndex)"
  347. ></text>
  348. </view>
  349. <view
  350. class="photo-item add"
  351. @click.stop="uploadPhotoFn(remarksParams.imageList)"
  352. v-if="remarksParams.imageList.length < 10 || remarksParams.imageList.length == 0"
  353. >
  354. <text class="iconfont icon-jiahao"></text>
  355. </view>
  356. </view>
  357. <view class="list-view-title">
  358. <view class="list-view-h1">上传文件</view>
  359. <view class="list-view-p">(可上传与客户相关的文件资料,最多10份,支持word,excel,ppt和pdf格式文件)</view>
  360. </view>
  361. <view class="list-view" v-for="(file, fileIndex) in remarksParams.fileList" :key="fileIndex">
  362. <view class="list-view-text">
  363. <view class="input">{{ file.fileName }}</view>
  364. <view class="delbtn" @click.stop="deleteFileFn(remarksParams.fileList, fileIndex)">删除</view>
  365. </view>
  366. </view>
  367. <view class="list-view">
  368. <view class="list-view-file" @click="uploadFile(remarksParams.fileList)">选择文件</view>
  369. </view>
  370. </view>
  371. <view class="remarks-btn" :style="{ paddingBottom: isIphoneX ? '68rpx' : '34rpx' }">
  372. <view class="edit-button" @click="editButtonConfim">确定</view>
  373. </view>
  374. <!-- 商品列表弹窗 -->
  375. <cm-goodspopup
  376. ref="cmgoodspopup"
  377. v-if="isGoodspopup"
  378. :show="isGoodspopup"
  379. @handleChoiceaGoods="handleChoiceaGoodsData"
  380. />
  381. <!-- 机构报备弹窗 -->
  382. <cm-reportpopup
  383. ref="cmreportpopup"
  384. v-if="isReportpopup"
  385. :show="isReportpopup"
  386. :popupType="1"
  387. :reportInfo="reportInfo"
  388. @handleChoiceaReport="handleChoiceaReportData"
  389. />
  390. <!-- 提示弹窗 -->
  391. <tui-modal
  392. :show="modal"
  393. @click="handleClick"
  394. :content="contentModalText"
  395. :button="modalButton"
  396. color="#333"
  397. :size="32"
  398. shape="circle"
  399. :maskClosable="false"
  400. />
  401. </view>
  402. </template>
  403. <script>
  404. import { mapState, mapMutations } from 'vuex'
  405. import authorize from '@/common/config/authorize.js'
  406. import { uploadFileImage, uploadFilePdfDocDocxXlsx } from '@/services/public.js'
  407. import cmGoodspopup from '../components/cm-goods-popup'
  408. import cmReportpopup from '../components/cm-report-popup'
  409. import addMixins from './mixins/addMixins.js'
  410. var isPreviewImg
  411. export default {
  412. mixins: [addMixins],
  413. components: {
  414. cmGoodspopup,
  415. cmReportpopup
  416. },
  417. data() {
  418. return {
  419. hideButton: true,
  420. isIphoneX: this.$store.state.isIphoneX,
  421. shopOrderId: 0,
  422. logisticsBatchId: 0,
  423. productActions: [],
  424. remarksParams: {
  425. clubId: 0,
  426. questionMan: '',
  427. clubType: '', //机构类型
  428. extra: '', //额外说明
  429. fileList: [],
  430. imageList: [],
  431. serviceProviderId: 0,
  432. consult: '', // 咨询类别
  433. pinceSensitve: 0, //价格敏感度
  434. satisfied: 0, // 意向程度
  435. followup: 0, // 跟进状态
  436. productId: 0, // 商品Id
  437. reportId: 0 ,// 报备Id
  438. communicationSituation:'', // 沟通情况 0 已沟通 1联系不上
  439. communicationMethods:'', //沟通方式 1:电话 2:微信
  440. customerSource:'',//客户来源 0 网址 1 小程序 2 公众号 3 小红书 4 微博 5 搜狐 6 其他
  441. customerGender:'',// 客户性别 0 男 1 女
  442. customerAge:'',// 客户年龄
  443. groupAddition:'' ,// 加群情况 0 以加群 1 未加群
  444. remarks: null, // 关键词
  445. trendsKeyword:null,// 动态标签
  446. stateKeyword:null // 静态标签
  447. },
  448. min: 0,
  449. max: 200,
  450. handleType: '',
  451. clubUserId: 0,
  452. clubInfo: {},
  453. userInfo: {},
  454. checkedCategorysList: [],
  455. categorys: [],
  456. isConfirmLoding: false,
  457. reportText: '',
  458. checkRemarkIndex: 0,
  459. assActionList: [],
  460. isGoodspopup: false,
  461. isReportpopup: false,
  462. isHashReport: false,
  463. handleGoods: [],
  464. reportInfo: {
  465. clubId: 0,
  466. name: '',
  467. linkMan: ''
  468. },
  469. modal: false,
  470. contentModalText: '', //操作文字提示语句
  471. modalButton: [
  472. {
  473. text: '知道了',
  474. customStyle: {
  475. color: '#fff',
  476. bgColor: 'linear-gradient(90deg, #F28F31 0%, #FF5B00 100%)'
  477. },
  478. plain: false
  479. }
  480. ],
  481. }
  482. },
  483. onLoad(option) {
  484. console.log(option)
  485. if (option.type == 'edit') {
  486. this.handleType = option.type
  487. this.getPriorKeyword()
  488. this.getUserClubConsults()
  489. this.getUserClubRemarksDetail(option.remarksId)
  490. uni.setNavigationBarTitle({ title: '修改记录' })
  491. } else {
  492. this.clubUserId = option.userId
  493. this.getCulbInfo(option.userId)
  494. this.getHistoryInfo(option.userId)
  495. this.getPriorKeyword()
  496. this.getUserClubConsults()
  497. }
  498. },
  499. methods: {
  500. ...mapMutations(['login']),
  501. async getCulbInfo(userId) {
  502. // 查询机构信息
  503. try{
  504. const userInfos = await this.$api.getStorage()
  505. const res = await this.UserService.OrganizationUpdateModifyInfo({ userId: userId })
  506. const data = res.data
  507. this.clubInfo = data.club
  508. this.userInfo = data.user
  509. this.reportInfo.name = this.clubInfo.name
  510. this.reportInfo.linkMan = this.clubInfo.linkMan
  511. this.remarksParams.clubId = this.reportInfo.clubId = this.clubInfo.clubId
  512. this.remarksParams.serviceProviderId = userInfos.serviceProviderId ? userInfos.serviceProviderId : 0
  513. if (this.handleType != 'edit') {
  514. this.remarksParams.questionMan = this.clubInfo.linkMan
  515. }
  516. }catch(error){
  517. console.log('=============>', error.msg)
  518. }
  519. },
  520. async getUserClubRemarksDetail(remarksId) {
  521. //修改回显资料备注信息
  522. try{
  523. const res = await this.UserService.getUserClubRemarksDetail({ remarksId: remarksId })
  524. const data = res.data
  525. this.clubUserId = data.userId
  526. this.remarksParams.remarksId = data.remarksId
  527. this.remarksParams.communicationSituation = this.current = data.communicationSituation
  528. this.remarksParams.communicationMethods = data.communicationMethods
  529. if(data.communicationMethods === '1,2' || data.communicationMethods === '2,1'){
  530. this.checkboItems = this.checkboItems.map(el => {
  531. el.checked = true
  532. return el
  533. })
  534. }else{
  535. this.checkboItems = this.checkboItems.map(el => {
  536. if (el.value*1 === data.communicationMethods*1) {
  537. el.checked = true
  538. }
  539. return el
  540. })
  541. }
  542. this.remarksParams.extra = data.extra
  543. this.remarksParams.clubType = data.clubType
  544. this.remarksParams.pinceSensitve = data.pinceSensitve
  545. this.remarksParams.customerSource = data.customerSource
  546. this.remarksParams.customerGender = data.customerGender
  547. this.remarksParams.customerAge = this.customerAge = data.customerAge
  548. this.remarksParams.groupAddition = data.groupAddition
  549. this.remarksParams.satisfied = data.satisfied
  550. this.remarksParams.followup = data.followup
  551. this.remarksParams.fileList = data.fileList
  552. this.remarksParams.imageList = data.imageList
  553. this.remarksParams.productId = data.productId
  554. if (this.handleType == 'edit') {
  555. if (data.reportId) {
  556. this.isHashReport = true
  557. this.remarksParams.reportId = data.reportId
  558. }
  559. this.remarksParams.questionMan = data.questionMan
  560. this.remarksParams.consult = data.consult
  561. this.checkedCategorysList = data.consult.split(',').map(i => parseInt(i, 0))
  562. this.categorys = this.categorys.map((el, index) => {
  563. if(this.contains(this.checkedCategorysList,el.id)){
  564. el.isChecked = true
  565. }else{
  566. el.isChecked = false
  567. }
  568. return el
  569. })
  570. }
  571. if (data.productId) {
  572. let pro = {
  573. image: data.mainImage,
  574. name: data.productName,
  575. shopName: data.shopName
  576. }
  577. this.handleGoods.push(pro)
  578. }
  579. if(data.remarks){
  580. this.firstLabelList = data.remarks.map((el, index) => {
  581. return el.label
  582. })
  583. this.labelsList = this.labelsList.map((el, index) => {
  584. if (this.contains(this.firstLabelList, el.label)) {
  585. el.isChecked = true
  586. }
  587. return el
  588. })
  589. }
  590. if(data.stateKeyword){
  591. this.staticLabelsList = data.stateKeyword.map((el, index) => {
  592. el.isAssociation = false
  593. return el
  594. })
  595. }
  596. if(data.trendsKeyword){
  597. this.trendsLabelsList = data.trendsKeyword.map((el, index) => {
  598. el.isAssociation = false
  599. return el
  600. })
  601. }
  602. this.reportText = data.reportText ? data.reportText : ''
  603. this.priceFlagText = this.pinceFilters(data.pinceSensitve)
  604. this.intenFlagText = this.intenActionsFilters(data.satisfied)
  605. this.followStateText = this.followupFilters(data.followup)
  606. this.sourceStateText = this.sourceActionsFilters(data.customerSource)
  607. this.genderText = this.genderActionsFilters(data.customerGender)
  608. this.additiveText = this.additiveActionsFilters(data.groupAddition)
  609. this.getCulbInfo(data.userId)
  610. }catch(error){
  611. this.$util.msg(error.msg, 2000)
  612. }
  613. },
  614. async getHistoryInfo(userId) {
  615. //查询机构历史填写信息
  616. try{
  617. const res = await this.UserService.getHistoryInfo({ userId:userId })
  618. const data = res.data
  619. this.remarksParams.customerSource = data.customerSource
  620. this.remarksParams.customerGender = data.customerGender
  621. this.remarksParams.customerAge = this.customerAge = data.customerAge
  622. this.remarksParams.groupAddition = data.groupAddition
  623. this.sourceStateText = this.sourceActionsFilters(data.customerSource)
  624. this.genderText = this.genderActionsFilters(data.customerGender)
  625. this.additiveText = this.additiveActionsFilters(data.groupAddition)
  626. }catch(error){
  627. console.log('=========>查询机构历史填写信息失败')
  628. }
  629. },
  630. async getPriorKeyword() {
  631. //查询优先展示标签
  632. try{
  633. const res = await this.UserService.getPriorKeyword()
  634. const data = res.data
  635. this.labelsList = data.map((el, index) => {
  636. el.isChecked = false
  637. return el
  638. })
  639. }catch(error){
  640. console.log('=========>获取优先展示标签列表失败')
  641. }
  642. },
  643. async getUserClubConsults() {
  644. //查询咨询类别
  645. try{
  646. const res = await this.UserService.getUserClubConsults()
  647. const data = res.data
  648. this.categorys = data.map((el, index) => {
  649. el.isChecked = false
  650. return el
  651. })
  652. }catch(error){
  653. console.log('=========>获取咨询类别列表失败')
  654. }
  655. },
  656. async editButtonConfim() {
  657. //保存资料备注
  658. if (this.isConfirmLoding) {
  659. return
  660. }
  661. if(this.current === 0){
  662. if (this.remarksParams.questionMan == '') {
  663. this.$util.msg('请输入咨询人姓名', 2000)
  664. return
  665. }
  666. if (this.remarksParams.consult == '') {
  667. this.$util.msg('请选择咨询类别', 2000)
  668. return
  669. }
  670. if (!this.remarksParams.pinceSensitve) {
  671. this.$util.msg('请选择价格敏感度', 2000)
  672. return
  673. }
  674. if (!this.remarksParams.satisfied) {
  675. this.$util.msg('请选择意向程度', 2000)
  676. return
  677. }
  678. if (!this.remarksParams.followup) {
  679. this.$util.msg('请选择跟进状态', 2000)
  680. return
  681. }
  682. }
  683. //统一处理静态标签
  684. let staticLabelsList = []
  685. this.staticLabelsList.forEach( el =>{
  686. if(el.label !== ''){
  687. staticLabelsList.push(el.label)
  688. }
  689. })
  690. console.log('staticLabelsList', staticLabelsList)
  691. //统一处理动态标签
  692. let trendsLabelsList = []
  693. this.trendsLabelsList.forEach( (el) =>{
  694. if(el.label !== ''){
  695. trendsLabelsList.push(el.label)
  696. }
  697. })
  698. console.log('trendsLabelsList', trendsLabelsList)
  699. // 标签必须有一项
  700. if (!this.firstLabelList.length && !trendsLabelsList.length && !staticLabelsList.length) {
  701. this.modal = true
  702. this.contentModalText = '标签必须选择或者填写一项'
  703. return
  704. }
  705. if(this.firstLabelList.length > 0){
  706. this.remarksParams.remarks = JSON.stringify(this.firstLabelList)
  707. }
  708. if(trendsLabelsList.length > 0){
  709. this.remarksParams.trendsKeyword = JSON.stringify(trendsLabelsList)
  710. }
  711. if(staticLabelsList.length > 0){
  712. this.remarksParams.stateKeyword = JSON.stringify(staticLabelsList)
  713. }
  714. console.log('remarksParams', this.remarksParams)
  715. this.isConfirmLoding = true
  716. this.getUserClubRemarksSave({ params: JSON.stringify(this.remarksParams) })
  717. },
  718. async getUserClubRemarksSave(params){
  719. try{
  720. await this.UserService.getUserClubRemarksSave(params)
  721. this.$util.msg('保存成功', 3000, true, 'success')
  722. this.isConfirmLoding = false
  723. setTimeout(() => {
  724. uni.navigateBack({
  725. delta: 1
  726. })
  727. }, 1000)
  728. }catch(error){
  729. this.$util.msg(error.msg, 2000)
  730. this.isConfirmLoding = false
  731. }
  732. },
  733. choiceCategorys(category, index) {
  734. // 选择类别
  735. category.isChecked = !category.isChecked
  736. if (category.isChecked) {
  737. if (!this.contains(this.checkedCategorysList, category.id)) {
  738. this.checkedCategorysList.push(category.id)
  739. }
  740. } else {
  741. this.checkedCategorysList.splice(this.checkedCategorysList.indexOf(category.id), 1)
  742. }
  743. this.remarksParams.consult = this.checkedCategorysList.join(',')
  744. },
  745. handleShowReportPopup() {
  746. // 显示报备弹窗
  747. if (this.isHashReport) {
  748. this.$util.msg('请取消已有关联后再重新关联报备', 2000)
  749. return
  750. }
  751. this.isReportpopup = true
  752. },
  753. handleShowGoodPopup() {
  754. // 显示添加商品弹窗
  755. this.isGoodspopup = true
  756. },
  757. handleClean() {
  758. //删除选择的商品
  759. this.remarksParams.productId === 0
  760. this.handleGoods = []
  761. },
  762. handleChoiceaGoodsData(data) {
  763. console.log('data', data)
  764. this.handleGoods = []
  765. this.remarksParams.productId = data.productId
  766. this.handleGoods.push(data)
  767. },
  768. handleChoiceaReportData(data) {
  769. console.log('data', data)
  770. this.reportText = data.reportText
  771. this.remarksParams.reportId = data.reportId
  772. },
  773. contains(arr, val) {
  774. // 校验
  775. return arr.some(item => item === val)
  776. },
  777. uploadFile(array) {
  778. //上传资质文件
  779. console.log(array)
  780. uploadFilePdfDocDocxXlsx()
  781. .then(res => {
  782. let data = JSON.parse(res.data).data
  783. let obj = {
  784. fileName: uni.getStorageSync('fileName'),
  785. ossName: data.ossName
  786. }
  787. array.push(obj)
  788. console.log('array', array)
  789. })
  790. .catch(err => {
  791. console.log(err)
  792. })
  793. },
  794. uploadPhotoFn(array) {
  795. //添加图片
  796. uploadFileImage().then(res => {
  797. array.push(JSON.parse(res.data).data)
  798. })
  799. },
  800. deleteFileFn(array, index) {
  801. console.log(array)
  802. //删除文件
  803. this.UploadService.PostFileDelete({
  804. ossName: array[index].ossName
  805. })
  806. .then(res => {
  807. array.splice(index, 1)
  808. })
  809. .catch(error => {
  810. console.log('删除文件异常提示===>', error.msg)
  811. })
  812. },
  813. deletePhotoFn(array, index) {
  814. //删除图片
  815. array.splice(index, 1)
  816. },
  817. previewImg(image, index) {
  818. //顶部商品图片预览
  819. isPreviewImg = true
  820. let previewUrls = image
  821. uni.previewImage({
  822. current: index, //图片索引
  823. urls: previewUrls, //必须是http图片,本地图片无效
  824. longPressActions: ''
  825. })
  826. },
  827. conInput(e) {
  828. //备注文字字数限制
  829. let value = e.detail.value
  830. let len = parseInt(value.length)
  831. if (len > this.max) return
  832. this.min = len
  833. if (this.min == 200) {
  834. this.$util.msg('您输入的字数已达上限', 2000)
  835. }
  836. },
  837. handleClickClunInfo() {
  838. //修改机构资料
  839. if (this.userInfo.userIdentity === 2) {
  840. this.$api.navigateTo(`/pages/seller/login/apply?userID=${this.userInfo.userId}`)
  841. } else if (this.userInfo.userIdentity === 4) {
  842. this.$api.navigateTo(`/pages/seller/login/information?userID=${this.userInfo.userId}`)
  843. }
  844. },
  845. handleClick() {
  846. this.modal = false
  847. },
  848. followupFilters(value) {
  849. // 订单来源
  850. const map = {
  851. 1: '跟进中',
  852. 2: '跟进完成',
  853. 3: '已放弃'
  854. }
  855. return map[value]
  856. },
  857. pinceFilters(value) {
  858. // 意向
  859. const map = {
  860. 1: '敏感',
  861. 2: '适中',
  862. 3: '不敏感',
  863. 4: '不明确'
  864. }
  865. return map[value]
  866. },
  867. intenActionsFilters(value) {
  868. // 意向
  869. const map = {
  870. 1: '意向强烈',
  871. 2: '意向一般',
  872. 3: '意向平淡',
  873. 4: '随便看看'
  874. }
  875. return map[value]
  876. },
  877. sourceActionsFilters(value) {
  878. // 客户来源
  879. const map = {
  880. 0: '搜素引擎',
  881. 1: '小程序',
  882. 2: '公众号',
  883. 3: '小红书',
  884. 4: '微博',
  885. 5: '搜狐',
  886. 7: '抖音',
  887. 8: '视频号',
  888. 9: '朋友推荐',
  889. 6: '其他',
  890. }
  891. return map[value]
  892. },
  893. genderActionsFilters(value) {
  894. // 客户性别
  895. const map = {
  896. 0: '男',
  897. 1: '女'
  898. }
  899. return map[value]
  900. },
  901. additiveActionsFilters(value) {
  902. // 加群情况
  903. const map = {
  904. 0: '已加群',
  905. 1: '未加群'
  906. }
  907. return map[value]
  908. },
  909. },
  910. onShow() {}
  911. }
  912. </script>
  913. <style lang="scss">
  914. page {
  915. height: auto;
  916. background: #ffffff;
  917. }
  918. .remarks-content-club {
  919. width: 100%;
  920. height: 288rpx;
  921. padding: 24rpx;
  922. box-sizing: border-box;
  923. border-bottom: 20rpx solid #f7f7f7;
  924. .content-club-le {
  925. width: 660rpx;
  926. float: left;
  927. .club-le-text {
  928. width: 100%;
  929. height: 60rpx;
  930. line-height: 60rpx;
  931. font-size: $font-size-28;
  932. color: #333333;
  933. .label {
  934. color: #999999;
  935. &.phone {
  936. margin-left: 48rpx;
  937. }
  938. }
  939. }
  940. }
  941. .content-club-ri {
  942. width: 40rpx;
  943. height: 160rpx;
  944. float: right;
  945. line-height: 160rpx;
  946. text-align: center;
  947. color: #b2b2b2;
  948. }
  949. }
  950. .remarks-content {
  951. width: 100%;
  952. height: auto;
  953. box-sizing: border-box;
  954. padding: 0 24rpx;
  955. padding-bottom: 160rpx;
  956. .list-view-title {
  957. width: 100%;
  958. height: auto;
  959. margin-bottom: 16rpx;
  960. margin-top: 40rpx;
  961. .list-view-h1 {
  962. line-height: 40rpx;
  963. font-size: $font-size-28;
  964. color: #333333;
  965. text-align: left;
  966. text {
  967. color: #ff2a2a;
  968. }
  969. }
  970. .list-view-p {
  971. line-height: 30rpx;
  972. color: #fea785;
  973. font-size: $font-size-20;
  974. }
  975. }
  976. .tui-remarks-content {
  977. width: 100%;
  978. height: auto;
  979. margin-bottom: 24rpx;
  980. .tui-remarks-goods-input {
  981. width: 100%;
  982. height: 180rpx;
  983. box-sizing: border-box;
  984. background-color: #f7f7f7;
  985. padding: 26rpx;
  986. border-radius: 6rpx;
  987. .input-add {
  988. width: 128rpx;
  989. height: 128rpx;
  990. line-height: 128rpx;
  991. float: left;
  992. text-align: center;
  993. box-sizing: border-box;
  994. border: 1px dashed #b2b2b2;
  995. border-radius: 6rpx;
  996. .iconfont {
  997. font-size: 44rpx;
  998. color: #b2b2b2;
  999. }
  1000. }
  1001. .input-text {
  1002. height: 128rpx;
  1003. box-sizing: border-box;
  1004. padding: 0 32rpx;
  1005. line-height: 128rpx;
  1006. text-align: left;
  1007. font-size: 26rpx;
  1008. color: #b2b2b2;
  1009. float: left;
  1010. }
  1011. }
  1012. .tui-remarks-showgoods {
  1013. width: 100%;
  1014. height: 180rpx;
  1015. box-sizing: border-box;
  1016. .tui-remarks-btn {
  1017. width: 90rpx;
  1018. height: 180rpx;
  1019. float: right;
  1020. .btn {
  1021. width: 100%;
  1022. height: 90rpx;
  1023. float: left;
  1024. line-height: 90rpx;
  1025. text-align: center;
  1026. font-size: 26rpx;
  1027. &.delete {
  1028. color: #f94b4b;
  1029. }
  1030. &.update {
  1031. color: #1890f9;
  1032. }
  1033. }
  1034. }
  1035. .tui-remarks-goods {
  1036. width: 612rpx;
  1037. height: 180rpx;
  1038. box-sizing: border-box;
  1039. background-color: #f7f7f7;
  1040. padding: 26rpx;
  1041. border-radius: 6rpx;
  1042. float: left;
  1043. .goods-image {
  1044. width: 128rpx;
  1045. height: 128rpx;
  1046. float: left;
  1047. image {
  1048. width: 128rpx;
  1049. height: 128rpx;
  1050. display: block;
  1051. border-radius: 4rpx;
  1052. }
  1053. }
  1054. .goods-main {
  1055. width: 432rpx;
  1056. height: 128rpx;
  1057. box-sizing: border-box;
  1058. padding-left: 32rpx;
  1059. float: right;
  1060. .name {
  1061. width: 100%;
  1062. height: 60rpx;
  1063. box-sizing: border-box;
  1064. line-height: 60rpx;
  1065. color: #333333;
  1066. text-overflow: ellipsis;
  1067. overflow: hidden;
  1068. display: -webkit-box;
  1069. -webkit-line-clamp: 1;
  1070. line-clamp: 1;
  1071. -webkit-box-orient: vertical;
  1072. font-size: 26rpx;
  1073. }
  1074. .shop {
  1075. line-height: 60rpx;
  1076. color: #999999;
  1077. font-size: 26rpx;
  1078. text-overflow: ellipsis;
  1079. overflow: hidden;
  1080. display: -webkit-box;
  1081. -webkit-line-clamp: 1;
  1082. line-clamp: 1;
  1083. -webkit-box-orient: vertical;
  1084. }
  1085. }
  1086. }
  1087. }
  1088. }
  1089. .list-view-radio {
  1090. width: 100%;
  1091. height: 90rpx;
  1092. box-sizing: border-box;
  1093. padding: 0 10rpx;
  1094. border: 1px solid #b2b2b2;
  1095. border-radius: 6rpx;
  1096. margin-bottom: 30rpx;
  1097. position: relative;
  1098. &.btn {
  1099. border: none;
  1100. margin-top: 40rpx;
  1101. }
  1102. .input {
  1103. width: 100%;
  1104. height: 90rpx;
  1105. line-height: 90rpx;
  1106. float: left;
  1107. box-sizing: border-box;
  1108. font-size: $font-size-24;
  1109. color: #333333;
  1110. padding: 0 10rpx;
  1111. padding-right: 90rpx;
  1112. }
  1113. .iconfont {
  1114. width: 50rpx;
  1115. height: 90rpx;
  1116. display: block;
  1117. line-height: 90rpx;
  1118. text-align: center;
  1119. font-size: 30rpx;
  1120. color: #999999;
  1121. position: absolute;
  1122. right: 0;
  1123. top: 0;
  1124. }
  1125. }
  1126. .list-view-list-main {
  1127. width: 100%;
  1128. height: auto;
  1129. box-sizing: border-box;
  1130. margin-bottom: 30rpx;
  1131. position: relative;
  1132. .list-label-list{
  1133. width: 100%;
  1134. height: auto;
  1135. box-sizing: border-box;
  1136. .list-label{
  1137. display: inline-block;
  1138. padding: 0 20rpx;
  1139. height: 48rpx;
  1140. line-height: 48rpx;
  1141. background: #F7F7F7;
  1142. text-align: center;
  1143. margin-right: 20rpx;
  1144. margin-bottom: 20rpx;
  1145. font-size: 26rpx;
  1146. color: #666666;
  1147. &.active{
  1148. background: #FEF6F3;
  1149. color: #FF5B00;
  1150. }
  1151. }
  1152. }
  1153. .list-view-list {
  1154. width: 100%;
  1155. height: 90rpx;
  1156. box-sizing: border-box;
  1157. margin-bottom: 30rpx;
  1158. .list-view-input {
  1159. width: 614rpx;
  1160. height: 90rpx;
  1161. float: left;
  1162. position: relative;
  1163. .input {
  1164. width: 614rpx;
  1165. height: 90rpx;
  1166. box-sizing: border-box;
  1167. padding: 0 20rpx;
  1168. border: 1px solid #b2b2b2;
  1169. border-radius: 6rpx;
  1170. font-size: $font-size-24;
  1171. color: #333333;
  1172. }
  1173. .list-view-assAction {
  1174. width: 614rpx;
  1175. min-height: 270rpx;
  1176. box-sizing: border-box;
  1177. padding: 10rpx 0;
  1178. background: rgba(255, 255, 255, 1);
  1179. box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.15);
  1180. border-radius: 6rpx;
  1181. position: absolute;
  1182. top: -288rpx;
  1183. left: 0;
  1184. z-index: 999;
  1185. overflow: hidden;
  1186. .tui-popup-scroll {
  1187. width: 100%;
  1188. height: 270rpx;
  1189. }
  1190. .ass-list {
  1191. width: 100%;
  1192. height: 90rpx;
  1193. box-sizing: border-box;
  1194. padding: 0 24rpx;
  1195. line-height: 90rpx;
  1196. font-size: $font-size-26;
  1197. color: #666666;
  1198. text-align: left;
  1199. border-bottom: 1px solid #e1e1e1;
  1200. &:last-child {
  1201. border-bottom: none;
  1202. }
  1203. }
  1204. }
  1205. }
  1206. .list-view-btn {
  1207. width: 88rpx;
  1208. height: 90rpx;
  1209. float: right;
  1210. text-align: center;
  1211. line-height: 90rpx;
  1212. .icon-zengjia {
  1213. color: #1890f9;
  1214. font-size: $font-size-48;
  1215. }
  1216. .icon-shanchu4 {
  1217. color: #ff5b00;
  1218. font-size: $font-size-48;
  1219. }
  1220. }
  1221. }
  1222. }
  1223. .remarks-category {
  1224. width: 100%;
  1225. float: left;
  1226. margin-bottom: 20rpx;
  1227. .label {
  1228. color: #666666;
  1229. font-size: 28rpx;
  1230. margin-right: 50rpx;
  1231. }
  1232. .checkbox-list {
  1233. height: 60rpx;
  1234. font-size: $font-size-28;
  1235. line-height: 60rpx;
  1236. border-radius: 10rpx;
  1237. margin-right: 20rpx;
  1238. margin-bottom: 10rpx;
  1239. box-sizing: border-box;
  1240. float: left;
  1241. .icon-yixuanze {
  1242. margin-right: 10rpx;
  1243. color: #ff5b00;
  1244. }
  1245. .icon-weixuanze {
  1246. margin-right: 10rpx;
  1247. color: #b2b2b2;
  1248. }
  1249. }
  1250. .item-text {
  1251. display: inline-block;
  1252. font-size: 26rpx;
  1253. color: #333333;
  1254. border-radius: 28rpx;
  1255. line-height: 50rpx;
  1256. }
  1257. }
  1258. .remarks-input {
  1259. width: 100%;
  1260. height: 90rpx;
  1261. padding: 0 16rpx;
  1262. margin: 20rpx 0 0 0;
  1263. border-radius: 6rpx;
  1264. position: relative;
  1265. border: 1px solid #b2b2b2;
  1266. box-sizing: border-box;
  1267. .input {
  1268. width: 100%;
  1269. height: 90rpx;
  1270. line-height: 90rpx;
  1271. font-size: $font-size-26;
  1272. color: $text-color;
  1273. z-index: 1;
  1274. }
  1275. }
  1276. .remarks-textarea {
  1277. width: 100%;
  1278. height: 226rpx;
  1279. padding: 16rpx;
  1280. margin: 20rpx 0 0 0;
  1281. border-radius: 6rpx;
  1282. position: relative;
  1283. border: 1px solid #b2b2b2;
  1284. box-sizing: border-box;
  1285. .textarea {
  1286. width: 100%;
  1287. height: 100%;
  1288. line-height: 36rpx;
  1289. font-size: $font-size-26;
  1290. color: $text-color;
  1291. z-index: 1;
  1292. }
  1293. .limit-text {
  1294. position: absolute;
  1295. right: 20rpx;
  1296. bottom: 16rpx;
  1297. line-height: 44rpx;
  1298. font-size: $font-size-24;
  1299. color: #b2b2b2;
  1300. }
  1301. }
  1302. .list-view {
  1303. width: 100%;
  1304. height: 40rpx;
  1305. margin-top: 20rpx;
  1306. .list-view-file {
  1307. width: 132rpx;
  1308. height: 44rpx;
  1309. line-height: 44rpx;
  1310. font-size: $font-size-20;
  1311. text-align: center;
  1312. color: #ffffff;
  1313. background-color: $color-system;
  1314. border-radius: 8rpx;
  1315. float: left;
  1316. margin-top: 10rpx;
  1317. }
  1318. .list-view-text {
  1319. width: 100%;
  1320. float: left;
  1321. .input {
  1322. width: 560rpx;
  1323. height: 44rpx;
  1324. box-sizing: border-box;
  1325. line-height: 44rpx;
  1326. color: #333333;
  1327. text-overflow: ellipsis;
  1328. overflow: hidden;
  1329. display: -webkit-box;
  1330. -webkit-line-clamp: 1;
  1331. line-clamp: 1;
  1332. -webkit-box-orient: vertical;
  1333. float: left;
  1334. }
  1335. .delbtn {
  1336. width: 96rpx;
  1337. height: 44rpx;
  1338. border-radius: 8rpx;
  1339. background-color: #fff2ec;
  1340. font-size: $font-size-24;
  1341. color: #ff5b00;
  1342. line-height: 44rpx;
  1343. text-align: center;
  1344. float: left;
  1345. }
  1346. }
  1347. }
  1348. .list-view-upload {
  1349. width: 100%;
  1350. height: auto;
  1351. .photo-item {
  1352. display: inline-block;
  1353. width: 112rpx;
  1354. height: 112rpx;
  1355. margin: 10rpx 0;
  1356. margin-right: 25rpx;
  1357. border-radius: 10rpx;
  1358. border: 1px solid #f5f5f5;
  1359. position: relative;
  1360. float: left;
  1361. &.add {
  1362. width: 112rpx;
  1363. height: 112rpx;
  1364. border-color: #b2b2b2;
  1365. text-align: center;
  1366. line-height: 112rpx;
  1367. margin-right: 0rpx;
  1368. .icon-jiahao {
  1369. font-size: $font-size-44;
  1370. color: #b2b2b2;
  1371. font-weight: bold;
  1372. }
  1373. }
  1374. .icon-iconfontguanbi {
  1375. width: 30rpx;
  1376. height: 30rpx;
  1377. border-radius: 50%;
  1378. display: block;
  1379. position: absolute;
  1380. right: -10rpx;
  1381. top: -10rpx;
  1382. background: #f94b4b;
  1383. text-align: center;
  1384. line-height: 30rpx;
  1385. color: #ffffff;
  1386. font-size: $font-size-22;
  1387. }
  1388. image {
  1389. width: 112rpx;
  1390. height: 112rpx;
  1391. border-radius: 10rpx;
  1392. }
  1393. }
  1394. .photo-list {
  1395. width: 100%;
  1396. height: 116rpx;
  1397. overflow: hidden;
  1398. white-space: nowrap;
  1399. display: flex;
  1400. align-items: flex-start;
  1401. }
  1402. }
  1403. }
  1404. .remarks-btn {
  1405. width: 100%;
  1406. padding-top: 20rpx;
  1407. position: fixed;
  1408. bottom: 0;
  1409. left: 0;
  1410. background-color: #ffffff;
  1411. z-index: 99;
  1412. .edit-button-canel {
  1413. width: 100%;
  1414. height: 88rpx;
  1415. line-height: 88rpx;
  1416. text-align: center;
  1417. color: #ff5b00;
  1418. font-size: $font-size-24;
  1419. }
  1420. .edit-button {
  1421. width: 600rpx;
  1422. height: 90rpx;
  1423. background: $btn-confirm;
  1424. line-height: 90rpx;
  1425. text-align: center;
  1426. color: #ffffff;
  1427. font-size: $font-size-30;
  1428. margin: 0 auto;
  1429. border-radius: 45rpx;
  1430. }
  1431. }
  1432. </style>