purchaseContractAdd.vue 63 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884
  1. <template>
  2. <div class="container">
  3. <el-row>
  4. <el-col :span="12">
  5. <h2 class="bg-left title">创建采购合同</h2>
  6. </el-col>
  7. <el-col :span="12" class="bg-right">
  8. <el-button class="bg-bottom" type="primary" size="small" @click="returnsales()"><img width="6" height="10"
  9. style="vertical-align: bottom; margin-right: 3px" src="../../../public/img/lujing.png" alt="" />返回
  10. </el-button>
  11. </el-col>
  12. </el-row>
  13. <ws-form ref="deptBudgetList" :rules="rules" :model="deptBudgetList">
  14. <div class="remark">
  15. <h3>基本信息</h3>
  16. <p style="color: #8890b1">
  17. 注:基本信息和货物信息均为必填项,“<span style="color:red">*</span>” 标记的条目提交后不可修改。
  18. </p>
  19. </div>
  20. <ws-info-table>
  21. <!--合同类型-->
  22. <!-- <ws-form-item
  23. label="合同类型"
  24. span="1"
  25. prop="agreementType"
  26. >
  27. <ws-select
  28. v-model="deptBudgetList.agreementType"
  29. placeholder
  30. class="deal"
  31. @change="selectType"
  32. >
  33. <ws-option
  34. v-for="item in agreementList"
  35. :key="item.constKey"
  36. :label="item.constValue"
  37. :value="item.constValue"
  38. />
  39. </ws-select>
  40. </ws-form-item> -->
  41. <ws-form-item label="合同类型" span="1" prop="agreementType" class="readonly">
  42. <el-radio v-model="deptBudgetList.agreementType" label="采购合同">采购合同</el-radio>
  43. <el-radio v-model="deptBudgetList.agreementType" label="补充协议">补充协议</el-radio>
  44. </ws-form-item>
  45. <!--关联合同-->
  46. <ws-form-item prop="agreementNo" label="关联合同" span="1" v-show="deptBudgetList.agreementType =='补充协议'">
  47. <ws-select v-model="deptBudgetList.agreementNo" placeholder="请选择编号" @change="selectRelation">
  48. <ws-option v-for="item in contractNoList" :key="item.id" :label="item.contractNo"
  49. :value="item.contractNo"></ws-option>
  50. </ws-select>
  51. </ws-form-item>
  52. <!-- 补充协议编号 -->
  53. <ws-form-item v-show="deptBudgetList.agreementType == '补充协议'" label="补充协议编号" span="1" prop="contractNo">
  54. <ws-input v-model="deptBudgetList.contractNo" placeholder="请输入补充协议编号" maxlength="100" size="small" />
  55. </ws-form-item>
  56. <!--运输方式-->
  57. <ws-form-item label="运输方式" span="1" prop="shippingType">
  58. <ws-input v-model="deptBudgetList.shippingType" placeholder="请输入运输方式" maxlength="100" size="small" />
  59. </ws-form-item>
  60. <!--合同编号-->
  61. <ws-form-item label="合同编号" span="1" prop="contractNo" class="readonly" required v-show="deptBudgetList.agreementType =='采购合同'">
  62. <ws-input v-model="deptBudgetList.contractNo" placeholder="请输入合同编号" maxlength="50" size="small" />
  63. </ws-form-item>
  64. <!--结算方式-->
  65. <ws-form-item label="结算方式" span="1" prop="settlementMethod">
  66. <ws-input v-model="deptBudgetList.settlementMethod" placeholder="请输入结算方式" maxlength="100" size="small" />
  67. </ws-form-item>
  68. <ws-form-item label="买方" span="1" prop="buyer" class="readonly">
  69. <!-- <ws-input v-model="deptBudgetList.buyer" placeholder="请输入买方名称" maxlength="100" size="small" /> -->
  70. <el-autocomplete class="inline-input" v-model="deptBudgetList.buyer" :fetch-suggestions="querySearch1"
  71. placeholder="请输入买方名称" @select="handleSelect"></el-autocomplete>
  72. </ws-form-item>
  73. <!--卖方-->
  74. <ws-form-item label="交货方式" span="1" prop="seller" class="readonly">
  75. <el-radio v-model="deptBudgetList.deliverType" label="1">我方自提</el-radio>
  76. <el-radio v-model="deptBudgetList.deliverType" label="2">对方送货</el-radio>
  77. </ws-form-item>
  78. <ws-form-item label="卖方" span="1" prop="seller" class="readonly">
  79. <!-- <ws-input v-model="deptBudgetList.seller" placeholder="请输入卖方名称" maxlength="100" size="small" /> -->
  80. <!-- <el-autocomplete class="inline-input" v-model="deptBudgetList.seller" :fetch-suggestions="querySearch2"
  81. @select="handleSelect"></el-autocomplete>
  82. -->
  83. <ws-select v-model="deptBudgetList.seller" placeholder="请选择卖方名称" class="typeselect"
  84. @change="sellerSelect">
  85. <ws-option v-for="item in customerinfo" :key="item.customerName" :label="item.customerName"
  86. :value="item.customerName" />
  87. </ws-select>
  88. </ws-form-item>
  89. <!--包装方式-->
  90. <ws-form-item label="包装方式" span="1" prop="packingMethod">
  91. <ws-select v-model="deptBudgetList.packingMethod" placeholder="" class="typeselect" :value="value1"
  92. @change="selectpackingMethod">
  93. <ws-option v-for="item in packtypeList" :key="item.constKey" :label="item.constValue"
  94. :value="item.constValue" />
  95. </ws-select>
  96. </ws-form-item>
  97. <!--买方电话-->
  98. <ws-form-item label="买方电话" span="1" prop="contractNo">
  99. <!-- <ws-input v-model.number="deptBudgetList.buyerPhone" placeholder="请输入买方电话" maxlength="100" size="small" /> -->
  100. <el-autocomplete class="inline-input" v-model="deptBudgetList.buyerPhone" :fetch-suggestions="querySearch3"
  101. placeholder="请输入买方电话" @select="handleSelect"></el-autocomplete>
  102. </ws-form-item>
  103. <!--验收方式-->
  104. <ws-form-item label="验收方式" span="1" prop="acceptanceMethod">
  105. <el-select v-model="deptBudgetList.acceptanceMethod" placeholder="请选择验收方式" style="width: 100%" filterable
  106. @change="selectunitList">
  107. <el-option v-for="(item, index) in unitList" :key="item.constValue" :label="item.constValue"
  108. :value="item.constValue">
  109. <span class="unit-left" style="float: left">
  110. <span v-if="item.flag == 'delete'"> {{ item.constValue }}</span>
  111. <!-- 新增文本框 -->
  112. <div style="width: 160px" v-if="item.flag !== 'delete'" @click.stop>
  113. <ws-input v-model="item.constValue" clearable maxlength="10" style="width: 100%"></ws-input>
  114. </div>
  115. </span>
  116. <span style="float: right; color: #8492a6; font-size: 13px">
  117. <!-- 对号 -->
  118. <i class="el-icon-check" style="line-height: 29px; margin-left: 10px" v-if="item.flag !== 'delete'"
  119. @click.stop="saveClick(item, index)"></i>
  120. <!-- 编辑 -->
  121. <i class="el-icon-edit" style="line-height: 29px; margin-left: 10px" v-if="item.flag == 'delete'"
  122. @click.stop="editClick(item, index)"></i>
  123. <!-- 删除 -->
  124. <i class="el-icon-delete" style="line-height: 29px" @click.stop="deleteClick(item, index)"></i>
  125. </span>
  126. </el-option>
  127. <!-- 新增按钮 -->
  128. <el-option value="" label="">
  129. <div style="
  130. text-align: right;
  131. border-top: 1px solid #dcdfe6;
  132. padding: 5px;
  133. ">
  134. <ws-button type="primary" @click.stop="addClick">{{
  135. $t('button.add')
  136. }}</ws-button>
  137. </div>
  138. </el-option>
  139. </el-select>
  140. </ws-form-item>
  141. <!--卖方电话-->
  142. <ws-form-item label="卖方电话" span="1" prop="sellerPhone">
  143. <!-- <ws-input v-model="deptBudgetList.sellerPhone" placeholder="请输入卖方电话" maxlength="100" size="small" /> -->
  144. <el-autocomplete class="inline-input" v-model="deptBudgetList.sellerPhone" :fetch-suggestions="querySearch4"
  145. placeholder="请输入卖方电话" @select="handleSelect"></el-autocomplete>
  146. </ws-form-item>
  147. <!--重量(吨)-->
  148. <ws-form-item label="重量(吨)" span="1" prop="weight">
  149. <ws-input @input="weightchange" v-model="deptBudgetList.weight" placeholder="请输入重量(吨)" maxlength="100"
  150. size="small" />
  151. </ws-form-item>
  152. <!--交货日期(起)-->
  153. <ws-form-item label="交货日期(起)" span="1" prop="deliveryDateStart">
  154. <ws-date-picker v-model="deptBudgetList.deliveryDateStart" type="date" placeholder="请选择交货日期(起)"
  155. value-format="yyyy-MM-dd" />
  156. </ws-form-item>
  157. <!--溢短装(%)-->
  158. <ws-form-item label="溢短装(%)" span="1" prop="overShort">
  159. <ws-input v-model="deptBudgetList.overShort" placeholder="请输入溢短装比例(%)" maxlength="100" size="small" />
  160. </ws-form-item>
  161. <!--交货日期(止)-->
  162. <ws-form-item label="交货日期(止)" span="1" prop="deliveryDateEnd">
  163. <ws-date-picker v-model="deptBudgetList.deliveryDateEnd" type="date" placeholder="请选择交货日期(止)"
  164. value-format="yyyy-MM-dd" />
  165. </ws-form-item>
  166. <!--合同单价(元/吨)-->
  167. <ws-form-item class="readonly" label="合同单价(元/吨)" span="1" prop="unitContractPrice">
  168. <ws-input @input="pricechange" v-model="deptBudgetList.unitContractPrice" placeholder="请输入合同单价"
  169. maxlength="100" size="small" />
  170. </ws-form-item>
  171. <!--合同总价-->
  172. <ws-form-item label="合同总价" span="1" prop="totalContractPrice">
  173. <ws-input v-model="deptBudgetList.totalContractPrice" placeholder="请输入合同总价" maxlength="100" size="small" />
  174. </ws-form-item>
  175. <!--签订日期-->
  176. <ws-form-item label="签订日期" span="1" prop="signingDate" v-show="deptBudgetList.agreementType =='采购合同'">
  177. <ws-date-picker v-model="deptBudgetList.signingDate" type="date" placeholder="请选择合同签订日期"
  178. value-format="yyyy-MM-dd" />
  179. </ws-form-item>
  180. <ws-form-item label="货源所在地区" span="1" prop="sourceGoods">
  181. <!-- <el-cascader
  182. :options="options_"
  183. v-model="selectedOptions"
  184. clearable
  185. size="large"
  186. placeholder="请选择货源所在地区"
  187. style="width: 200%"
  188. @change="handleChange"
  189. /> -->
  190. <el-button @click="mapInputClick('source')" class='address-btn'>
  191. {{newSelectedOptions}}
  192. </el-button>
  193. </ws-form-item>
  194. <ws-form-item label="货源详细地址" span="1" prop="sourceGoods">
  195. <ws-input v-model="deptBudgetList.sourceGoods" placeholder="请输入货源详细地址" maxlength="20" size="small" />
  196. </ws-form-item>
  197. <ws-form-item label="交货所在地区" span="1" prop="sourceGoods">
  198. <!-- <el-cascader
  199. :options="options_"
  200. v-model="selectedOptions1"
  201. clearable
  202. size="large"
  203. placeholder="请选择交货所在地区"
  204. style="width: 200%"
  205. @change="handleChange1"
  206. /> -->
  207. <el-button @click="mapInputClick('deliveryProv')" class='address-btn'>
  208. {{newSelectedOptions1}}
  209. </el-button>
  210. </ws-form-item>
  211. <ws-form-item label="交货详细地址" span="1" prop="placeDelivery">
  212. <ws-input v-model="deptBudgetList.placeDelivery" placeholder="请输入交货详细地址" maxlength="20" size="small" />
  213. </ws-form-item>
  214. <!--签订日期-->
  215. <ws-form-item label="签订日期" span="1" prop="signingDate" v-show="deptBudgetList.agreementType =='补充协议'">
  216. <ws-date-picker v-model="deptBudgetList.signingDate" type="date" placeholder="请选择合同签订日期"
  217. value-format="yyyy-MM-dd" />
  218. </ws-form-item>
  219. <ws-form-item label="最终实际成交量(吨)" span="1" prop="finalTradingVolume">
  220. <ws-input v-model="deptBudgetList.finalTradingVolume" placeholder="请输入最终实际成交量" maxlength="100" size="small" />
  221. </ws-form-item>
  222. <ws-form-item label="结算重量方式" span="1" prop="settlementWeightMethod" class="readonly"
  223. v-if="deptBudgetList.deliverType==1">
  224. <el-radio v-model="deptBudgetList.settlementWeightMethod" label="1">按出库重量结算</el-radio>
  225. <el-radio v-model="deptBudgetList.settlementWeightMethod" label="2">按入库重量结算</el-radio>
  226. </ws-form-item>
  227. <ws-form-item v-show="deptBudgetList.deliverType == 1" label="临时仓库负责人" span="1" prop="packingMethod">
  228. <el-select v-model="deptBudgetList.personCharge" placeholder="请选择临时仓库负责人" filterable clearable
  229. @change="selectstaff">
  230. <el-option v-for="item in options" :key="item.value" :label="item.staffName" :value="item.staffName" />
  231. </el-select>
  232. </ws-form-item>
  233. </ws-info-table>
  234. <div class="wenzi">
  235. <h3>货物信息</h3>
  236. </div>
  237. <!--货物信息-->
  238. <ws-info-table>
  239. <!--货名-->
  240. <ws-form-item label="货名" span="1" prop="goodsName" class="readonly">
  241. <ws-select v-model="deptBudgetList.contractGoodsInfo.goodsName" placeholder="" class="typeselect"
  242. @change="selectgoodsName">
  243. <ws-option v-for="item in goodnameList" :key="item.constKey" :label="item.constValue"
  244. :value="item.constValue" />
  245. </ws-select>
  246. </ws-form-item>
  247. <!--水分(%)<=-->
  248. <ws-form-item label="水分(%)<=" span="1" prop="waterContent">
  249. <ws-input v-model="deptBudgetList.contractGoodsInfo.waterContent" placeholder="请输入水分占比" maxlength="100"
  250. size="small" />
  251. </ws-form-item>
  252. <!--品级-->
  253. <ws-form-item label="品级" span="1" prop="grade">
  254. <ws-select v-model="deptBudgetList.contractGoodsInfo.grade" placeholder="" class="typeselect"
  255. @change="selectgrade">
  256. <ws-option v-for="item in gradeList" :key="item.constKey" :label="item.constValue"
  257. :value="item.constValue" />
  258. </ws-select>
  259. </ws-form-item>
  260. <!--杂质(%)<=-->
  261. <ws-form-item label="杂质(%)<=" span="1" prop="impurity">
  262. <ws-input v-model="deptBudgetList.contractGoodsInfo.impurity" placeholder="请输入杂质占比(%)" maxlength="100"
  263. size="small" />
  264. </ws-form-item>
  265. <!--容重(克/升)>=-->
  266. <ws-form-item label="容重(克/升)>=" span="1" prop="bulkDensity">
  267. <ws-input v-model="deptBudgetList.contractGoodsInfo.bulkDensity" placeholder="请输入容重" maxlength="100"
  268. size="small" />
  269. </ws-form-item>
  270. <!--霉变粒(%)<=-->
  271. <ws-form-item label="霉变粒(%)<=" span="1" prop="mildewGrain">
  272. <ws-input v-model="deptBudgetList.contractGoodsInfo.mildewGrain" placeholder="请输入霉变粒占比(%)" maxlength="100"
  273. size="small" />
  274. </ws-form-item>
  275. <!--热损伤(%)<=-->
  276. <ws-form-item label="热损伤(%)<=" span="1" prop="jiaorenli">
  277. <ws-input v-model="deptBudgetList.contractGoodsInfo.jiaorenli" placeholder="请输入输入热损伤占比(%)" maxlength="100"
  278. size="small" />
  279. </ws-form-item>
  280. <!--不完善粒(%)<=-->
  281. <ws-form-item label="不完善粒(%)<=" span="1" prop="imperfectGrain">
  282. <ws-input v-model="deptBudgetList.contractGoodsInfo.imperfectGrain" placeholder="请输入不完善粒占比(%)" maxlength="100"
  283. size="small" />
  284. </ws-form-item>
  285. </ws-info-table>
  286. <div class="wenzi">
  287. <h3>流程信息</h3>
  288. </div>
  289. <!--流程信息-->
  290. <ws-info-table>
  291. <!--已付款(元)-->
  292. <ws-form-item label="已付款(元)" span="1" prop="mildewGrain">
  293. <ws-input v-model="deptBudgetList.contractProcessInfo.mildewGrain" placeholder="请输入已付款(元)" maxlength="100"
  294. size="small" />
  295. </ws-form-item>
  296. <!--已开发票(元)-->
  297. <ws-form-item label="已开发票(元)" span="1" prop="goodsName">
  298. <ws-input v-model="deptBudgetList.contractProcessInfo.goodsName" placeholder="请输入已开发票(元)" maxlength="100"
  299. size="small" />
  300. </ws-form-item>
  301. <!--费用支出(元)-->
  302. <ws-form-item label="费用支出(元)" span="1" prop="waterContent">
  303. <ws-input v-model="deptBudgetList.contractProcessInfo.waterContent" placeholder="请输入费用支出(元)" maxlength="100"
  304. size="small" />
  305. </ws-form-item>
  306. <!--未开发票(元)-->
  307. <ws-form-item label="未开发票(元)" span="1" prop="impurity">
  308. <ws-input v-model="deptBudgetList.contractProcessInfo.impurity" placeholder="请输入未开发票(元)" maxlength="100"
  309. size="small" />
  310. </ws-form-item>
  311. <!--双章原件回收情况-->
  312. <ws-form-item label="双章原件回收情况" span="1" prop="grade">
  313. <ws-select v-model="deptBudgetList.contractProcessInfo.grade" placeholder="" class="typeselect"
  314. @change="selectChapterTwo">
  315. <ws-option v-for="item in ChapterTwoList" :key="item.constKey" :label="item.constValue"
  316. :value="item.constValue" />
  317. </ws-select>
  318. </ws-form-item>
  319. <!--已完成发货量(吨)-->
  320. <ws-form-item label="已完成发货量(吨)" span="1" prop="imperfectGrain">
  321. <ws-input v-model="deptBudgetList.contractProcessInfo.imperfectGrain" placeholder="请输入已完成发货量(吨)"
  322. maxlength="100" size="small" />
  323. </ws-form-item>
  324. </ws-info-table>
  325. <div class="wenzi">
  326. <h3>备注信息</h3>
  327. </div>
  328. <!--备注信息-->
  329. <ws-input v-model="deptBudgetList.remarks" type="textarea" row="3" placeholder="请输入备注信息,不超过3000字"
  330. maxlength="3000" />
  331. <ws-upload ref="upload" :comp-id="compId" :appendix-ids="deptBudgetList.addressUrl" :size-limit="size"
  332. @onChange="onChange" accept=".jpg, .jpeg, .png, .pdf, .doc, .zip, .rar"
  333. v-hasPermission="`contractManagement.buyContract.buyContractInfo.appl`" />
  334. </ws-form>
  335. <div v-if="dialogVisible" class="map">
  336. <map-drag @marker="marker" :isShowaddress='true' v-on:addressListen='getAddress' :type="type"></map-drag>
  337. </div>
  338. <div style="text-align: right; padding: 10px" class="center">
  339. <el-button class="bg-bottom" type="primary" size="small" @click="submit(deptBudgetList)">提交</el-button>
  340. </div>
  341. </div>
  342. </template>
  343. <script>
  344. import {
  345. packList,
  346. addList,
  347. xiala,
  348. addxiala,
  349. editxiala,
  350. delxiala,
  351. getstafffind,
  352. getRelationContractNo,
  353. getcustomerinfo
  354. } from '@/model/contarct/index'
  355. import {
  356. regionData,
  357. CodeToText,
  358. TextToCode
  359. } from 'element-china-area-data'
  360. import {
  361. dayjs,
  362. fmoney,
  363. EventBus
  364. } from 'base-core-lib'
  365. import WsUpload from '@/components/WsUpload'
  366. import mapDrag from '@/components/mapdrag/mapdrag'
  367. export default {
  368. name: 'viewSpareMoney',
  369. components: {
  370. WsUpload,
  371. mapDrag,
  372. },
  373. watch: {
  374. vesselId(val) {
  375. this.getVesselData()
  376. },
  377. isShow(val) {
  378. this.showType = val
  379. },
  380. },
  381. data() {
  382. return {
  383. restaurants1: [],
  384. restaurants2: [],
  385. restaurants3: [],
  386. restaurants4: [],
  387. customerinfo:[],
  388. type: '',
  389. dialogVisible: false,
  390. //弹出框
  391. dialogViewSpareMoney: false,
  392. dialogApproveFormVisible: false,
  393. // 船舶类型
  394. monetaryKey: null,
  395. // 表格显示数据
  396. tableDate: [],
  397. // 是否显示
  398. showType: true,
  399. // 年
  400. year: '',
  401. options_: regionData,
  402. selectedOptions: [],
  403. newSelectedOptions: '请选择货源所在地',
  404. selectedOptions1: [],
  405. newSelectedOptions1: '请选择交货所在地区',
  406. // 提交类型
  407. submitType: true,
  408. tableData: [{
  409. date: '',
  410. name: '',
  411. address: ''
  412. }],
  413. packtypeList: [],
  414. compId: localStorage.getItem('ws-pf_compId'),
  415. rules: {
  416. // contractNo: [
  417. // { required: true, message: '请输入合同编号', trigger: 'blur' },
  418. // { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' },
  419. // ],
  420. },
  421. options: [],
  422. staffList: [],
  423. appendixIdsAdd: '',
  424. size: 10,
  425. unitList: [],
  426. agreementList: [{
  427. constValue: '采购合同',
  428. constKey: '1'
  429. },
  430. {
  431. constValue: '补充协议',
  432. constKey: '2'
  433. },
  434. ],
  435. contractNoList: [],
  436. goodnameList: [],
  437. value1: '袋装',
  438. value2: '未回收',
  439. gradeList: [],
  440. ChapterTwoList: [],
  441. agreementType: '',
  442. deptBudgetList: {
  443. deliverType: '1',
  444. agreementType: '采购合同',
  445. addressUrl: '',
  446. sellerPhone:'',
  447. finalTradingVolume: 0,
  448. totalContractPrice: 0,
  449. contractGoodsInfo: {
  450. goodsName: '',
  451. },
  452. contractProcessInfo: {},
  453. sourceGoods: '',
  454. placeDelivery: '',
  455. settlementWeightMethod: '1',
  456. },
  457. acceptanceCheck: {},
  458. pickerBeginDateBefore: {
  459. disabledDate: (time) => {
  460. return time.getTime() > Date.now()
  461. },
  462. },
  463. ruleDeptBudget: {
  464. contractNo: [{
  465. required: true,
  466. message: '请输入活动名称',
  467. trigger: 'blur'
  468. },
  469. {
  470. min: 6,
  471. max: 50,
  472. message: '长度在 6 到 50 个字符',
  473. trigger: 'blur',
  474. },
  475. ],
  476. },
  477. selectIntendedShip: {},
  478. interviewTypeList: {},
  479. }
  480. },
  481. activated() {
  482. this.selectedOptions = []
  483. this.selectedOptions1 = []
  484. this.newSelectedOptions = '请选择货源所在地'
  485. this.newSelectedOptions1 = '请选择交货所在地'
  486. this.deptBudgetList.packingMethod = '散装'
  487. this.deptBudgetList.packingMethodKey = 1
  488. this.deptBudgetList.contractGoodsInfo.goodsName = '玉米'
  489. this.deptBudgetList.contractGoodsInfo.goodsNameKey = 1
  490. this.deptBudgetList.contractProcessInfo.grade = '未回收'
  491. this.deptBudgetList.contractProcessInfo.gradeKey = 1
  492. this.deptBudgetList.contractGoodsInfo.grade = '一等品'
  493. this.deptBudgetList.contractGoodsInfo.gradeKey = 1
  494. getstafffind({
  495. roles: 'd6a5c8a52da544309259f91f75de1ec6'
  496. })
  497. .toPromise()
  498. .then((response) => {
  499. this.options = response
  500. this.staffList = response
  501. })
  502. this.loaddata()
  503. this.showType = this.isShow
  504. },
  505. mounted() {
  506. this.restaurants1 = JSON.parse(localStorage.getItem('deptBudgetList_data1'));
  507. this.restaurants2 = JSON.parse(localStorage.getItem('deptBudgetList_data2'));
  508. this.restaurants3 = JSON.parse(localStorage.getItem('deptBudgetList_data3'));
  509. this.restaurants4 = JSON.parse(localStorage.getItem('deptBudgetList_data4'));
  510. if (!this.restaurants1) this.restaurants1 = [];
  511. if (!this.restaurants2) this.restaurants2 = [];
  512. if (!this.restaurants3) this.restaurants3 = [];
  513. if (!this.restaurants4) this.restaurants4 = [];
  514. },
  515. methods: {
  516. querySearch1(queryString, cb) {
  517. var restaurants1 = this.restaurants1;
  518. var results = queryString ? restaurants1.filter(this.createFilter(queryString)) : restaurants1;
  519. // 调用 callback 返回建议列表的数据
  520. cb(results);
  521. },
  522. querySearch2(queryString, cb) {
  523. var restaurants2 = this.restaurants2;
  524. var results = queryString ? restaurants2.filter(this.createFilter(queryString)) : restaurants2;
  525. // 调用 callback 返回建议列表的数据
  526. cb(results);
  527. },
  528. querySearch3(queryString, cb) {
  529. var restaurants3 = this.restaurants3;
  530. var results = queryString ? restaurants3.filter(this.createFilter(queryString)) : restaurants3;
  531. // 调用 callback 返回建议列表的数据
  532. cb(results);
  533. },
  534. querySearch4(queryString, cb) {
  535. var restaurants4 = this.restaurants4;
  536. var results = queryString ? restaurants4.filter(this.createFilter(queryString)) : restaurants4;
  537. // 调用 callback 返回建议列表的数据
  538. cb(results);
  539. },
  540. createFilter(queryString) {
  541. return (restaurant) => {
  542. return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
  543. };
  544. },
  545. handleSelect(item) {
  546. console.log(item);
  547. },
  548. sellerSelect(item) {
  549. console.log(item)
  550. for (let i = 0; i < this.customerinfo.length; i++) {
  551. console.log(this.customerinfo[i].customerName,item)
  552. if(this.customerinfo[i].customerName==item){
  553. this.deptBudgetList.sellerPhone=this.customerinfo[i].customerPhone
  554. }
  555. }
  556. },
  557. getAddress(data) {
  558. console.log('getAddress', data)
  559. if (data[4] == 'source') {
  560. this.newSelectedOptions = data[0] + '/' + data[1] + '/' + data[2]
  561. this.deptBudgetList.sourceProvince = data[0]
  562. this.deptBudgetList.sourceCity = data[1]
  563. this.deptBudgetList.sourceArea = data[2]
  564. this.deptBudgetList.sourceGoods = data[3]
  565. } else {
  566. this.newSelectedOptions1 = data[0] + '/' + data[1] + '/' + data[2]
  567. this.deptBudgetList.deliveryProvince = data[0]
  568. this.deptBudgetList.deliveryCity = data[1]
  569. this.deptBudgetList.deliveryArea = data[2]
  570. this.deptBudgetList.placeDelivery = data[3]
  571. }
  572. },
  573. mapInputClick(type) {
  574. this.dialogVisible = true
  575. this.type = type
  576. },
  577. marker: function(item) {
  578. this.deptBudgetList.warehousePositioning =
  579. item.lnglat.lat + ',' + item.lnglat.lng
  580. },
  581. selectedAddress(e) {
  582. this.deptBudgetList.warehousePositioning =
  583. e.center.lat + ',' + e.center.lng
  584. },
  585. provinceChange(e) {
  586. console.log(CodeToText[e])
  587. },
  588. blurMap() {
  589. this.dialogVisible = false
  590. },
  591. focusMap() {
  592. this.dialogVisible = true
  593. },
  594. dataFilter(val) {
  595. this.deptBudgetList.personCharge = val
  596. if (val) {
  597. //val存在
  598. this.options = this.staffList.filter((item) => {
  599. if (
  600. !!~item.staffName.indexOf(val) ||
  601. !!~item.staffName.toUpperCase().indexOf(val.toUpperCase())
  602. ) {
  603. return true
  604. }
  605. })
  606. } else {
  607. //val为空时,还原数组
  608. this.options = this.staffList
  609. }
  610. },
  611. selectstaff(e) {
  612. for (var i = 0; i < this.staffList.length; i++) {
  613. if (this.staffList[i].staffName == e) {
  614. this.deptBudgetList.personPhone = this.staffList[i].staffMobilePhone
  615. this.deptBudgetList.personChargeKey = this.staffList[i].staffId
  616. }
  617. }
  618. },
  619. // 关闭 dialog时 处理文件url 初始化upload组件
  620. handleClose() {
  621. this.dialogViewSpareMoney = false
  622. },
  623. handleChange(value) {
  624. this.selectedOptions = value
  625. },
  626. handleChange1(value) {
  627. this.selectedOptions1 = value
  628. },
  629. weightchange(e) {
  630. this.deptBudgetList.finalTradingVolume = e
  631. },
  632. pricechange(e) {
  633. this.deptBudgetList.totalContractPrice = e * this.deptBudgetList.weight
  634. },
  635. returnsales() {
  636. this.deptBudgetList = {
  637. deliverType: '1',
  638. agreementType: '采购合同',
  639. finalTradingVolume: 0,
  640. totalContractPrice: 0,
  641. contractGoodsInfo: {
  642. goodsName: '',
  643. },
  644. contractProcessInfo: {},
  645. addressUrl: '',
  646. }
  647. this.$router.push({
  648. path: 'buyContract'
  649. })
  650. },
  651. loaddata() {
  652. // 包装方式
  653. packList({
  654. constId: 'CON1'
  655. })
  656. .toPromise()
  657. .then((response) => {
  658. this.packtypeList = response
  659. })
  660. // 验收方式
  661. this.getUnitList()
  662. // 货名
  663. packList({
  664. constId: 'CON2'
  665. })
  666. .toPromise()
  667. .then((response) => {
  668. this.goodnameList = response
  669. })
  670. // 品级
  671. packList({
  672. constId: 'CON3'
  673. })
  674. .toPromise()
  675. .then((response) => {
  676. this.gradeList = response
  677. })
  678. // 双章
  679. packList({
  680. constId: 'CON4'
  681. })
  682. .toPromise()
  683. .then((response) => {
  684. this.ChapterTwoList = response
  685. })
  686. //关联合同
  687. getRelationContractNo({
  688. agreementType: '采购合同',
  689. goodsType: 1
  690. })
  691. .toPromise()
  692. .then((response) => {
  693. this.contractNoList = response
  694. })
  695. getcustomerinfo({compId: localStorage.getItem('ws-pf_compId'),}).toPromise()
  696. .then((response) => {
  697. var arr=[]
  698. for (let i = 0; i < response.length; i++) {
  699. if(response[i].customerType=='个人客户'){
  700. arr.push({customerName:response[i].customerName,customerPhone:response[i].customerPhone})
  701. }else{
  702. arr.push({customerName:response[i].compName,customerPhone:response[i].customerPhone})
  703. }
  704. }
  705. this.customerinfo = arr
  706. })
  707. },
  708. selectRelation(e) {
  709. // console.log(this.contractNoList)
  710. // debugger
  711. for (var i = 0; i < this.contractNoList.length; i++) {
  712. if (this.contractNoList[i].contractNo == e) {
  713. this.deptBudgetList = this.contractNoList[i]
  714. this.deptBudgetList.agreementNo = this.contractNoList[i].contractNo
  715. this.deptBudgetList.contractNo = this.contractNoList[i].contractNo
  716. this.deptBudgetList.agreementType = '补充协议'
  717. this.newSelectedOptions = this.contractNoList[i].sourceProvince + this.contractNoList[i].sourceCity + this
  718. .contractNoList[i].sourceArea
  719. this.deptBudgetList.sourceGoods = this.contractNoList[i].sourceGoods
  720. this.newSelectedOptions1 = this.contractNoList[i].deliveryProvince + this.contractNoList[i].deliveryCity +
  721. this.contractNoList[i].deliveryArea
  722. this.deptBudgetList.placeDelivery = this.contractNoList[i].placeDelivery
  723. }
  724. }
  725. },
  726. onChange() {
  727. this.$refs.upload
  728. .handleSaveBill()
  729. .then(async response => {
  730. this.deptBudgetList.addressUrl = response
  731. })
  732. .catch(res => {
  733. EventBus.$emit('error', (JSON.parse(res) || {}).message)
  734. this.$refs.upload.clearFiles()
  735. })
  736. },
  737. getUnitList() {
  738. xiala({
  739. compId: localStorage.getItem('ws-pf_compId'),
  740. constCode: 'TYPEYAN',
  741. })
  742. .toPromise()
  743. .then((response) => {
  744. this.unitList = response
  745. let currItem
  746. this.unitList.forEach((item, index, arr) => {
  747. item.flag = 'delete'
  748. if (this.vModel == item.constKey) {
  749. currItem = item
  750. }
  751. })
  752. //
  753. if (currItem) {
  754. this.selectContract(currItem.constValue)
  755. }
  756. })
  757. },
  758. submit() {
  759. if (!this.deptBudgetList.contractNo) {
  760. this.$message({
  761. message: '合同编号不能为空',
  762. type: 'warning',
  763. })
  764. return
  765. }
  766. if (
  767. this.deptBudgetList.contractNo.length < 6 ||
  768. this.deptBudgetList.contractNo.length > 50
  769. ) {
  770. this.$message({
  771. message: '合同编号长度不符合要求,请输入6到50个字符之内!',
  772. type: 'warning',
  773. })
  774. return
  775. }
  776. if (!this.deptBudgetList.shippingType) {
  777. this.$message({
  778. message: '运输方式不能为空',
  779. type: 'warning',
  780. })
  781. return
  782. }
  783. if (
  784. this.deptBudgetList.shippingType.length < 1 ||
  785. this.deptBudgetList.shippingType.length > 20
  786. ) {
  787. this.$message({
  788. message: '运输方式长度不符合要求,请输入1到20个字符之内!',
  789. type: 'warning',
  790. })
  791. return
  792. }
  793. if (!this.deptBudgetList.buyer) {
  794. this.$message({
  795. message: '买方名称不能为空',
  796. type: 'warning',
  797. })
  798. return
  799. }
  800. if (this.deptBudgetList.buyer.length > 30) {
  801. this.$message({
  802. message: '买方名称长度不符合要求,请输入30个字符之内!',
  803. type: 'warning',
  804. })
  805. return
  806. }
  807. if (!this.deptBudgetList.settlementMethod) {
  808. this.$message({
  809. message: '结算方式不能为空',
  810. type: 'warning',
  811. })
  812. return
  813. }
  814. if (
  815. this.deptBudgetList.settlementMethod.length < 1 ||
  816. this.deptBudgetList.settlementMethod.length > 20
  817. ) {
  818. this.$message({
  819. message: '结算方式长度不符合要求,请输入1到20个字符之内!',
  820. type: 'warning',
  821. })
  822. return
  823. }
  824. if (!this.deptBudgetList.seller) {
  825. this.$message({
  826. message: '请输入卖方名称!',
  827. type: 'warning',
  828. })
  829. return
  830. }
  831. if (this.deptBudgetList.seller.length > 30) {
  832. this.$message({
  833. message: '卖方名称长度不符合要求,请输入30个字符之内!',
  834. type: 'warning',
  835. })
  836. return
  837. }
  838. if (!this.deptBudgetList.buyerPhone) {
  839. this.$message({
  840. message: '请输入买方电话!',
  841. type: 'warning',
  842. })
  843. return
  844. }
  845. if (isNaN(this.deptBudgetList.buyerPhone)) {
  846. this.$message({
  847. message: '输入买方电话有误!',
  848. type: 'warning',
  849. })
  850. return
  851. }
  852. if (
  853. this.deptBudgetList.buyerPhone.length < 7 ||
  854. this.deptBudgetList.buyerPhone.length > 20
  855. ) {
  856. this.$message({
  857. message: '买方电话长度不符合要求,请输入7到20个字符之内!',
  858. type: 'warning',
  859. })
  860. return
  861. }
  862. if (!this.deptBudgetList.sellerPhone) {
  863. this.$message({
  864. message: '请输入卖方电话!',
  865. type: 'warning',
  866. })
  867. return
  868. }
  869. if (isNaN(this.deptBudgetList.sellerPhone)) {
  870. this.$message({
  871. message: '输入卖方电话有误!',
  872. type: 'warning',
  873. })
  874. return
  875. }
  876. if (
  877. this.deptBudgetList.sellerPhone.length < 7 ||
  878. this.deptBudgetList.sellerPhone.length > 20
  879. ) {
  880. this.$message({
  881. message: '卖方电话长度不符合要求,请输入7到20个字符之内!',
  882. type: 'warning',
  883. })
  884. return
  885. }
  886. if (!this.deptBudgetList.acceptanceMethod) {
  887. this.$message({
  888. message: '请选择验收方式',
  889. type: 'warning',
  890. })
  891. return
  892. }
  893. if (!this.deptBudgetList.weight) {
  894. this.$message({
  895. message: '请输入重量!',
  896. type: 'warning',
  897. })
  898. return
  899. }
  900. if (
  901. isNaN(this.deptBudgetList.weight) ||
  902. (String(this.deptBudgetList.weight).indexOf('.') != -1 &&
  903. String(this.deptBudgetList.weight).length -
  904. (String(this.deptBudgetList.weight).indexOf('.') + 1) >
  905. 3) ||
  906. this.deptBudgetList.weight < 0 ||
  907. this.deptBudgetList.weight > 200000
  908. ) {
  909. this.$message({
  910. message: '输入重量有误!',
  911. type: 'warning',
  912. })
  913. return
  914. }
  915. if (!this.deptBudgetList.deliveryDateStart) {
  916. this.$message({
  917. message: '请选择交货日期(起)',
  918. type: 'warning',
  919. })
  920. return
  921. }
  922. if (!this.deptBudgetList.overShort) {
  923. this.$message({
  924. message: '请输入溢短装!',
  925. type: 'warning',
  926. })
  927. return
  928. }
  929. if (
  930. isNaN(this.deptBudgetList.overShort) ||
  931. (String(this.deptBudgetList.overShort).indexOf('.') != -1 &&
  932. String(this.deptBudgetList.overShort).length -
  933. (String(this.deptBudgetList.overShort).indexOf('.') + 1) >
  934. 2) ||
  935. this.deptBudgetList.overShort < 0 ||
  936. this.deptBudgetList.overShort > 50
  937. ) {
  938. this.$message({
  939. message: '溢短装输入有误!',
  940. type: 'warning',
  941. })
  942. return
  943. }
  944. if (!this.deptBudgetList.deliveryDateEnd) {
  945. this.$message({
  946. message: '请选择交货日期(止)',
  947. type: 'warning',
  948. })
  949. return
  950. }
  951. //时间
  952. if (
  953. new Date(this.deptBudgetList.deliveryDateStart).getTime() >
  954. new Date(this.deptBudgetList.deliveryDateEnd).getTime()
  955. ) {
  956. this.$message({
  957. message: '交货日期(止)选择错误',
  958. type: 'warning',
  959. })
  960. return
  961. }
  962. if (!this.deptBudgetList.unitContractPrice) {
  963. this.$message({
  964. message: '请输入合同单价!',
  965. type: 'warning',
  966. })
  967. return
  968. }
  969. if (
  970. isNaN(this.deptBudgetList.unitContractPrice) ||
  971. (String(this.deptBudgetList.unitContractPrice).indexOf('.') != -1 &&
  972. String(this.deptBudgetList.unitContractPrice).length -
  973. (String(this.deptBudgetList.unitContractPrice).indexOf('.') + 1) >
  974. 2) ||
  975. this.deptBudgetList.unitContractPrice <= 0 ||
  976. this.deptBudgetList.unitContractPrice > 10000
  977. ) {
  978. this.$message({
  979. message: '合同单价输入有误!',
  980. type: 'warning',
  981. })
  982. return
  983. }
  984. if (!this.deptBudgetList.totalContractPrice) {
  985. this.$message({
  986. message: '请输入合同总价!',
  987. type: 'warning',
  988. })
  989. return
  990. }
  991. if (
  992. isNaN(this.deptBudgetList.totalContractPrice) ||
  993. (String(this.deptBudgetList.totalContractPrice).indexOf('.') != -1 &&
  994. String(this.deptBudgetList.totalContractPrice).length -
  995. (String(this.deptBudgetList.totalContractPrice).indexOf('.') + 1) >
  996. 2) ||
  997. this.deptBudgetList.totalContractPrice <= 0 ||
  998. this.deptBudgetList.totalContractPrice > 1000000000
  999. ) {
  1000. this.$message({
  1001. message: '合同总价输入有误!',
  1002. type: 'warning',
  1003. })
  1004. return
  1005. }
  1006. if (!this.newSelectedOptions) {
  1007. this.$message({
  1008. message: '请选择货源所在地区!',
  1009. type: 'warning',
  1010. })
  1011. return
  1012. }
  1013. if (!this.deptBudgetList.sourceGoods) {
  1014. this.$message({
  1015. message: '请输入货源详细地址!',
  1016. type: 'warning',
  1017. })
  1018. return
  1019. }
  1020. if (!this.newSelectedOptions1) {
  1021. this.$message({
  1022. message: '请选择交货所在地区!',
  1023. type: 'warning',
  1024. })
  1025. return
  1026. }
  1027. if (!this.deptBudgetList.placeDelivery) {
  1028. this.$message({
  1029. message: '请输入交货详细地址!',
  1030. type: 'warning',
  1031. })
  1032. return
  1033. }
  1034. if (!this.deptBudgetList.signingDate) {
  1035. this.$message({
  1036. message: '请选择签订日期',
  1037. type: 'warning',
  1038. })
  1039. return
  1040. }
  1041. if (
  1042. isNaN(this.deptBudgetList.finalTradingVolume) ||
  1043. (String(this.deptBudgetList.finalTradingVolume).indexOf('.') != -1 &&
  1044. String(this.deptBudgetList.finalTradingVolume).length -
  1045. (String(this.deptBudgetList.finalTradingVolume).indexOf('.') + 1) >
  1046. 3) ||
  1047. this.deptBudgetList.finalTradingVolume < 0 ||
  1048. this.deptBudgetList.finalTradingVolume > 200000
  1049. ) {
  1050. this.$message({
  1051. message: '最终实际成交量有误!',
  1052. type: 'warning',
  1053. })
  1054. return
  1055. }
  1056. //货物信息
  1057. if (!this.deptBudgetList.contractGoodsInfo.goodsName) {
  1058. this.$message({
  1059. message: '请选择货名',
  1060. type: 'warning',
  1061. })
  1062. return
  1063. }
  1064. if (!this.deptBudgetList.contractGoodsInfo.waterContent) {
  1065. this.$message({
  1066. message: '请输入水分',
  1067. type: 'warning',
  1068. })
  1069. return
  1070. }
  1071. if (
  1072. this.deptBudgetList.contractGoodsInfo.waterContent &&
  1073. String(this.deptBudgetList.contractGoodsInfo.waterContent).indexOf('.') != -1 &&
  1074. String(this.deptBudgetList.contractGoodsInfo.waterContent).length -
  1075. (String(this.deptBudgetList.contractGoodsInfo.waterContent).indexOf('.') + 1) >
  1076. 2 || this.deptBudgetList.contractGoodsInfo.waterContent > 40 || this.deptBudgetList.contractGoodsInfo
  1077. .waterContent < 0
  1078. ) {
  1079. this.$message({
  1080. message: '水分输入错误',
  1081. type: 'warning',
  1082. })
  1083. return
  1084. }
  1085. if (!this.deptBudgetList.contractGoodsInfo.grade) {
  1086. this.$message({
  1087. message: '请选择品级',
  1088. type: 'warning',
  1089. })
  1090. return
  1091. }
  1092. if (!this.deptBudgetList.contractGoodsInfo.impurity) {
  1093. this.$message({
  1094. message: '请输入杂质',
  1095. type: 'warning',
  1096. })
  1097. return
  1098. }
  1099. if (
  1100. this.deptBudgetList.contractGoodsInfo.impurity &&
  1101. String(this.deptBudgetList.contractGoodsInfo.impurity).indexOf('.') != -1 &&
  1102. String(this.deptBudgetList.contractGoodsInfo.impurity).length -
  1103. (String(this.deptBudgetList.contractGoodsInfo.impurity).indexOf('.') + 1) >
  1104. 2 || this.deptBudgetList.contractGoodsInfo.impurity > 40 || this.deptBudgetList.contractGoodsInfo.impurity < 0
  1105. ) {
  1106. this.$message({
  1107. message: '杂质输入错误',
  1108. type: 'warning',
  1109. })
  1110. return
  1111. }
  1112. if (!this.deptBudgetList.contractGoodsInfo.bulkDensity) {
  1113. this.$message({
  1114. message: '请输入容重',
  1115. type: 'warning',
  1116. })
  1117. return
  1118. }
  1119. if (
  1120. (this.deptBudgetList.contractGoodsInfo.bulkDensity &&
  1121. String(this.deptBudgetList.contractGoodsInfo.bulkDensity).indexOf('.') != -1 &&
  1122. String(this.deptBudgetList.contractGoodsInfo.bulkDensity).length -
  1123. (String(this.deptBudgetList.contractGoodsInfo.bulkDensity).indexOf('.') + 1) >
  1124. 2) || this.deptBudgetList.contractGoodsInfo.bulkDensity > 1000 || this.deptBudgetList.contractGoodsInfo
  1125. .bulkDensity < 0
  1126. ) {
  1127. this.$message({
  1128. message: '容重输入错误',
  1129. type: 'warning',
  1130. })
  1131. return
  1132. }
  1133. if (!this.deptBudgetList.contractGoodsInfo.mildewGrain) {
  1134. this.$message({
  1135. message: '请输入霉变粒',
  1136. type: 'warning',
  1137. })
  1138. return
  1139. }
  1140. if (
  1141. !this.deptBudgetList.contractGoodsInfo.mildewGrain ||
  1142. (String(this.deptBudgetList.contractGoodsInfo.mildewGrain).indexOf(
  1143. '.'
  1144. ) != -1 &&
  1145. String(this.deptBudgetList.contractGoodsInfo.mildewGrain).length -
  1146. (String(this.deptBudgetList.contractGoodsInfo.mildewGrain).indexOf(
  1147. '.'
  1148. ) +
  1149. 1) >
  1150. 2 || this.deptBudgetList.contractGoodsInfo.mildewGrain > 40 || this.deptBudgetList.contractGoodsInfo
  1151. .mildewGrain < 0)
  1152. ) {
  1153. this.$message({
  1154. message: '霉变粒输入错误',
  1155. type: 'warning',
  1156. })
  1157. return
  1158. }
  1159. if (!this.deptBudgetList.contractGoodsInfo.jiaorenli) {
  1160. this.$message({
  1161. message: '请输入热损伤',
  1162. type: 'warning',
  1163. })
  1164. return
  1165. }
  1166. if (
  1167. !this.deptBudgetList.contractGoodsInfo.jiaorenli ||
  1168. (String(this.deptBudgetList.contractGoodsInfo.jiaorenli).indexOf('.') !=
  1169. -1 &&
  1170. String(this.deptBudgetList.contractGoodsInfo.jiaorenli).length -
  1171. (String(this.deptBudgetList.contractGoodsInfo.jiaorenli).indexOf(
  1172. '.'
  1173. ) +
  1174. 1) >
  1175. 2 || this.deptBudgetList.contractGoodsInfo.jiaorenli > 40 || this.deptBudgetList.contractGoodsInfo
  1176. .jiaorenli < 0)
  1177. ) {
  1178. this.$message({
  1179. message: '热损伤输入错误',
  1180. type: 'warning',
  1181. })
  1182. return
  1183. }
  1184. if (!this.deptBudgetList.contractGoodsInfo.imperfectGrain) {
  1185. this.$message({
  1186. message: '请输入不完善粒',
  1187. type: 'warning',
  1188. })
  1189. return
  1190. }
  1191. if (
  1192. !this.deptBudgetList.contractGoodsInfo.imperfectGrain ||
  1193. (String(this.deptBudgetList.contractGoodsInfo.imperfectGrain).indexOf(
  1194. '.'
  1195. ) != -1 &&
  1196. String(this.deptBudgetList.contractGoodsInfo.imperfectGrain).length -
  1197. (String(
  1198. this.deptBudgetList.contractGoodsInfo.imperfectGrain
  1199. ).indexOf('.') +
  1200. 1) >
  1201. 2 || this.deptBudgetList.contractGoodsInfo.imperfectGrain > 40 || this.deptBudgetList.contractGoodsInfo
  1202. .imperfectGrain < 0)
  1203. ) {
  1204. this.$message({
  1205. message: '不完善粒输入错误',
  1206. type: 'warning',
  1207. })
  1208. return
  1209. }
  1210. // if (
  1211. // (!this.deptBudgetList.contractProcessInfo.goodsNameKey > 1000000000) ||
  1212. // (this.deptBudgetList.contractProcessInfo.goodsNameKey < 100) ||
  1213. // (String(this.deptBudgetList.contractProcessInfo.goodsNameKey).indexOf(
  1214. // '.'
  1215. // ) != -1 &&
  1216. // String(this.deptBudgetList.contractProcessInfo.goodsNameKey).length -
  1217. // (String(
  1218. // this.deptBudgetList.contractProcessInfo.goodsNameKey
  1219. // ).indexOf('.') +
  1220. // 1) >
  1221. // 2)
  1222. // ) {
  1223. // this.$message({
  1224. // message: '合同收入金额输入错误',
  1225. // type: 'warning',
  1226. // })
  1227. // return
  1228. // }
  1229. if (
  1230. (this.deptBudgetList.contractProcessInfo.waterContent > 10000000) ||
  1231. (this.deptBudgetList.contractProcessInfo.waterContent < 0) ||
  1232. (String(this.deptBudgetList.contractProcessInfo.waterContent).indexOf(
  1233. '.'
  1234. ) != -1 &&
  1235. String(this.deptBudgetList.contractProcessInfo.waterContent).length -
  1236. (String(
  1237. this.deptBudgetList.contractProcessInfo.waterContent
  1238. ).indexOf('.') +
  1239. 1) >
  1240. 2)
  1241. ) {
  1242. this.$message({
  1243. message: '费用支出输入错误',
  1244. type: 'warning',
  1245. })
  1246. return
  1247. }
  1248. if (
  1249. (this.deptBudgetList.contractProcessInfo.goodsName > 1000000000) |
  1250. (this.deptBudgetList.contractProcessInfo.goodsName < 0) ||
  1251. (String(this.deptBudgetList.contractProcessInfo.goodsName).indexOf(
  1252. '.'
  1253. ) != -1 &&
  1254. String(this.deptBudgetList.contractProcessInfo.goodsName).length -
  1255. (String(this.deptBudgetList.contractProcessInfo.goodsName).indexOf(
  1256. '.'
  1257. ) +
  1258. 1) >
  1259. 2)
  1260. ) {
  1261. this.$message({
  1262. message: '已开发票金额输入错误',
  1263. type: 'warning',
  1264. })
  1265. return
  1266. }
  1267. if (
  1268. (this.deptBudgetList.contractProcessInfo.impurity > 1000000000) |
  1269. (this.deptBudgetList.contractProcessInfo.impurity < 0) ||
  1270. (String(this.deptBudgetList.contractProcessInfo.impurity).indexOf(
  1271. '.'
  1272. ) != -1 &&
  1273. String(this.deptBudgetList.contractProcessInfo.impurity).length -
  1274. (String(this.deptBudgetList.contractProcessInfo.impurity).indexOf(
  1275. '.'
  1276. ) +
  1277. 1) >
  1278. 2)
  1279. ) {
  1280. this.$message({
  1281. message: '未开发票金额输入错误',
  1282. type: 'warning',
  1283. })
  1284. return
  1285. }
  1286. if (
  1287. (!this.deptBudgetList.contractProcessInfo.mildewGrain > 1000000000) |
  1288. (this.deptBudgetList.contractProcessInfo.mildewGrain < 0) ||
  1289. (String(this.deptBudgetList.contractProcessInfo.mildewGrain).indexOf(
  1290. '.'
  1291. ) != -1 &&
  1292. String(this.deptBudgetList.contractProcessInfo.mildewGrain).length -
  1293. (String(
  1294. this.deptBudgetList.contractProcessInfo.mildewGrain
  1295. ).indexOf('.') +
  1296. 1) >
  1297. 2)
  1298. ) {
  1299. this.$message({
  1300. message: '未回款金额输入错误',
  1301. type: 'warning',
  1302. })
  1303. return
  1304. }
  1305. this.$refs.deptBudgetList.validate((valid) => {
  1306. if (valid) {
  1307. this.deptBudgetList.compId = this.compId
  1308. this.deptBudgetList.contractType = 2
  1309. this.deptBudgetList.goodsType = 1
  1310. addList(this.deptBudgetList)
  1311. .toPromise()
  1312. .then((response) => {
  1313. // 存储买方、卖方、买方电话、卖方电话
  1314. let _data = {
  1315. byer: this.deptBudgetList.buyer,
  1316. seller: this.deptBudgetList.seller,
  1317. buyerPhone: this.deptBudgetList.buyerPhone,
  1318. sellerPhone: this.deptBudgetList.sellerPhone
  1319. }
  1320. if (this.restaurants1.length <= 20) {
  1321. this.restaurants1 = this.restaurants1.filter(function(val) {
  1322. if (val.value != _data.byer) {
  1323. return val
  1324. }
  1325. })
  1326. this.restaurants1.unshift({
  1327. value: _data.byer
  1328. })
  1329. } else {
  1330. this.restaurants1.unshift({
  1331. value: _data.byer
  1332. }).pop({
  1333. value: _data.byer
  1334. })
  1335. }
  1336. localStorage.setItem('deptBudgetList_data1', JSON.stringify(this.restaurants1));
  1337. if (this.restaurants2.length <= 20) {
  1338. this.restaurants2 = this.restaurants2.filter(function(val) {
  1339. if (val.value != _data.seller) {
  1340. return val
  1341. }
  1342. })
  1343. this.restaurants2.unshift({
  1344. value: _data.seller
  1345. })
  1346. } else {
  1347. this.restaurants2.unshift({
  1348. value: _data.seller
  1349. }).pop({
  1350. value: _data.seller
  1351. })
  1352. }
  1353. localStorage.setItem('deptBudgetList_data2', JSON.stringify(this.restaurants2));
  1354. if (this.restaurants2.length <= 20) {
  1355. this.restaurants3 = this.restaurants3.filter(function(val) {
  1356. if (val.value != _data.buyerPhone) {
  1357. return val
  1358. }
  1359. })
  1360. this.restaurants3.unshift({
  1361. value: _data.buyerPhone
  1362. })
  1363. } else {
  1364. this.restaurants3.unshift({
  1365. value: _data.buyerPhone
  1366. }).pop({
  1367. value: _data.buyerPhone
  1368. })
  1369. }
  1370. localStorage.setItem('deptBudgetList_data3', JSON.stringify(this.restaurants3));
  1371. if (this.restaurants4.length <= 20) {
  1372. this.restaurants4 = this.restaurants3.filter(function(val) {
  1373. if (val.value != _data.sellerPhone) {
  1374. return val
  1375. }
  1376. })
  1377. this.restaurants4.unshift({
  1378. value: _data.sellerPhone
  1379. })
  1380. } else {
  1381. this.restaurants4.unshift({
  1382. value: _data.sellerPhone
  1383. }).pop({
  1384. value: _data.sellerPhone
  1385. })
  1386. }
  1387. localStorage.setItem('deptBudgetList_data4', JSON.stringify(this.restaurants4));
  1388. this.$message.success('添加成功')
  1389. this.deptBudgetList = {
  1390. deliverType: '1',
  1391. agreementType: '采购合同',
  1392. finalTradingVolume: 0,
  1393. totalContractPrice: 0,
  1394. contractGoodsInfo: {
  1395. goodsName: '',
  1396. },
  1397. contractProcessInfo: {},
  1398. addressUrl: '',
  1399. }
  1400. this.$router.push({
  1401. path: 'buyContract'
  1402. })
  1403. })
  1404. } else {
  1405. EventBus.$emit('error', this.$t('showMessage.asteriskRequired'))
  1406. return false
  1407. }
  1408. })
  1409. },
  1410. resetForm(deptBudgetList) {
  1411. this.$refs[deptBudgetList].resetFields()
  1412. },
  1413. //选择合同类型
  1414. selectType(e) {
  1415. for (var i = 0; i < this.invoiceList.length; i++) {
  1416. if (this.agreementList[i].constValue == e) {
  1417. this.deptBudgetList.agreementType = this.agreementList[i].constValue
  1418. }
  1419. }
  1420. },
  1421. addClick() {
  1422. this.unitList.push({
  1423. flag: 'add',
  1424. constValue: '',
  1425. constKey: '',
  1426. })
  1427. },
  1428. saveClick(item, index) {
  1429. if (Object.is(item.id, 1)) {
  1430. return
  1431. }
  1432. if (Object.is(this.unitList[index].flag, 'delete')) {
  1433. this.$set(this.unitList, index, {
  1434. flag: 'check'
  1435. })
  1436. } else {
  1437. this.$set(this.unitList, index, {
  1438. flag: 'delete'
  1439. })
  1440. }
  1441. if (!item.constValue) {
  1442. this.unitList.splice(index, 1)
  1443. return
  1444. }
  1445. if (item.flag == 'add') {
  1446. item.constKey = Math.random() * 20
  1447. this.acceptanceCheck.compId = this.compId
  1448. this.acceptanceCheck.constKey = item.constKey
  1449. this.acceptanceCheck.constCode = 'TYPEYAN'
  1450. this.acceptanceCheck.constValue = item.constValue
  1451. this.acceptanceCheck.id = item.id
  1452. addxiala(this.acceptanceCheck)
  1453. .toPromise()
  1454. .then((response) => {
  1455. this.getUnitList()
  1456. })
  1457. } else if (item.flag == 'check') {
  1458. this.acceptanceCheck.compId = this.compId
  1459. this.acceptanceCheck.constKey = item.constKey
  1460. this.acceptanceCheck.constCode = 'TYPEYAN'
  1461. this.acceptanceCheck.constValue = item.constValue
  1462. this.acceptanceCheck.id = item.id
  1463. editxiala(this.acceptanceCheck)
  1464. .toPromise()
  1465. .then((response) => {
  1466. this.getUnitList()
  1467. })
  1468. }
  1469. },
  1470. selectChapterTwo(e) {
  1471. for (var i = 0; i < this.ChapterTwoList.length; i++) {
  1472. if (this.ChapterTwoList[i].constValue == e) {
  1473. this.deptBudgetList.gradeKey = this.ChapterTwoList[i].constKey
  1474. }
  1475. }
  1476. },
  1477. selectunitList(e) {
  1478. for (var i = 0; i < this.unitList.length; i++) {
  1479. if (this.unitList[i].constValue == e) {
  1480. this.deptBudgetList.acceptanceMethodKey = this.unitList[i].constKey
  1481. }
  1482. }
  1483. },
  1484. selectgrade(e) {
  1485. for (var i = 0; i < this.gradeList.length; i++) {
  1486. if (this.gradeList[i].constValue == e) {
  1487. this.deptBudgetList.gradeKey = this.gradeList[i].constKey
  1488. this.deptBudgetList.contractGoodsInfo.gradeKey =
  1489. this.gradeList[i].constKey
  1490. }
  1491. }
  1492. },
  1493. selectgoodsName(e) {
  1494. for (var i = 0; i < this.goodnameList.length; i++) {
  1495. if (this.goodnameList[i].constValue == e) {
  1496. this.deptBudgetList.goodsNameKey = this.goodnameList[i].constKey
  1497. this.deptBudgetList.contractGoodsInfo.goodsNameKey = this.goodnameList[i].constKey
  1498. }
  1499. }
  1500. },
  1501. selectpackingMethod(e) {
  1502. for (var i = 0; i < this.packtypeList.length; i++) {
  1503. if (this.packtypeList[i].constValue == e) {
  1504. this.deptBudgetList.packingMethodKey = this.packtypeList[i].constKey
  1505. }
  1506. }
  1507. },
  1508. // 编辑
  1509. editClick(item, index) {
  1510. const map = JSON.parse(JSON.stringify(item))
  1511. if (Object.is(item.id, 1)) {
  1512. return
  1513. }
  1514. if (Object.is(this.unitList[index].flag, 'delete')) {
  1515. map.flag = 'check'
  1516. this.$set(this.unitList, index, map)
  1517. } else {
  1518. map.flag = 'delete'
  1519. this.$set(this.unitList, index, map)
  1520. }
  1521. },
  1522. // 删除
  1523. deleteClick(item, index) {
  1524. if (Object.is(item.constKey, 1)) {
  1525. return
  1526. }
  1527. if (!item.constValue) {
  1528. this.unitList.splice(index, 1)
  1529. return
  1530. }
  1531. delxiala({
  1532. id: this.unitList[index].id
  1533. })
  1534. .toPromise()
  1535. .then((response) => {
  1536. this.getUnitList()
  1537. this.pleaseChoose = ''
  1538. })
  1539. },
  1540. },
  1541. }
  1542. </script>
  1543. <style lang="scss" scoped>
  1544. .el-form {
  1545. padding: 0 15%;
  1546. }
  1547. /deep/.ws-info-table .el-form-item {
  1548. border-right: 1px solid #cdd2dc;
  1549. border-bottom: 1px solid #cdd2dc;
  1550. }
  1551. .readonly {
  1552. position: relative;
  1553. }
  1554. .readonly:after {
  1555. content: '*';
  1556. color: #ff2727;
  1557. position: absolute;
  1558. right: 8px;
  1559. z-index: 10;
  1560. top: 21%;
  1561. font-size: 20px;
  1562. }
  1563. .title {
  1564. position: relative;
  1565. }
  1566. .title::before {
  1567. content: '';
  1568. display: inline-block;
  1569. width: 5px;
  1570. height: 30px;
  1571. background: #5473e8;
  1572. position: absolute;
  1573. left: 0;
  1574. }
  1575. .el-button--primary {
  1576. background-color: #5878e8;
  1577. border-color: #5878e8;
  1578. }
  1579. .el-col {
  1580. background: #f6f7fc;
  1581. }
  1582. /deep/.ws-info-table .el-form-item .el-form-item__content {
  1583. padding: 0 25px;
  1584. border-left: 1px solid #cdd2dc;
  1585. background: #fafbfc;
  1586. }
  1587. /deep/.ws-info-table .el-form-item .el-form-item__label {
  1588. width: 140px;
  1589. text-align: center;
  1590. background: #f0f2f6;
  1591. // border: 1px solid #cdd2dc;
  1592. }
  1593. .button-container {
  1594. display: flex;
  1595. flex-wrap: nowrap;
  1596. justify-content: space-between;
  1597. align-items: center;
  1598. background-color: #fff;
  1599. width: 100%;
  1600. height: 50px;
  1601. padding: 0 10px;
  1602. &>div {
  1603. margin-left: 10px;
  1604. display: flex;
  1605. flex-wrap: nowrap;
  1606. flex-direction: row;
  1607. &>span {
  1608. line-height: 50px;
  1609. }
  1610. }
  1611. /deep/.auditFlow-box {
  1612. position: unset;
  1613. margin-left: 10px;
  1614. &/deep/.auditFlow-icon {
  1615. width: auto;
  1616. padding-right: 30px;
  1617. }
  1618. &/deep/.auditFlow-main {
  1619. position: absolute;
  1620. }
  1621. }
  1622. }
  1623. .box-app {
  1624. display: inline-block;
  1625. float: left;
  1626. margin-left: 30px;
  1627. line-height: 50px;
  1628. }
  1629. /deep/.el-dialog {
  1630. .el-form-item {
  1631. margin-bottom: 0 !important;
  1632. .el-input--medium {
  1633. textarea {
  1634. min-height: 100px !important;
  1635. }
  1636. }
  1637. }
  1638. }
  1639. .collapse-bottom {
  1640. margin-bottom: 20px;
  1641. }
  1642. .input-main .textarea .el-textarea__inner {
  1643. width: 100%;
  1644. z-index: 1;
  1645. }
  1646. .bg-left {
  1647. padding-left: 30px;
  1648. }
  1649. .bg-right {
  1650. padding-right: 10px;
  1651. text-align: right;
  1652. }
  1653. .bg-bottom {
  1654. margin: 15px 0px;
  1655. }
  1656. .wenzi h3 {
  1657. display: inline-block;
  1658. left: 10px;
  1659. }
  1660. .wenzi p {
  1661. display: inline-block;
  1662. }
  1663. .upload-demo {
  1664. margin-top: 10px;
  1665. }
  1666. .center {
  1667. width: 70%;
  1668. margin: 0 auto;
  1669. }
  1670. .el-form-item {
  1671. width: 50%;
  1672. }
  1673. .el-form-item__label {
  1674. text-align: center;
  1675. }
  1676. .ce {
  1677. width: 900px;
  1678. margin: 0 auto;
  1679. }
  1680. /*.crt-main .textarea /deep/ .el-form-item__label {*/
  1681. /* height: 82px;*/
  1682. /*}*/
  1683. // 控制select为只读的时候显示样式
  1684. .hide-sel {
  1685. .el-input__inner {
  1686. border: 0px;
  1687. }
  1688. .el-icon-arrow-up {
  1689. display: none;
  1690. }
  1691. .el-textarea__inner {
  1692. background-color: #fff !important;
  1693. border: 0;
  1694. }
  1695. .el-date-editor {
  1696. i {
  1697. display: none;
  1698. }
  1699. }
  1700. .is-disabled {
  1701. .el-input__inner:hover {
  1702. background-color: #fff !important;
  1703. border: 0;
  1704. }
  1705. color: #606266;
  1706. .el-input__inner {
  1707. background-color: #fff !important;
  1708. border: 0;
  1709. color: #606266;
  1710. }
  1711. .el-textarea__inner {
  1712. background-color: #fff !important;
  1713. border: 0;
  1714. color: #606266;
  1715. }
  1716. }
  1717. }
  1718. // 控制select为只读的时候显示样式
  1719. /deep/.ws-class-table-col {
  1720. height: auto;
  1721. padding: 0px 2px;
  1722. /deep/.el-input__inner {
  1723. padding: 0px 2px;
  1724. }
  1725. }
  1726. /deep/.is-disabled {
  1727. .el-input__prefix,
  1728. .el-input__suffix {
  1729. display: none;
  1730. }
  1731. .el-input__inner {
  1732. background-color: #fff;
  1733. border-color: #fff !important;
  1734. color: #000 !important;
  1735. font-size: 14px;
  1736. cursor: text;
  1737. padding: 0 !important;
  1738. }
  1739. }
  1740. .winseaview-view {
  1741. padding: 0 0 20px;
  1742. }
  1743. .container {
  1744. overflow: scroll;
  1745. height: 93vh;
  1746. }
  1747. /deep/.ws-info-table[data-v-850a44a6] .el-form-item .el-form-item__label {
  1748. width: 130px;
  1749. }
  1750. .el-textarea {
  1751. width: 101%;
  1752. }
  1753. .addressUrls {
  1754. width: 100%;
  1755. display: flex;
  1756. margin-top: 10px;
  1757. }
  1758. .addressUrls-item {
  1759. position: relative;
  1760. display: flex;
  1761. }
  1762. .icon-guanbi {
  1763. position: absolute;
  1764. right: 8px;
  1765. }
  1766. .addressUrl {
  1767. margin: 0px 10px;
  1768. border-radius: 3px;
  1769. }
  1770. //上传文件成功标识
  1771. /deep/.el-upload-list__item-status-label {
  1772. position: absolute;
  1773. right: 22px;
  1774. top: -1px;
  1775. line-height: inherit;
  1776. display: none;
  1777. }
  1778. .map {
  1779. position: fixed;
  1780. top: 0;
  1781. bottom: 0;
  1782. left: 0;
  1783. right: 0;
  1784. margin: auto;
  1785. width: 850px;
  1786. height: 400px;
  1787. background: gainsboro;
  1788. border-radius: 20px;
  1789. padding: 10px;
  1790. box-sizing: border-box;
  1791. z-index: 99;
  1792. }
  1793. .amap-container {
  1794. width: 100% !important;
  1795. }
  1796. .address-btn {
  1797. width: 100%;
  1798. text-align: left;
  1799. }
  1800. .inline-input {
  1801. width: 100%;
  1802. }
  1803. </style>